2、然后先给页面设置背景颜色,创建段落两个段落,段落上面设置2张图片的float属性,分别让它们左右浮动,值为left和right,最后打开浏览器:
3、打开浏览器后即可看到效果,两张图片分别浮动在文本的左右两边,文字则是围绕在图片周围.。
@ 使用css样式怎么是多个p标签的内容显示在一行?
div是块级标签,本身是不会和其他的块级标签在同一行的,要想他们在同一行,得在css里加float这个属性:float:left
@ float关键字怎么用?
float关键字有两种常见的使用方法
1.固定布局写法:
.tupian{width:56px;float:right;}
.wenzi{width:484px;float:right;}
2.流体布局写法:
.tupian{width:56px;float:right;}
.wenzi{margin-left:76px;}
这两种方法在初期显示效果是一样的,但是如果将页面窗口大小调整,第一种(固定布局写法)将会崩溃,首先它将会图片与文字换行,窗口继续减小,文字的框架不变,但是一部分内容将会被掩盖,这样会使网页内容缺失;而第二种比第一种更好,无论窗口怎么小,它的内容不会缺失,并且图片与文字不会错行,只是文字的行数会增加。
@ 网页设计的盒子怎么左右并列?
盒子并排显示的方法:
1、使用float属性设置并排显示,只需要给div设置“float:right|left;”即可;
2、使用display属性设置同行显示,只需要给div设置“display:inline;”即可。