美文网首页
读《css世界的一些感悟》

读《css世界的一些感悟》

作者: 低级小码农 | 来源:发表于2018-08-01 22:45 被阅读0次

    今天终于读上了张鑫旭大佬的《css世界》了,其中也实践了一些,发现一些说得不好的地方。
    1.关系选择器中的相邻兄弟选择器有点说得不对

    原文是这么说的
    相邻兄弟选择器:仅仅选择当前元素相邻的那个合乎规则的兄弟元素。+连接。适用于 IE7 以上版本。

    可是经过测试发现应该这么只说更具体仅仅选择当前元素相邻的后面那个合乎规则的兄弟元素。+连接。
    栗子如下:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
        <style>
            .red + div{
                width: 100px;
                height: 100px;
                background: red;
            }
        </style>
    </head>
    <body>
        <div></div>
        <div id="a" class="red">sss</div>
        <div></div>
    </body>
    </html>
    
    例子图片.png

    如果像张鑫旭大佬说的那样前面那个div也应该有样式才对啊,可是没有,说明 + 相邻兄弟选择器也只是选择它后面那个和它相邻的兄弟,前面的就有心无力啦....


    2018/08/10

    今天发现了一个很奇怪的问题:

    inline-table和inline-block到底有哪些区别呢?
    特意去MDN查看了一下,发现好像没有区别,
    /* <display-legacy> values */
    display: inline-block;
    display: inline-table;
    display: inline-flex;
    display: inline-grid;
    把这些都归为一类。。。

    感觉有点小纠结😖,希望有知道inline-table和inline-block这两个的区别的给我留言说说,在这里感谢各位大哥,大姐。

    未完~~~~

    相关文章

      网友评论

          本文标题:读《css世界的一些感悟》

          本文链接:https://www.haomeiwen.com/subject/sjjdvftx.html