定位

  1.1  相邻行内块元素的间距问题

    布局的时候,相邻的行内块元素之间默认有几像素的外间距。

    只能用浮动来解决这个问题。

  1.2  Border-radius: 边框半径

       有四个值:左上,右上,右下,左下

       四个值为元素宽度或是高度的一半的时候,会将元素变成圆形或是椭圆形,峰值只能到达宽度或是高度的一半。

 

     1.3 行内元素的margin

       行内元素的左右margin是可以起作用的,但是上下的margin是不起作用的。

 

     1.4  清除浮动

       浮动的原因就是因为父盒子没有高度,原来的高度是靠标准流中的子元素撑起来,但是子元素浮动了之后 ,脱离标准流了,造成父级元素的高度为0;

  1. 给父盒子设置一个高度
  2. Clear: both
  3. Overflow: hidden   触发了BFC模式 也可以用来清除浮动
  4. 伪元素或是双伪元素清除法

    .clearfix:before, .clearfix:after {
        /*清除浮动,最好最标准的写法*/
        content: "";
        display: table;
    }

    .clearfix:after {
        clear: both;
    }

    .clearfix {
        *zoom: 1; /*IE/7/6*/  /*兼容IE6下的写法*/
    }

     

    1.5 定位的元素的层级

    如果只给一个元素绝对定位,而不写trbl值的话,会以原位显示

    定位(相对和绝对或固定)的元素都有一个层级的属性或是概念。如果定位了的相邻多个元素,在同一个位置的话,后面的元素默认会压住前面的元素。如果同样是定位了的元素,默认他们的层级都是0,只不过后面的元素会压住前面的元素。如果想让当前的元素显示在后面的元素之上,这个时候就需要改变层级的关系,z-index来改变。

    z-index的取值范围0---9999999,最好是正数,尽量不要用负数。

    1.6  列表

    ul   li      unordered   list     无序列表

    ol   li      ordered   list  有序列表

    dl  dt  dd    

       dl:     difinition     list     定义列表

    dt     difinition      title 标题

    dd      difinition    description      定义描述

posted @ 2016-07-25 00:08  程序猿1990  阅读(128)  评论(0编辑  收藏  举报