jQuery tab軟件產品標簽切換代碼

jQuery制作云主機軟件產品網格布局，分類標簽tab切換效果代碼。

使用方法：

1、head引入css文件

<link rel="stylesheet" type="text/css" href="statics/css/style.css" />

2、head引入js文件

<script src="statics/js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>

3、body引入HTML代碼

<div class="pavilion-container">
	<div class="layer-title">主機館</div>
	<div class="pavilion-inner">
		<ul class="tabs overflow-hide">
			<li class="hot-use on">
				<span class="hot-icon on"></span><span>熱門應用</span></li>
			<li>
				<a href="#">企業(yè)上云</a>
			</li>

			<li>智能制造</li>

			<li>智慧城市</li>

			<li>
				<a href="#">視頻</a>
			</li>

			<li>安全</li>

			<li>
				<a href="#">服務</a>
			</li>

			<li>API</li>

			<li>物聯網</li>

			<li>開發(fā)者生態(tài)</li>

		</ul>
		<div class="tab-content-wrap">
			<div class="tab-content overflow-hide show">
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20181207003226_48320.png" width="65">
							<h3>泰克雙創(chuàng)實踐云平臺</h3>
							<p>基于云主機建設的多功能教育實訓平臺</p>
							<div class="labels">
								<a href="#"><span>教育</span></a>
								<a href="#"><span>智慧城市</span></a>
							</div>
							<div class="time"><span>￥1550000</span>/年</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914004240_63818.png" width="65">
							<h3>解放云盤</h3>
							<p>服務于企業(yè)的文件存儲、管理與協作云平臺</p>
							<div class="time"><span>￥1155</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914004225_25148.png" width="65">
							<h3>虛擬化下一代防火墻</h3>
							<p>為公有云VPC租戶提供安全防護</p>
							<div class="time"><span>￥1600</span>/年</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914004133_95340.png" width="65">
							<h3>智迅云客服</h3>
							<p>新一代的云客服解決方案</p>
							<div class="time"><span>￥180</span>/月</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180927165101_76366.png" width="65">
							<h3>玖欣工業(yè)云平臺</h3>
							<p>助力企業(yè)快速部署工業(yè)互聯網平臺</p>
							<div class="time"><span>￥150100</span>/年</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>中標文通文檔管理系統(tǒng)V3.0</h3>
							<div class="time"><span>￥160</span>/月</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>云評估-中軟國際版</h3>
							<div class="time"><span>￥6000</span>/次</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>視頻云服務套餐</h3>
							<div class="time"><span>￥3600</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>智慧教育大數據云平臺</h3>
							<div class="time"><span>￥4500000</span>/年</div>
						</a>
					</div>
				</div>
			</div>
			<div class="tab-content overflow-hide">
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180913233155_16242.png" width="65">
							<h3>金華威云視頻會議</h3>
							<p>高品質的面對面視訊溝通云服務</p>
							<div class="labels">
								<a href="#"><span>教育</span></a>
								<a href="#"><span>協同辦公</span></a>
								<a href="#"><span>視頻應用</span></a>
								<a href="#"><span>咨詢與培訓</span></a>
								<a href="#"><span>電商</span></a>
								<a href="#"><span>嚴選自營</span></a>
								<a href="#"><span>云通信</span></a>
								<a href="#"><span>企業(yè)服務</span></a>
							</div>
							<div class="time"><span>￥800</span>/年</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180913233104_95322.png" width="65">
							<h3>解放云盤</h3>
							<p>企業(yè)文件存儲管理與協作云平臺</p>
							<div class="time"><span>￥1155</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180913233119_30515.png" width="65">
							<h3>AnyShare Cloud企業(yè)云盤服務</h3>
							<p>統(tǒng)一管理、高效便捷的統(tǒng)一存儲平臺</p>
							<div class="time"><span>￥1280</span>/月</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180913233138_80288.png" width="65">
							<h3>智迅云客服</h3>
							<p>新一代的云客服解決方案</p>
							<div class="time"><span>￥180</span>/月</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180913233229_26206.png" width="65">
							<h3>漢得SRM</h3>
							<p>為企業(yè)打造智能敏捷高效合規(guī)的供應體系</p>
							<div class="time"><span>￥3600</span>/月</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>U8 cloud</h3>
							<div class="time"><span>￥13500</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>心通達OA</h3>
							<div class="time"><span>免費</span></div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>迅響響應式模板網站</h3>
							<div class="time"><span>￥1</span>/月</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>迅響響應式定制建站</h3>
							<div class="time"><span>￥800</span>/年</div>
						</a>
					</div>
				</div>
			</div>
			<div class="tab-content overflow-hide">
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20190111204349_64066.png" width="65">
							<h3>協同設計云套餐</h3>
							<p>提供云化CAD以及數據管理平臺</p>
							<div class="labels">
								<a href="#"><span>智能制造</span></a>
								<a href="#"><span>模組開發(fā)</span></a>
								<a href="#"><span>云設計</span></a>
								<a href="#"><span>工業(yè)互聯網</span></a>
							</div>
							<div class="time"><span>￥49650</span>/年</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20190111205625_10722.png" width="65">
							<h3>工業(yè)云仿真定制包</h3>
							<p>集網盤盤和高性能計算調度與一體</p>
							<div class="time"><span>￥66300</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20190111210543_61980.png" width="65">
							<h3>MixIOT工業(yè)互聯網平臺</h3>
							<p>融合數據采集、存儲、處理、分析與應用</p>
							<div class="time"><span>￥10000</span>/次</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180927162750_34746.png" width="65">
							<h3>玖欣工業(yè)云平臺</h3>
							<p>助力企業(yè)快速部署工業(yè)互聯網平臺</p>
							<div class="time"><span>￥150100</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20190111214657_89818.png" width="65">
							<h3>智能裝備云定制包</h3>
							<p>讓裝備輕松上云，為裝備制造業(yè)提供專業(yè)智能服務的解決方案。</p>
							<div class="time"><span>￥26960</span>/年</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>離散型生產管理系統(tǒng)</h3>
							<div class="time"><span>￥200000</span>/次</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>車馬帥TMS運輸管理系統(tǒng)</h3>
							<div class="time"><span>￥5600</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>thingcom物聯網技術平臺</h3>
							<div class="time"><span>￥2000000</span>/次</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>極動云物聯網云平臺</h3>
							<div class="time"><span>￥90000</span>/次</div>
						</a>
					</div>
				</div>
			</div>
			<div class="tab-content overflow-hide">
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180914004529_22414.png" width="65">
							<h3>泰克雙創(chuàng)實踐云平臺</h3>
							<p>基于云主機建設的多功能教育實訓平臺</p>
							<div class="labels">
								<a href="#"><span>教育</span></a>
								<a href="#"><span>智慧城市</span></a>
							</div>
							<div class="time"><span>￥1550000</span>/年</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914004610_58013.png" width="65">
							<h3>智慧教育大數據云平臺</h3>
							<p>構建個性化、精準化、多樣化教育大數據云平臺</p>
							<div class="time"><span>￥4500000</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914004656_69539.png" width="65">
							<h3>網格化監(jiān)測服務</h3>
							<p>提供污染數據采集、分析、審核等服務</p>
							<div class="time"><span>￥1500000</span>/年</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914004722_45420.png" width="65">
							<h3>全域旅游云</h3>
							<p>針對全域旅游建設的智慧管理的整體服務</p>
							<div class="time"><span>￥220000</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914004810_57256.png" width="65">
							<h3>擎天數字生態(tài)城市</h3>
							<p>全方位輔助企業(yè)實現碳資產的自我管理</p>
							<div class="time"><span>￥2500000</span>/次</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>揚塵視頻監(jiān)控服務</h3>
							<div class="time"><span>￥3000000</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>預測預警分析模型服務</h3>
							<div class="time"><span>￥1000000</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>中小學智慧校園解決方案</h3>
							<div class="time"><span>￥1000000</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>智慧景區(qū)管理服務系統(tǒng)</h3>
							<div class="time"><span>￥480000</span>/年</div>
						</a>
					</div>
				</div>
			</div>
			<div class="tab-content overflow-hide">
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180914011445_98470.png" width="65">
							<h3>視頻云服務套餐</h3>
							<p>快速開啟廣播級視頻云服務</p>
							<div class="labels">
								<a href="#"><span>視頻應用</span></a>
								<a href="#"><span>媒體視頻 </span></a>
								<a href="#"><span>視頻直播</span></a>
								<a href="#"><span>視頻點播</span></a>
								<a href="#"><span>視頻轉碼</span></a>
								<a href="#"><span>視頻云</span></a>
							</div>
							<div class="time"><span>￥3600</span>/年</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914011950_59962.png" width="65">
							<h3>媒體云媒體客戶端產品</h3>
							<p>提供完整的新聞客戶端解決方案</p>
							<div class="time"><span>￥100000</span>/次</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914012306_47199.png" width="65">
							<h3>媒體云SAAS版</h3>
							<p>提供領先的、可運營的媒體云服務</p>
							<div class="time"><span>￥200000</span>/年</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914012537_21382.png" width="65">
							<h3>視頻云直播API套餐</h3>
							<p>快速開啟直播，引燃商業(yè)價值</p>
							<div class="time"><span>￥135</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914012558_14202.png" width="65">
							<h3>視頻云直播轉碼API套餐</h3>
							<p>為多種直播場景提供多分辨率轉碼服務 </p>
							<div class="time"><span>￥117</span>/年</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>視頻云點播API套餐</h3>
							<div class="time"><span>￥9.9</span>/月</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>視頻云轉碼API套餐</h3>
							<div class="time"><span>￥113</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>音視頻連麥直播</h3>
							<div class="time"><span>￥1460</span>/次</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>媒體云鏡像版</h3>
							<div class="time"><span>￥39600</span>/年</div>
						</a>
					</div>
				</div>
			</div>
			<div class="tab-content overflow-hide">
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180914004920_74032.png" width="65">
							<h3>Array SSL VPN授權服務</h3>
							<p>為移動辦公和云計算量身定制的安全網關</p>
							<div class="labels">
								<a href="#"> <span>網絡安全</span></a>
								<a href="#"> <span>VPN</span></a>
							</div>
							<div class="time"><span>￥588</span>/月</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914004936_56574.png" width="65">
							<h3>云匣子</h3>
							<p>支持PC、手機等多終端運維的云堡壘機</p>
							<div class="time"><span>￥360</span>/月</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914104943_45360.png" width="65">
							<h3>奕銳云安全接入VPN系統(tǒng)</h3>
							<p>支持B/S、C/S應用，支持云上云下主動互訪</p>
							<div class="time"><span>￥100</span>/月</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20181024170922_87844.png" width="65">
							<h3>Array SSL VPN鏡像服務端</h3>
							<p>Array SSL VPN鏡像，15天license試用</p>
							<div class="time"><span>免費</span></div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914012736_77942.png" width="65">
							<h3>云匣子-授權服務</h3>
							<p>支持PC、手機等多終端運維的云堡壘機</p>
							<div class="time"><span>￥360</span>/月</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>山石網科防火墻-旗艦版</h3>
							<div class="time"><span>￥4000</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>山石網科防火墻-標準版</h3>
							<div class="time"><span>￥1600</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>云匣子License</h3>
							<div class="time"><span>￥360</span>/月</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>云安全服務</h3>
							<div class="time"><span>￥6000</span>/次</div>
						</a>
					</div>
				</div>
			</div>
			<div class="tab-content overflow-hide">
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180914012755_78249.png" width="65">
							<h3>云管理服務</h3>
							<p>提供資源管理、監(jiān)控管理等服務</p>
							<div class="labels">
								<a href="#"><span>代維服務</span></a>
								<a href="#"><span>代維與管理</span></a>
							</div>
							<div class="time"><span>￥7000</span>/年</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914012811_27871.png" width="65">
							<h3>MoveSure遷移服務</h3>
							<p>將X86架構業(yè)務整機遷移到云主機</p>
							<div class="time"><span>￥10500</span>/次</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914012832_48001.png" width="65">
							<h3>云遷移-龍?zhí)锟萍及?lt;/h3>
							<p>提供應用級、數據級等遷移服務</p>
							<div class="time"><span>￥1</span>/次</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914012910_42936.png" width="65">
							<h3>認證類培訓</h3>
							<p>覆蓋IT、CT技術領域的華為認證</p>
							<div class="time"><span>￥206400</span>/次</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180921111807_87261.png" width="65">
							<h3>云評估-博思云為版</h3>
							<p>幫助建立最優(yōu)架構和服務策略</p>
							<div class="time"><span>￥16000</span>/次</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>云遷移-賽意信息版</h3>
							<div class="time"><span>￥6000</span>/次</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>云運維-軟通云網版</h3>
							<div class="time"><span>￥3000</span>/次</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>技術趨勢類培訓</h3>
							<div class="time"><span>￥30000</span>/次</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>云評估-中軟國際版</h3>
							<div class="time"><span>￥6000</span>/次</div>
						</a>
					</div>
				</div>
			</div>
			<div class="tab-content overflow-hide">
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180914013016_79349.png" width="65">
							<h3>視頻云直播API</h3>
							<p>快速開啟直播，引燃商業(yè)價值</p>
							<div class="labels">
								<a href="#"><span>API</span></a>
								<a href="#"><span>視頻應用</span></a>
								<a href="#"><span>媒體視頻 </span></a>
								<a href="#"><span>媒體視頻</span></a>
								<a href="#"><span>視頻直播</span></a>
								<a href="#"><span>視頻轉碼</span></a>
								<a href="#"><span>視頻云</span></a>
							</div>
							<div class="time"><span>按需</span></div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180914013033_44314.png" width="65">
							<h3>視頻云點播API </h3>
							<p>一體化點播解決方案</p>
							<div class="labels">
								<a href="#"><span>API</span></a>
								<a href="#"><span>媒體視頻 </span></a>
								<a href="#"><span>媒體視頻</span></a>
								<a href="#"><span>通信通訊</span></a>
								<a href="#"><span>視頻點播</span></a>
								<a href="#"><span>視頻云</span></a>
							</div>
							<div class="time"><span>按需</span></div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180914013046_72479.png" width="65">
							<h3>視頻云轉碼API</h3>
							<p>提供經濟、高效、可靠的轉碼能力 </p>
							<div class="labels">
								<a href="#"><span>API</span></a>
								<a href="#"><span>媒體視頻 </span></a>
								<a href="#"><span>視頻轉碼</span></a>
								<a href="#"><span>視頻云</span></a>
							</div>
							<div class="time"><span>按需</span></div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180914013110_93582.png" width="65">
							<h3>監(jiān)控直播API </h3>
							<p>提供穩(wěn)定、流暢的監(jiān)控直播服務</p>
							<div class="labels">
								<a href="#"><span>媒體視頻 </span></a>
								<a href="#"><span>API</span></a>
								<a href="#"><span>媒體視頻</span></a>
								<a href="#"><span>視頻直播</span></a>
								<a href="#"><span>視頻云</span></a>
							</div>
							<div class="time"><span>按需</span></div>
						</a>
					</div>
				</div>
			</div>
			<div class="tab-content overflow-hide">
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180914013200_32614.png" width="65">
							<h3>成翼行車隊管理服務</h3>
							<p>構建安全、高效的車聯網大數據系統(tǒng)</p>
							<div class="labels">
								<a href="#"><span>智慧城市</span></a>
								<a href="#"><span>交通</span></a>
								<a href="#"><span>物聯網</span></a>
								<a href="#"><span>車聯網</span></a>
							</div>
							<div class="time"><span>￥496</span>/年</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180914013323_75532.png" width="65">
							<h3>極動云物聯網云平臺</h3>
							<p>輕松實現海量物聯網設備管理</p>
							<div class="labels">
								<a href="#"><span>工業(yè)互聯網</span></a>
								<a href="#"><span>智慧城市</span></a>
								<a href="#"><span>物聯網</span></a>
							</div>
							<div class="time"><span>￥20</span>/次</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180914013357_56833.png" width="65">
							<h3>擎天數字生態(tài)城市企業(yè)版</h3>
							<p>輔助企業(yè)實現碳資產自我管理</p>
							<div class="labels">
								<a href="#"><span>物聯網</span></a>
								<a href="#"><span>智慧城市</span></a>
							</div>
							<div class="time"><span>￥2500000</span>/次</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180914013417_95167.png" width="65">
							<h3>大氣環(huán)境網格化監(jiān)管系統(tǒng)</h3>
							<p>構建全向互聯的環(huán)保感知網絡</p>
							<div class="labels">
								<a href="#"><span>物聯網</span></a>
								<a href="#"><span>智慧城市</span></a>
								<a href="#"><span>智慧環(huán)保</span></a>
							</div>
							<div class="time"><span>￥840000</span>/月</div>
						</a>
					</div>
				</div>
			</div>
			<div class="tab-content overflow-hide">
				<div class="col-sm-3">
					<div class="tab-card tab-card-lg">
						<a href="#">
							<img src="statics/images/20180914013450_21326.png" width="65">
							<h3>峰科加速基因解決方案</h3>
							<p>基于云主機FPGA提供加速基因解決方案</p>
							<div class="labels">
								<a href="#"><span>商業(yè)智能</span></a>
								<a href="#"><span>人工智能</span></a>
								<a href="#"><span>醫(yī)療</span></a>
								<a href="#"><span>高性能計算</span></a>
								<a href="#"><span>基因測序</span></a>
								<a href="#"><span>科學計算</span></a>
							</div>
							<div class="time"><span>￥5700</span>/月</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914013544_55604.png" width="65">
							<h3>秦渲云</h3>
							<p>提供國際領先的渲染服務云平臺</p>
							<div class="time"><span>￥2592</span>/月</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914013626_46327.png" width="65">
							<h3>永洪敏捷BI（SAAS）</h3>
							<p>提供大數據BI的大屏SAAS解決方案</p>
							<div class="time"><span>￥200</span>/月</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20180914013647_39838.png" width="65">
							<h3>永洪敏捷BI（鏡像）</h3>
							<p>提供大數據BI的大屏鏡像能力</p>
							<div class="time"><span>￥10000</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-md">
						<a href="#">
							<img src="statics/images/20190202180049_51639.png" width="65">
							<h3>英方應用級容災高可用i2Availability</h3>
							<p>提供應用不間斷運行服務。</p>
							<div class="time"><span>￥1100</span>/月</div>
						</a>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>英方持續(xù)數據保護i2CDP</h3>
							<div class="time"><span>￥1000</span>/月</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>英方數據實時復制和容災i2...</h3>
							<div class="time"><span>￥550</span>/月</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>英方系統(tǒng)整體在線熱遷移i2...</h3>
							<div class="time"><span>￥4000</span>/年</div>
						</a>
					</div>
					<div class="tab-card tab-card-sm">
						<a href="#">
							<h3>Veritas災備方案</h3>
							<div class="time"><span>￥1000000</span>/次</div>
						</a>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="view-go">
		<a href="#"><span class="arrow-more">查看全部</span><span class="arrow-f"></span></a>
	</div>
