蓝色简洁的开发资源工具图标文字列表div布局样式代码。
[声明] 墨鱼部落格所有资源为用户免费分享产生，若发现您的权利被侵害，请点击后方链接查看并联系我们，我们尽快处理。免责声明|侵权处理流程
使用方法：
1、head引入css文件
<link rel="stylesheet" type="text/css" href="statics/css/style.css" />
2、body引入HTML代码
<div class="bg-grey"> <div class="content-block content-block1"> <!--大标题--> <div class="titleBar"> <h3 class="caption">开发资源</h3> <p class="descript">提升云端开发效率</p> </div> <!--主体--> <div class="AGrid-row developer-community"> <!--api--> <div class="col-sm-4 slider-item"> <div class="aui-tile" style="height: 635px;"> <div class="api-box"> <p class="caption">OpenAPI</p> <p class="info">服务能力开放，业务组合创新</p> </div> <div class="api-list"> <ul> <li class="col-sm-12 "> <div class="api-img"> <img src="statics/images/11.png"> </div> <div class="api-text"> <a href="#"> <p class="api-title"> 开放API的产品 </p> </a> <p class="api-detail"> <a href="#">弹性云服务器</a> | <a href="#">云硬盘</a> | <a href="#">镜像服务</a> | <a href="#">云解析服务</a> | <a href="#">云容器引擎</a>... </p> </div> </li> <li class="col-sm-12 "> <div class="api-img"> <img src="statics/images/12.png"> </div> <div class="api-text"> <p class="api-title"> <a href="#"> 地区和终端节点 </a> </p> <p class="api-detail"> <a href="#"> 云当前可服务节点区域和各服务的Endpoint </a> </p> </div> </li> <li class="col-sm-12 "> <div class="api-img"> <img src="statics/images/13.png"> </div> <div class="api-text"> <a href="#"> <p class="api-title"> API网关 </p> </a> <p class="api-detail"> <a href="#"> 提供高性能、高可用、高安全的API托管服务， 帮助用户轻松构建、管理和部署任意规模的API。 </a> </p> </div> </li> <li class="col-sm-12 "> <div class="api-img"> <img src="statics/images/14.png"> </div> <div class="api-text"> <a href="#"> <p class="api-title"> API市场 </p> </a> <p class="api-detail"> <a href="#" class="pc-link page_click_blank"> 视频与通信 </a>| <a href="#" class="pc-link page_click_blank"> 企业服务 </a> | <a href="#" class="pc-link page_click_blank"> 人工智能 </a> | <a href="#" class="pc-link page_click_blank"> 生活服务 </a> </p> </div> </li> <li class="col-sm-12 "> <div class="api-img"> <img src="statics/images/api-explorer.png"> </div> <div class="api-text"> <a href="#"> <p class="api-title"> API Explorer </p> </a> <p class="api-detail"> <a href="#"> 云API开发者门户，在线搜索、调测云开放API </a> </p> </div> </li> </ul> </div> </div> </div> <!--sdk--> <div class="col-sm-4 slider-item"> <div class="aui-tile" style="height: 635px;"> <div class="api-box"> <p class="caption">SDKs</p> <p class="info">通过SDK访问云产品和服务</p> </div> <div class="sdk-list"> <ul> <a href="#"> <li class="col-sm-6 "> <div class="api-img"> <img src="statics/images/1519700037_7961.png"> </div> <div class="api-text"> <p class="api-title"> Java SDK </p> </div> </li> </a> <a href="#"> <li class="col-sm-6 "> <div class="api-img"> <img src="statics/images/1519700050_4732.png"> </div> <div class="api-text"> <p class="api-title"> Python SDK </p> </div> </li> </a> <a href="#"> <li class="col-sm-6 "> <div class="api-img"> <img src="statics/images/1519700065_3809.png"> </div> <div class="api-text"> <p class="api-title"> .NET SDK </p> </div> </li> </a> <a href="#"> <li class="col-sm-6 "> <div class="api-img"> <img src="statics/images/1519700079_3590.png"> </div> <div class="api-text"> <p class="api-title"> PHP SDK </p> </div> </li> </a> <a href="#"> <li class="col-sm-6 "> <div class="api-img"> <img src="statics/images/1519700091_9319.png"> </div> <div class="api-text"> <p class="api-title"> Android SDK </p> </div> </li> </a> <a href="#"> <li class="col-sm-6 "> <div class="api-img"> <img src="statics/images/1519700103_9465.png"> </div> <div class="api-text"> <p class="api-title"> iOS SDK </p> </div> </li> </a> <a href="#"> <li class="col-sm-6 "> <div class="api-img"> <img src="statics/images/1519700240_6436.png"> </div> <div class="api-text"> <p class="api-title"> Node.js SDK </p> </div> </li> </a> <a href="#"> <li class="col-sm-6 "> <div class="api-img"> <img src="statics/images/1519700114_5581.png"> </div> <div class="api-text"> <p class="api-title"> C SDK </p> </div> </li> </a> <a href="#"> <li class="col-sm-6 "> <div class="api-img"> <img src="statics/images/1519700143_5988.png"> </div> <div class="api-text"> <p class="api-title"> Go SDK </p> </div> </li> </a> <a href="#"> <li class="col-sm-6 "> <div class="api-img"> <img src="statics/images/1510854466_1781.png"> </div> <div class="api-text"> <p class="api-title"> C# SDK </p> </div> </li> </a> <a href="#"> <li class="col-sm-6 "> <div class="api-img"> <img src="statics/images/1532311990_3697.png"> </div> <div class="api-text"> <p class="api-title"> Lua SDK </p> </div> </li> </a> <a href="#"> <li class="col-sm-6 " style="width: 100%;"> <div class="api-img"> <img src="statics/images/1519700570_7012.png"> </div> <div class="api-text"> <p class="api-title"> BrowserJS SDK </p> </div> </li> </a> </ul> </div> </div> </div> <!--tools--> <div class="col-sm-4 slider-item"> <div class="aui-tile" style="height: 635px;"> <div class="api-box"> <p class="caption">开发工具</p> <p class="info">提高资源配置及管理效率</p> </div> <div class="developer-list"> <ul> <li class="col-sm-12 "> <div class="api-img"> <img src="statics/images/1530195015_2261.png"> </div> <div class="api-text"> <p class="api-title"> <a href="#"> CLI </a> </p> <p class="api-detail"> <a href="#">OpenStack CLI工具 | FunctionGraph CLI工具 </a> </p> </div> </li> <li class="col-sm-12 "> <div class="api-img"> <img src="statics/images/1530195028_8953.png"> </div> <div class="api-text"> <p class="api-title"> <a href="#"> 业务工具 </a> </p> <p class="api-detail"> <a href="#">OBS Browser工具 | obsutil工具 | RDS工具 | DES数据加密工具 | 软件开发云工具 | 文档数据库服务工具 | Serverless Sandbox | DevCloud第三...</a> </p> </div> </li> <li class="col-sm-12 "> <div class="api-img"> <img src="statics/images/01.png"> </div> <div class="api-text"> <a href="#"> <p class="api-title"> 代码示例 </p> </a> <p class="api-detail"> <a href="#"> </a> <a href="#"> SDK示例 | 工具示例 | 其他 </a> </p> </div> </li> <li class="col-sm-12 "> <div class="api-img"> <img src="statics/images/23.png"> </div> <div class="api-text"> <a href="#"> <p class="api-title"> 生态工具 </p> </a> <p class="api-detail"> <a href="#"> </a> <a href="#"> terraform 工具 | ansible 工具 | kubernetes 工具 ... </a> </p> </div> </li> <li class="col-sm-12 "> <div class="api-img"> <img src="statics/images/24.png"> </div> <div class="api-text"> <p class="api-title api-title-pc"> 组件库 | 图标库 </p> <p class="api-detail" style="height:22px;"> <a href="#">组件库</a> | <a href="#">图标库</a> </p> </div> </li> <li class="col-sm-12 "> <div class="api-img"> <img src="statics/images/25.png"> </div> <div class="api-text"> <a href="#"> <p class="api-title"> 开发者工具市场 </p> </a> <p class="api-detail"> <a href="#"> 监控工具 | 源代码控制 | 问题和缺陷跟踪 | 日志分析 | 测试工具 </a> </p> </div> </li> </ul> </div> </div> </div> </div> </div> </div>
文件目录
本资源来自：代码 » div css » div css开发工具图标文字列表布局
注：此资源非帝国CMS模板/特效/源码，需要帝国CMS整站模板源码的小伙伴，请移步 帝国CMS模板，感谢支持！
通用的网页底部导航div布局代码
« 上一篇
2020年12月05日
创意的产品服务圆形布局代码
下一篇 »
2020年12月05日
1、如非特殊说明，本站对本文提供的代码或者素材不拥有任何权利，其版权归原著者拥有。
2、以上提供的代码或者素材均为作者提供和网友推荐收集整理而来，仅供学习和研究使用。
3、如有侵犯你版权的，请来信（邮箱:48444431@qq.com）指出，核实后，本站将立即改正。
4、如有链接无法下载、失效或广告，请点击下面的报错或者联系墨鱼处理！
5、以上资源售价只是赞助，不代表代码或者素材本身价格。收取费用仅维持本站的服务器开销！
6、如无特殊说明，如：织梦或者帝国等开源CMS核心模板，那么默认提供的只是HTML模板！
7、所有代码素材效果均为演示打包，最终效果请参考演示效果，本站不提供任何技术支持和服务。
8、代码素材均为虚拟物品，演示和描述无错的情况下，无法进行退换服务。
2、以上提供的代码或者素材均为作者提供和网友推荐收集整理而来，仅供学习和研究使用。
3、如有侵犯你版权的，请来信（邮箱:48444431@qq.com）指出，核实后，本站将立即改正。
4、如有链接无法下载、失效或广告，请点击下面的报错或者联系墨鱼处理！
5、以上资源售价只是赞助，不代表代码或者素材本身价格。收取费用仅维持本站的服务器开销！
6、如无特殊说明，如：织梦或者帝国等开源CMS核心模板，那么默认提供的只是HTML模板！
7、所有代码素材效果均为演示打包，最终效果请参考演示效果，本站不提供任何技术支持和服务。
8、代码素材均为虚拟物品，演示和描述无错的情况下，无法进行退换服务。
