CSS 选择器

2020-11-27 11:35:47 阅读：105 来源： 互联网

标签：color 100px height background div 选择器 CSS

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        /*#i11{*/
        /*background: #FAFAD2;*/
        /*height: 100px*/
    /*}*/
    /*.c1{*/
        /*background: #FFD39B;*/
        /*height: 100px*/
    /*}*/
        /*div{*/
            /*background: black;*/
            /*color: white;*/
        /*}*/

        /*span div {*/
            /*background: #FAFAD2;*/
            /*color: brown;*/
        /*}*/
    #i1,#i2,#i3 {
        background: aliceblue;
        color: black;
    }
    /*input[type=text]{width: 100px;height: 50px }*/

    /*input[type=test]{width: 100px;height: 50px }*/

    .c1[n=test]{width: 100px;height: 150px }

    </style>


</head>
<body>
    <div id="i11">1</div>
    <div class="c1">1</div>
    <span class="c1">sasafsaf
        <div>12345</div>
    </span>

    <div id="i1">2</div>
    <div id="i2">3</div>
    <div id="i3">4</div>

    <input class="c1" type="text" n="test">
    <input class="c1" type="password">
</body>
</html>

View Code

CSS
   在标签上设置style属性
           background: #FAFAD2;
           height: 100px
   编写CSS样式：
       1.标签的style属性
       2.写在head里面，style标签中写样式
           - id选择区
                    <style>#i11{
                       background: #FAFAD2;
                       height: 100px
                   }</style>

           - class选择器
               .c1{
               background: #FFD39B;
               height: 100px
                   }
               <标签 class="c1"><标签/>
           - 标签选择器：
               div{
               ....
               }
               所有div 设置上此样式
           -层级选择器
               c1.c2 div{
               ....
               }
           - 组合选择器（逗号分隔）
                    #i1,#i2,#i3 {
                       background: aliceblue;
                       color: black;
                               }

           - 属性选择器
               对选择到的标签再通过属性再进行一次筛选

　 3.注释
/* 内容 */

标签：color,100px,height,background,div,选择器,CSS
来源： https://www.cnblogs.com/anhao-world/p/14047021.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

CSS 选择器