</div>

<script type="text/javascript">
	$(function() {
		$('.tabs li').hover(function() {
			var i = $(this).index();
			$(this).addClass('on').siblings().removeClass('on');
			$('.tab-content').removeClass('show').eq(i).addClass('show');
		})
	})
</script>

使用聲明

1. 本站所有素材（未指定商用），僅限學習交流。
2. 會員在本站下載的原創(chuàng)商用和VIP素材后，只擁有使用權，著作權歸原作者及17素材網所有。
3. 原創(chuàng)商用和VIP素材，未經合法授權，請勿用于商業(yè)用途，會員不得以任何形式發(fā)布、傳播、復制、轉售該素材，否則一律封號處理。
4. 本平臺織夢模板僅展示和個人非盈利用途，織夢系統(tǒng)商業(yè)用途請預先授權。

查看演示下載資源

0 15776 100

軟件 Dreamweaver
格式 HTML
作者迷茫
版權 ? 原創(chuàng)商用（獨家） i

版權聲明

此作品是由17素材網簽約用戶上傳，17素材網擁有版權；未經17素材網書面授權，請勿作他用。人物肖像，字體及音頻如需商用需第三方額外授權；

17素材網尊重知識產權，如知識產權權利人認為平臺內容涉嫌侵權，可通過郵件：3264130392@qq.com提出書面通知，我們將及時處理。

網站提供的黨政主題相關內容（國旗、國徽、黨徽...），目的在于配合國家政策宣傳，僅限個人學習分享使用，禁止用于任何廣告和商用目的。