在一个div 里面有左边图片左偏边下方是文字,右边是文字怎么布局,像图片这样的布局怎么布局,求解
3个回答
展开全部
这样的布局你可以从大往小看,首先你看这个整体,分析这几个的样式之后,你发现是分左右两个部分的,所以你就再下一级里放两个div,设置左浮动,就会横排并列,然后分析左面的,是分上下两个部分,然后写一个img一个p就可以搞定,右边的话是几个超链接,那你直接写a标签也可以,用span包住也可以,然后微调一下就能解决了
追问
能写下代码让我参考下吗?
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
就拿知识那一块为例,图标与知识放在一个div内,右边的文字连再放在一个div内,之前2个div是平级的,都设定好宽度左浮动,然后再再里面做细分就行了
其实div+css有点像我们小时候玩的俄罗斯方块积木,这需要我们发挥想象来排列div的组合方式
其实div+css有点像我们小时候玩的俄罗斯方块积木,这需要我们发挥想象来排列div的组合方式
追问
高手求解,那代码怎么写
追答
<style type="text/css">
.box01{ float:left; width:40px; height:60px;}
.icon01{ width:40px; height:40px; text-align:center; font:14px/40px '宋体'; color:white; background:#f64269;}
.icon01_font{text-align:center; font:bold 14px/20px '宋体'; color:#f64269;}
.box02{float:left; width:130px; height:60px; margin-right:70px;}
.box02_font{text-decoration:none; font:12px/20px '宋体'; color:black; margin-left:5px; white-space:nowrap;}
</style>
</head>
<body>
<div class="box01">
<div class="icon01">图标</div>
<div class="icon01_font">知识</div>
</div>
<div class="box02">
<a href="#" class="box02_font">装修知识</a>
<a href="#" class="box02_font">装修风水</a>
<a href="#" class="box02_font">装修流程</a>
</div>
<div class="box01">
<div class="icon01">图标</div>
<div class="icon01_font">房子</div>
</div>
<div class="box02">
<a href="#" class="box02_font">儿童房</a>
<a href="#" class="box02_font">书房</a>
<a href="#" class="box02_font">卫生间</a>
<a href="#" class="box02_font">厨房</a>
</div>
</body>
大概写了一个例子,你应该能看懂的
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
这也可以有ul li的啊 只要图标不是点动的啊 设成背景图标也可以的啊 字再首行缩进就好 li再设成左浮动 设定要ul的宽度就好 省了成多代码
追问
能详细写些代码吗?让我参考下
追答
我自己写的代码中的一段你参考下:
试题下载
主题贴数:12
版主:admini
版块创建时间:2012-4-25 16:19:00
CSS:ul{ height:100px;color:#000; background:url(../Images/Logo2.png) no-repeat #FFF 10px 25px; text-indent:130px;}应该能看明天白吧 你要用话给li加浮动 这样旁边的字可以横排
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询