CSS (Cascading Style Sheets) 用于渲染HTML元素标签的样式,简单的说就是让HTML富有色彩更加美观。
CSS 可以通过以下方式添加到HTML中:
内联样式- 在HTML元素中使用"style" 属性
内部样式表 -在HTML文档头部 <head> 区域使用<style> 元素 来包含CSS
外部引用 - 使用外部 CSS 文件
要定义单个元素时使用,样式属性可以包含任何 CSS 属性。
<元素名称 style="属性:属性值;"></元素名称>
内联样式
内部样式表
外部样式表
<p style="color:blue;">内联样式</p> <p>内部样式表</p> <p>外部样式表</p>
定义单个HTML文件里的样式时使用,你可以在<head> 部分通过 <style>标签定义内部样式表。
<style>
选择符{属性:属性值;}
</style>
<元素名称 class="类选择符名称"></元素名称>
<元素名称 id="id 类选择符名称"></元素名称>![1554794039601885.png 5`E3UUXL[}R]V@VM4ZYG9T2.png](/ueditor/php/upload/image/20190409/1554794039601885.png)
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>炫代码(www.xuandaima.com)</title>
<style type="text/css">
p.hh1 {color:blue;}
</style>
</head>
<body>
<p>内联样式</p>
<p class="hh1">内部样式表</p>
<p>外部样式表</p>
</body>
</html>只要引入外部样式表,该站点内外的所有文件都可以使用。
<link rel="stylesheet" href="css文件路径" type="text/css"/> <元素名称 class="类选择符名称"></元素名称> <元素名称 id="id 类选择符名称"></元素名称>
![1554794465552958.png 24)T]QBP(EKVM_}2MG7$A6P.png](/ueditor/php/upload/image/20190409/1554794465552958.png)
p.hh1{color:blue;}<!doctype html> <html> <head> <meta charset="utf-8"> <title>炫代码(www.xuandaima.com)</title> <link rel="stylesheet" type="text/css" href="/Template/Test/css/wailian.css"> </head> <body> <p>内联样式</p> <p>内部样式表</p> <p class="hh1">外部样式表</p> </body> </html>
| 标签 | 描述 |
|---|---|
| <style> | 定义文本样式 |
| <link> | 定义资源引用地址 |
如果想了解更多CSS知识,请看CSS教程。