• clear的值和特点及伪元素before和after的使用


    clear:both的特点

    1. 元素需是块级元素
    2. 元素不能带有浮动属性
    3. 元素必须放在最后一个浮动元素的后面
    4. 用户是看不到这个元素的
    5. clearfix清浮动方法的属性
    6. 浮动元素的父级选择器{*zoom:1;}/*只有ie7可识别 css hack写法*

    浮动元素的父级选择器:

     1 after{
     2 display: block
     3 content:"";
     4 clear: both;
     5 height:0;/*如果是在ie低版本浏览器(ie6、7、8)下展示,有时候浏览器会默认
     6 height元素有1px的高度*/
     7 font-size: 0;
     8 overflow: hidden;
     9 visibility: hidden;/*为了防止元素内有内容显示出来*
    10 }

     面试题:如何让一个元素消失在视野中

    visibility: hidden-盒子看不到,但是盒子所占的大小依然还在 display:none-盒子完全从页面中消失 opacity:0-透明度为0(完全透明) width/height/line-height+ overflow-宽度/高度/行高+溢出隐藏

     1 <!DOCTYPE html>
     2 <html>
     3 <head>
     4 <meta charset="utf-8">
     5 <title></title>
     6 <style type="text/css">
     7 /*
     8 控制台:鼠标右键检查(F12)可以发现在元素之前有::before在元素之后有一个::after
     9 */
    10 .todady::before{
    11 content: "昨天星期一";
    12 color: red;
    13 }
    14 .todady::after{
    15 content: "明天星期三";
    16 color: magenta;
    17 }
    18 </style>
    19 </head>
    20 <body>
    21 <div class="todady">今天星期二</div>
    22 </body>
    23 </html>
  • 相关阅读:
    [CEOI2008] order
    Atcoder 2373 Cookie Exchanges
    [POI2011]ROT-Tree Rotations
    bzoj 5216: [Lydsy2017省队十连测]公路建设
    bzoj 5215: [Lydsy2017省队十连测]商店购物
    Codeforces 961 E Tufurama
    [九省联考2018] 秘密袭击coat
    Codeforces 961 D Pair Of Lines
    [八省联考2018] 劈配
    [九省联考2018]一双木棋chess
  • 原文地址:https://www.cnblogs.com/webaction/p/14251519.html
Copyright © 2020-2023  润新知