呆呆键盘手11.13号学到的有关文本css、伪类选择器、浮动的内容

1.文本css

  <ins></ins>下划线标记

  <del></del>删除线标记

  文本对齐:text-align-left/center/right

  文本首行缩进:text-indent    单位px em

  行高:line-height

2.伪类选择器

  a:link  链接的原本的样式(没有被访问过),访问后失效;

  a:hover 鼠标移入时的样式;

  a:active 鼠标按下时的样式(鼠标点击没有松开);

  a:viseted 链接访问过的样式;

  顺序:L -- H -- V -- A

3.浮动

让默认文档流下的元素漂浮起来水平排列;

浮动的影响:

1.行内元素浮动之后可以支持宽高;

2.文本会给浮动的元素让位;可以制作文本绕排的效果;

3.在父级没有给高度的情况下,子级浮动后父级会没有高度;

清除浮动

1.在父级内容的最后添加一个空的div,添加clear属性;

  clear--left/right/both; clear是清除上一个元素带来的影响;

  不推荐使用,因为会在页面上添加太多的无用标签,让页面的布局变得更复杂;

2.给父级设置overflow:hidden;

  会触发bfc(block formatting context)块级格式化上下文;

  不推荐使用,因为这个属性和定位一起使用时会产生问题;

3.使用伪元素after

  .clearfix:after{

    content:"";

    height:0;

    line-height:0;

    display:block;

    visibility:hide;

    clear:both;

  }

  .clearfix{

    zoom:1;

  }

4.使用双伪元素after和before

  .clearfix:after,.clearfix:before{

    content:"";

    display:table;

    clear:both;

  }

  .clearfix{

    zoom:1;

  }

推荐使用3.

猜你喜欢

转载自www.cnblogs.com/ddjps/p/9954371.html