浮动布局关键字float
以下面的代码作为一个例子
若要在一个div中实现图片在左,文字在右的样式,可通过以下代码进行效果样式的实现,img表示图片,one表示文字。
CSS代码如下:
.main .inner .left img{
float: left;
}
图片CSS中使用float:left浮动在左侧。
.main .inner .left .one{
width: 538px;
float: right;
line-height: 24px;
color: #7f7f7f;
}
文字CSS中使用float:right浮动在右侧。
同时,需要注意的是,使用浮动布局时浮动的元素默认在网页中不占位置,但是会挤到对应的文字,这一点可能会对后面的页面布局产生影响,若要消除浮动的影响,则应在相应css中添加如下代码即可。
clear: both;
版权声明:本文为zhxzrd原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。