网页制作中p标签中实现左右浮动
2016-06-14
今天在做网页制作项目后，程序说单页内容通过编辑器上传，为了安全起见，不允许上传div标签，只能用p标签之类常用标签排版。
在修改制作页面的时候，问题来了，p标签中根本不能含有div标签，在DW中的代码为：
<p class="cls1">
测试内容
<div class="clear"></div>
</p>
为了使p标签可以自适应高度加了clear属性，但浏览器解析的代码为：
<p class="cls1">
测试内容
</p>
<div class="clear"></div>
<p></p>
由此看来，p标签因为是行内元素，里面不能包含有如div这样的块级元素。反过来，如果div标签中含有p标签元素，是完全没有问题的。如果p标签中想排版类似左右浮动布局页面，则可以通过设置p标签高度，然后p标签中用<span style="display:block"></span>替代<div></div>标签即可解决问题。
实例代码：
<p style="width:500px; height:300px; border:1px solid #960; padding:5px;">
<span style="width:245px; height:300px; background:#FC0; float:left">
左浮动
</span>
<span style="width:245px; height:300px; background:#F39; float:right">
右浮动
</span>
</p>
ok，现在可以通过后台上传页面了，经过测试，带有左浮动、右浮动布局以后，用清clear属性没法达到自适应高度效果，只能给p标签设置高度达到布局效果。
