欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

dhtml 浮动 与margin

程序员文章站 2022-03-08 10:00:20
...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>测试浮动</title>
<style type="text/css">
.wrapper{width:520px; background-color:#FFCCFF; float:left;}

.top{width:520px; background-color:#CCFFFF;}
.top dl{510px;}
.top dl dd{width:200px;margin-left:10px; margin-top:10px;}
.nexttop{ width:520px;margin-top:20px; float:left;background-color:#66FFFF;}
</style>
</head>

<body>


<div class="wrapper">

<div class="top">
 <dl>
     <dd>若不浮动会是怎么样的效果</dd>
        <dd>好像dl dd 不受浮动影响</dd>
    </dl>
</div>

<div class="nexttop">下半部分,不浮动,没有所谓的margin</div>
<div>啥也没有 在没有浮动的情况下,使用外部的颜色</div>

</div>

</body>
</html>

 

做了个小测试,<div>在不浮动的情况下,margin-top,margin-bottom,不起作用

但是<dl>下的<dd>标签,不受浮动的影响,没有浮动的情况下,margin-top,margin-bottom,照样起作用

 

相关标签: XHTML CSS HTML