码迷,mamicode.com
首页 > 其他好文 > 详细

类选择器

时间:2017-02-14 13:11:14      阅读:95      评论:0      收藏:0      [点我收藏+]

标签:属性   font   back   text   under   20px   ack   元素   head   

类选择器

 

我是老大

我是老二

我是老三

大嫂
二嫂
三嫂

 

老五告诉老四老三的老二老大了

 

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>类选择器</title>
    <style>
        /*.one:类选择器,类选择器在类名前必须加 . 符号*/
        .one{
            color: blue;
            text-decoration: underline;
        }
        .two{
            font-size: 20px;
            background-color: yellow;
        }
        .three{
            color: red;
        }
        /*one类的所有p标签加样式*/
        p.one{
            font-weight: bold;
            font-style: italic;
            /*italic 斜体字 bold 加粗*/
        }
    </style>
</head>
<body>
    <!--class属性:类,给元素添加一个类,多个元素可以使用同一个类-->
    <P class="one">我是老大</P>
    <P class="two">我是老二</P>
    <!--一个元素可以加多个类,用空格隔开-->
    <P class="three two">我是老三</P>

    <div class="three">大嫂</div>
    <div class="two">二嫂</div>
    <div class="one">三嫂</div>
    <br>
    <div>老五告诉老四老三的老二老大了</div>
</body>
</html>

  

类选择器

标签:属性   font   back   text   under   20px   ack   元素   head   

原文地址:http://www.cnblogs.com/john568300/p/6396966.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!