css3服务功能介绍图标文字布局代码

css3服务功能介绍图标文字布局代码

收藏
css3服务功能介绍图标文字布局代码
div css3 实现简单大气企业建站优势列表图标文字布局代码, 结构清晰简单,简单易用,下载即可使用。
  • 软件 Dreamweaver
  • 格式 HTML
  • 作者 歪秀
  • 上传时间 7年前

使用方法:

1、head引入css文件

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

2、body引入HTML代码

<div class="block-content">
	<div class="block-content-box">
		<ul class="block-content-box-list">
			<li class="block-list-item">
				<div class="block-list-item-box clearfix">
					<div class="block-list-item-mask">
						<div class="block-list-item-image">
							<div class="block-list-item-content">
								<div class="block-list-item-middle">
									<img src="images/icon-item001.png" alt="">
								</div>
							</div>
						</div>
					</div>
					<div class="block-list-item-text">
						<div class="block-list-item-body">
							<div class="block-list-item-body-title">
								<p>
									<strong>自由编辑</strong>
								</p>
							</div>
							<div class="block-list-item-body-text">
								<p>可视化编辑器,随时随地修改网站</p>
							</div>
						</div>
					</div>

				</div>
			</li>
			<li class="block-list-item">
				<div class="block-list-item-box clearfix">
					<div class="block-list-item-mask">
						<div class="block-list-item-image">
							<div class="block-list-item-content">
								<div class="block-list-item-middle">
									<img src="images/icon-item002.png" alt="">
								</div>
							</div>
						</div>
					</div>
					<div class="block-list-item-text">
						<div class="block-list-item-body">
							<div class="block-list-item-body-title">
								<p>
									<strong>全网兼容</strong>
								</p>
							</div>
							<div class="block-list-item-body-text">
								<p>手机、平板、PC、微信全面兼容</p>
							</div>
						</div>
					</div>

				</div>
			</li>
			<li class="block-list-item">
				<div class="block-list-item-box clearfix">
					<div class="block-list-item-mask">
						<div class="block-list-item-image">
							<div class="block-list-item-content">
								<div class="block-list-item-middle">
									<img src="images/icon-item003.png" alt="">
								</div>
							</div>
						</div>
					</div>
					<div class="block-list-item-text">
						<div class="block-list-item-body">
							<div class="block-list-item-body-title">
								<p>
									<strong>顶级域名</strong>
								</p>
							</div>
							<div class="block-list-item-body-text">
								<p>打造互联网品牌,绑定顶级域名</p>
							</div>
						</div>
					</div>

				</div>
			</li>
			<li class="block-list-item">
				<div class="block-list-item-box clearfix">
					<div class="block-list-item-mask">
						<div class="block-list-item-image">
							<div class="block-list-item-content">
								<div class="block-list-item-middle">
									<img src="images/icon-item004.png" alt="">
								</div>
							</div>
						</div>
					</div>
					<div class="block-list-item-text">
						<div class="block-list-item-body">
							<div class="block-list-item-body-title">
								<p>
									<strong>全球加速</strong>
								</p>
							</div>
							<div class="block-list-item-body-text">
								<p>阿里云分布式存储,可自主切换节点</p>
							</div>
						</div>
					</div>

				</div>
			</li>
			<li class="block-list-item">
				<div class="block-list-item-box clearfix">
					<div class="block-list-item-mask">
						<div class="block-list-item-image">
							<div class="block-list-item-content">
								<div class="block-list-item-middle">
									<img src="images/icon-item005.png" alt="">
								</div>
							</div>
						</div>
					</div>
					<div class="block-list-item-text">
						<div class="block-list-item-body">
							<div class="block-list-item-body-title">
								<p>
									<strong>在线客服</strong>
								</p>
							</div>
							<div class="block-list-item-body-text">
								<p>一键QQ、电话客服、微信快捷关注</p>
							</div>
						</div>
					</div>

				</div>
			</li>
			<li class="block-list-item">
				<div class="block-list-item-box clearfix">
					<div class="block-list-item-mask">
						<div class="block-list-item-image">
							<div class="block-list-item-content">
								<div class="block-list-item-middle">
									<img src="images/icon-item006.png" alt="">
								</div>
							</div>
						</div>
					</div>
					<div class="block-list-item-text">
						<div class="block-list-item-body">
							<div class="block-list-item-body-title">
								<p>
									<strong>客户CRM</strong>
								</p>
							</div>
							<div class="block-list-item-body-text">
								<p>自定义表单,微信推送,客户管理</p>
							</div>
						</div>
					</div>

				</div>
			</li>
		</ul>
	</div>
</div>

使用声明

1. 本站所有素材(未指定商用),仅限学习交流请勿用于商业用途。
2. 会员在本站下载的原创商用和VIP素材后,只拥有使用权,著作权归原作者及17素材网所有。
3. 原创商用和VIP素材,未经合法授权,会员不得以任何形式发布、传播、复制、转售该素材,否则一律封号处理。
4. 本平台织梦模板仅展示和个人非盈利用途,织梦系统商业用途请预先授权。