一级段项目学习
1、CSS中margin和padding的区别如下
1， margin是指从自身边框到另一个容器边框之间的距离，就是容器外距离。 2， padding是指自身边框到自身内部另一个容器边框之间的距离，就是容器内距离
2，iine-height行高
“行高“指一行文子的高度，具体来说是指两行文子间基线间的距离。在CSS，line-height被用来控制行与行之间的垂直距离。line-height 属性会影响行框的布局。
在应用到一个块级元素时，它定义了该元素中基线之间的最小距离而不是最大距离。所有浏览器都支持 line-height 属性。
line-height属性的具体定义列表如下： 语法： line-height : normal | <实数> | <长度> | <百分比> | inherit 说明： line-height 属性设置行间的距离（行高），不能使用负值。该属性会影响行框的布局。在应用到一个块级元素时，它定义了该元素中基线之间的最小距离而不是最大距离。
line-height 与 font-size 的计算值之差(行距)分为两半，分别加到一个文本行内容的顶部和底部。可以包含这些内容的最小框就是行框。
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<style type="text/css" >
span
{
padding:0px;
line-height:1.5;
}
</style>
</head>
<body>
<div class="test">
<div style="background-color:#ccc;">
<span style="font-size:3em;background-color:#999;">中文English</span>
<span style="font-size:3em;background-color:#999;">English中文</span>
</div>
</div>
</body>
<html>
3、向上移动图片，为防图片被隐藏，可以给图片加浮动
position:relative; 图片位置定位，让图片浮动
margin: -39px auto; 调整图片的上下距离及作用距离（auto，代表水平居中）
4、displayd ，这个属性用于定义建立布局时元素生成的显示框类型
<html> <head> <style type="text/css"> p {display: inline} div {display: none} </style> </head> <body> <p>本例中的样式表把段落元素设置为内联元素。</p> <p>而 div 元素不会显示出来！</p> <div>div 元素的内容不会显示出来！</div> </body> </html>
none 此元素不会被显示。 block 此元素将显示为块级元素，此元素前后会带有换行符。 inline 默认。此元素会被显示为内联元素，元素前后没有换行符。 inline-block 行内块元素。（CSS2.1 新增的值） list-item 此元素会作为列表显示。 run-in 此元素会根据上下文作为块级元素或内联元素显示。 compact CSS 中有值 compact，由于缺乏广泛支持，已经从 CSS2.1 中删除。 marker CSS 中有值 marker，由于缺乏广泛支持，已经从 CSS2.1 中删除。 table 此元素会作为块级表格显示（类似 <table>），表格前后带换行符。 inline-table 此元素会作为内联表格显示（类似 <table>），表格前后没换行符。 table-row-group 此元素会作为一个或多个行的分组来显示（类似 <tbody>）。 table-header-group 此元素会作为一个或多个行的分组来显示（类似 <thead>）。 table-footer-group 此元素会作为一个或多个行的分组来显示（类似 <tfoot>）。 table-row 此元素会作为一个表格行显示（类似 <tr>）。 table-column-group 此元素会作为一个或多个列的分组来显示（类似 <colgroup>）。 table-column 此元素会作为一个单元格列显示（类似 <col>） table-cell 此元素会作为一个表格单元格显示（类似 <td> 和 <th>） table-caption 此元素会作为一个表格标题显示（类似 <caption>） inherit 规定应该从父元素继承 display 属性的值
Javascript display 属性还允许作者显示或隐藏一个元素。与 visibility 属性类似。然而，如果您设置 display:none，将隐藏整个元素，如果您设置 visibility:hidden，
元素的内容将不可见，但元素保持原来的位置和大小。 <html> <head> <script> functiondisplayResult() { document.getElementById("p1").style.display="none"; } </script> </head> <body> <pid="p1">Thisissometext.</p> <inputtype="button"onclick="displayResult()"value="Donotdisplayparagraph"> </body> </html>
