div css创意的热门品牌图标布局代码

div css创意的热门品牌图标布局代码

收藏
div css创意的热门品牌图标布局代码
div css制作创意的电器商城热销品牌商标图片布局,悬停圆形商标文字显示效果代码。
  • 软件 Dreamweaver
  • 格式 HTML
  • 作者 迷茫
  • 上传时间 6年前

使用方法:

1、head引入css文件

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

2、body引入HTML代码

<div class="hotSaleBrand">

    <div class="cityColumnWarp clearfix">
	
		<div class="hotSaleBrand-box">
			<ul>
				<li>
					<a class="loadbg" href="#">
						<img src="img/T1ewYQBjLj1RCvBVdK.jpg" alt="海尔">
						<span>海尔</span>
					</a>
				</li>
				<li>
					<a class="loadbg" href="#">
						<img src="img/T1o9b_BCET1RCvBVdK.png" alt="西门子">
						<span>西门子</span>
					</a>
				</li>
				<li class="hotSaleBrand-middleIteam">
					<a class="loadbg" href="#">
						<img src="img/T15oYgBChT1RCvBVdK.png" alt="美的">
						<span>美的</span>
					</a>
				</li>
				<li>
					<a class="loadbg" href="#">
						<img src="img/T1ZoxgBCCT1RCvBVdK.jpg" alt="三星">
						<span>三星</span>
					</a>
				</li>
				<li>
					<a class="loadbg" href="#">
						<img src="img/T1YwLQBChT1RCvBVdK.png" alt="三洋">
						<span>三洋</span>
					</a>
				</li>
			</ul>
		</div>
		
		<div class="hotSaleBrand-box hotSaleBrand-box-right">
			<ul>
				<li>
					<a class="loadbg" href="#">
						<img src="img/T19HEjBCJT1RCvBVdK.png" alt="小天鹅">
						<span>小天鹅</span>
					</a>
				</li>
				<li>
					<a class="loadbg" href="#">
						<img src="img/T1OSEjBCZT1RCvBVdK.jpg" alt="博世">
						<span>博世</span>
					</a>
				</li>
				<li class="hotSaleBrand-middleIteam">
					<a class="loadbg" href="#">
						<img src="img/T1o9b_BCYT1RCvBVdK.jpg" alt="国美">
						<span>国美</span>
					</a>
				</li>
				<li>
					<a class="loadbg" href="#">
						<img src="img/T1BUZTByKT1RCvBVdK.png" alt="松下">
						<span>松下</span>
					</a>
				</li>
				<li>
					<a class="loadbg" href="#">
						<img src="img/T1toLTBXCT1RCvBVdK.jpg" alt="卡萨帝">
						<span>卡萨帝</span>
					</a>
				</li>
			</ul>
		</div>
		
	</div>
	
	<dl class="edit-mode">
		<dt>更多热卖品牌</dt>
		<dd><a href="#">韩电</a></dd>
		<dd><a href="#">海信</a></dd>
		<dd><a href="#">创维</a></dd>
		<dd><a href="#">荣事达</a></dd>
		<dd><a href="#">小鸭</a></dd>
		<dd><a href="#">LG</a></dd>
	</dl>
    
</div><!--END-->

使用声明

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