zoukankan      html  css  js  c++  java
  • 01-HTML基础与进阶-day6-录像282

    05类选择器.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <style type="text/css">
           /* 类选择器*/
           .mingren {
                  color: red;
           }
    
           .history {
                 font-size: 30px;
           }
    
           .文物 {
                  color: pink;
           }
           
           /*  
           .246 {
                 font-size: 30px;
           }
           */
           .c-orange {
                  color: orange;
           }
        </style>
    </head>
    <body>
        <div class="mingren">名人</div>
        <div class="history">历史</div>
        <div class="文物">文物</div>
        <div class="246">文物</div>
        <p class="c-orange">猥琐发育,别浪</p>
    </body>
    </html>

     06google案例.html

     

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <style type="text/css">
           span {
                font-size: 100px;
           }
    
           .blue {
                  color: blue;
           }
    
           .red {
                  color: red;
           }
    
           .orange {
                  color: orange; 
           }
    
           .green {
                  color: green; 
           }
        </style>
    </head>
    <body>
        <span class="blue">G</span>
        <span class="red">o</span>
        <span class="orange">o</span>
        <span class="blue">g</span>
        <span class="green">l</span>
        <span class="red">e</span>
    </body>
    </html>

     07一个标签携带多个类.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <style type="text/css">
           /*
           .lb {
                  color: pink;
                  font-size: 20px;
                  font-weight: 700;
           }*/
    
           .pink {
                  color: pink;
           }
    
           .font20 {
                 font-size: 20px;
           }
    
           .fontWeight {
                 font-weight: 700;
           }
        </style>
    </head>
    <body>
        <div class="pink font20 fontWeight">刘备</div>
        <div class="font20 fontWeight">张飞</div>
        <div class="pink fontWeight">关羽</div>
    </body>
    </html>
  • 相关阅读:
    Git学习-创建版本库
    使用Vim编辑器,如何退出
    设置既定目录的命令提示符
    字符数组和字符串
    一波杂乱的分享
    全国软件设计大赛C/C++语言练习
    HDU 1720、1062、2104、1064、2734、1170、1197、2629
    hdu 2000-2010 ACM
    HDU——算法练习1000 1089-1096
    爬虫学习笔记之为什么要设置超时时间,怎么设置(使用selenium)
  • 原文地址:https://www.cnblogs.com/HiJackykun/p/11032340.html
Copyright © 2011-2022 走看看