第三篇、CSS样式简介

<!--1.行内样式
<p style="background-color:red;font-size:20px">
-->

<!--2.页内样式
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            body{
                background-color:gray;
            }
            
            div{
                background-color:red;
            }
            
            p{
                font-size:50px;
            }
        </style>
    </head>
-->

<!--3.外部样式
    <link rel="stylesheet" href="./css/index.css">
-->

<!--
    CSS样式规律：
    1>就近原则（谁离我的内容近就用谁）
    2>叠加原则
-->


<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            body{
                background-color:gray;
            }
            
            div{
                background-color:red;
            }
            
            p{
                font-size:50px;
            }
            
            <!--引用外部的css样式 rel层叠样式表 -->
            <link rel="stylesheet" href="./css/index.css">
        </style>
    </head>
    
    <body>
        <div style="font-size:20px;color:blue;">22222222222222222</div>
        <p>11111111111111111111111111111111111111111</p>
    </body>

</html>
posted on 2016-09-01 23:36 久冬不雨阅读(156) 评论(0) 编辑收藏举报