CSS层叠样式表基本样式的位置

来源：互联网发布：linux快捷键编辑：程序博客网时间：2024/06/06 14:21
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>CSS层叠样式表</title>    <!--        元素就是标签,标签就是元素,CSS样式修饰HTML页面可以出现的位置        1)可以将CSS样式编写到要修饰的标签(元素)的style属性中        2)也可以将CSS样式编写到head标签的style标签里 type:text/css 表示对text文本修饰        3)-    -->    <style type="text/css">        /* 元素选择器(针对所有p元素)  将样式表编写到style标签属性中,可以使样式进一步复用            而且还进一步起到了"结构(html)与样式(CSS)"分离的效果",实际开发中推荐使用        */        p{            color: green;            font-size: 20px;        }    </style>    <!-- 将CSS样式表编写到外部的CSS文件中,然后通过link标签来引用外部的CSS文件        href:要引入的外部CSS样式的路径        好处:将CSS样式统一编写到外部的样式表中,完全起到了"结构(html)与样式(CSS)"分离的效果，        可以使样式表可以在不同的页面中使用，最大限度的使样式进行复用,使样式统一写到样式表中,然后通过        link标签引入,可以利用浏览器的缓存效果,加快用户的访问速度,提高了用户体验        在实际开发中这种"外部引用样式"最为常用    -->    <link rel="stylesheet" type="text/css" href="css/style.css"/></head><body>    <!--    内部样式表:只能在当前页面中可以复用(重复使用)    外部样式表:将CSS样式表编写到一个外部的css文件中    style属性中以键值对出现,以分号分割不同属性        color: red 设置颜色        font-size: 20px  设置字体大小        属于内联样式,只对当前元素的内容起作用        内联样式属于结构与表现相耦合,不方便后期的维护,这种方式在实际开发中使用较少    -->    <p style="color: red;font-size: 20px;">        学不会去认输&nbsp;&nbsp;也许只能背负<br/>        难懂人心残酷 &nbsp;&nbsp;让我勇敢沉浮<br/>    </p>    <p>        看不清眼前路&nbsp;&nbsp;只能上前一步<br/>        哪怕游戏结束&nbsp;&nbsp;还有一身傲骨<br/>    </p>    <p>        学不会不在乎&nbsp;&nbsp;管他一念糊涂<br/>        谁将信仰保护&nbsp;&nbsp;谁也想被保护<br/>    </p></body></html>
阅读全文
0 0