css基础选择器

一、基础选择器

1.id选择器

2.class选择器

3.元素选择器

id选择器

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>id选择器</title>
        <style>
            #text{
                font: "微软雅黑";
                color: red;                
            }
        </style>
    </head>
    <body>
        <h1 id="text">长恨歌 </h1>
        <h3 id="text">作者:白居易</h3>
        <p id="text">
        《长恨歌》是唐代诗人白居易的一首长篇叙事诗。全诗形象地叙述了唐玄宗与杨贵妃的爱情悲剧。诗人借历史人物和传说,创造了一个回旋宛转的动人故事,并通过塑造的艺术形象,再现了现实生活的真实,感染了千百年来的读者,诗的主题是“长恨”。该诗对后世诸多文学作品产生了深远的影响。
        </p>
    </body>
</html>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>class选择器</title>
        <style>
            .red-text{
                font: "微软雅黑";
                color: red;                
            }
        </style>
    </head>
    <body>
        <h1 class="red-text">长恨歌 </h1>
        <h3 class="red-text">作者:白居易</h3>
        <p class="red-text">
        《长恨歌》是唐代诗人白居易的一首长篇叙事诗。全诗形象地叙述了唐玄宗与杨贵妃的爱情悲剧。诗人借历史人物和传说,创造了一个回旋宛转的动人故事,并通过塑造的艺术形象,再现了现实生活的真实,感染了千百年来的读者,诗的主题是“长恨”。该诗对后世诸多文学作品产生了深远的影响。
        </p>
    </body>
</html>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>元素选择器</title>
        <style>
            h1{color: blue;}
            p{
                font: "微软雅黑";
                color: red;                
            }
        </style>
    </head>
    <body>
        <h1>长恨歌 </h1>
        <h3>作者:白居易</h3>
        <p>
        《长恨歌》是唐代诗人白居易的一首长篇叙事诗。全诗形象地叙述了唐玄宗与杨贵妃的爱情悲剧。诗人借历史人物和传说,创造了一个回旋宛转的动人故事,并通过塑造的艺术形象,再现了现实生活的真实,感染了千百年来的读者,诗的主题是“长恨”。该诗对后世诸多文学作品产生了深远的影响。
        </p>
    </body>
</html>

长恨歌

作者:白居易

《长恨歌》是唐代诗人白居易的一首长篇叙事诗。全诗形象地叙述了唐玄宗与杨贵妃的爱情悲剧。诗人借历史人物和传说,创造了一个回旋宛转的动人故事,并通过塑造的艺术形象,再现了现实生活的真实,感染了千百年来的读者,诗的主题是“长恨”。该诗对后世诸多文学作品产生了深远的影响。

相关推荐