htnl+css 中的元素及 属性细节记录

×new× html+css 中的元素及 属性细节记录，首先这是菜鸟的边学边总结的一些知识点及经验，记录平时不太清楚或没注意的，供学习交流，高手请选择性近视


1 . Text-decoration :underlie  (下划线)  none（无）  overline （上划线）  line-through （文本穿过）  blink （注: 闪烁）

 

2 .文本在设置字体的时候最好加上系统默认sans-serif 属性字体

如：font: 14pxGeneva,Arial,Helvetica,sans-serif;

  当默认行空隙较小时设置行间距  line-height:5px;

 

3 . 文本水平对齐 text-align:center;  属性有left rightcenter  注:text-align:justify;段落俩段对齐 很少见！

 

4 . 文本字体字母大小写属性设置，text-transform：uppercase;  /字母全大写

                                                                          
   capitalize;  /首字母大写

                                                                              lowercase; /字母全小写

                                                                              none;     /默认值

 

5 . 列表符号的设置， ul {

                                                        List-style-type:none/square/circle/等等;

}

  用图像做列表符号， ul{
                                                        List-style-image:url();
}

 

6 . 在设置列表水平排列时，下面俩种效果哪种更好呢？

         Html:

<divclass="" id="">

       <ul class="content">

           <li>jiushi</li>

           <li>dwhuo</li>

           <li>rteoo</li>

           <div style="clear:both;"></div>

         </ul>

     </div>

一．用float解决，样式定义：

<style type="text/css">

body{

         text-align:center;

         }

ul.content li{

         list-style-type:none;

         float:left;

         margin:20px 0 0 20px;}

</style>

 

 

二 .用display属性定义,样式定义：

<style type="text/css">

body{

         text-align:center;

         }

ul.content li{

         list-style-type:none;

         display:inline;

         margin:20px 0 0 20px;}

</style>

那float和display的区别是什么？

：

float:left的元素允许它的右边存在任何元素同行显示，不论是内联元素还是块元素。但它的左边还是不允许存在任何元素与之同行显示，哪怕其它的元素的代码在前，
除非也给前面的元素加上float:left后，才允许同行显示。

设了display:inline的元素，允许它的前后存在其它的内联元素同行显示。关于代码在其前面的块元素之同行显示，则要让前面的元素浮动（不管是左还是右浮动）
或设为display:inline，还有代码在后面的是块元素（管它有没有浮动，是左浮动还是右浮动），均不能与之同行，除非设为display:inline。
另外，给块级元素设上display:inline是解决有名的IE6中双倍浮动的利器。
  

上面是百度知道的答案！有人说不好理解，我通俗的解释下吧：1.定义float的元素，其他元素要想前后与该元素同行显示，需要在其他元素属性中设置float:left;

即让他们都脱离文档流 2.定义display属性的元素，前面的其他元素要想同行显示，设float或display：inline 都行，而后面元素设浮动float就不行了，
要想同行显示就必须设 display:inline 。

7.CSS属性中的display和visibility 的区别，都是控制元素的显隐性 ，visibility 为hidden值时元素只是被隐藏了，但仍然占有原来的位置，而display则不保留元素的原来的位置！

    ps: display属性设置元素的显示方式，对应脚本特性为display，可选值为none、block和inline，各值的说明如下：

none 隐藏元素，不保留元素显示时的空间。
block块方式显示元素。
inline 以内嵌方式显示元素。
inline-block对象显示为内嵌元素，但所有子对象都显示为块元素，相邻的内嵌元素将显示在同一行，允许空格。
list-item 将块元素显示为列表对象，并可以添加项目标点。(需要IE6.0+支持)
table-header-group 将元素作为表格标题组显示，相当于tHead元素。
table-footer-group 将元素作为表格脚注组显示，相当于tFoot元素。

visibility属性设置是否显示元素，对应的脚本特性为visibility，可选值为inherit、hidden和visible，各值的说明如下：

inherit 继承父元素的visibility属性设置。

hidden 隐藏元素，但保留其所占空间。

visible 显示元素(默认值)。

8.