美文网首页
css选择器和文本标签

css选择器和文本标签

作者: f6d8ee519880 | 来源:发表于2018-11-19 15:41 被阅读0次

    1、css选择器

    • 标签选择器
    *{margin:0;padding:0}
    div{color:red}   
    
    
    <div>....</div>   <!-- 对应以上两条样式 -->
    <div class="box">....</div>   <!-- 对应以上两条样式 -->
    
    • id选择器
    #box{color:red} 
    
    <div id="box">....</div>   <!-- 对应以上一条样式,其它元素不允许应用此样式 -->
    
    • 类选择器
    .red{color:red}
    .big{font-size:20px}
    .mt10{margin-top:10px} 
    
    <div class="red">....</div>
    <h1 class="red big mt10">....</h1>
    <p class="red mt10">....</p>
    
    • 层级选择器
    .box span{color:red}
    .box .red{color:pink}
    .red{color:red}
    
    <div class="box">
        <span>....</span>
        <a href="#" class="red">....</a>
    </div>
    
    <h3 class="red">....</h3>
    
    • 组选择器
    .box1,.box2,.box3{width:100px;height:100px}
    .box1{background:red}
    .box2{background:pink}
    .box2{background:gold}
    
    <div class="box1">....</div>
    <div class="box2">....</div>
    <div class="box3">....</div>
    
    • 伪类选择器
    .box1:hover{color:red}
    .box2:before{content:'行首文字';}
    .box3:after{content:'行尾文字';}
    
    
    <div class="box1">....</div>
    <div class="box2">....</div>
    <div class="box3">....</div>
    

    文本标签

    • em标签用于表示一段内容中的着重点。
    • strong标签用于表示一个内容的重要性。
    • i标签会使文字变成斜体。
    • b标签会使文字变成粗体。
    • 浏览器在显示small标签时会显示一个比父 元素小的字号。
    • 使用cite标签可以指明对某内容的引用或参 考。
    • blockquote和q表示标记引用的文本。
    • blockquote用于长引用,q用于短引用。
    • sup和sub用于定义上标和下标。
    • ins表示插入的内容,显示时通常会加上下 划线。
    • del表示删除的内容,显示时通常会加上删 除线。

    相关文章

      网友评论

          本文标题:css选择器和文本标签

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