CSS是一种用于网页设计的风格表语言。CSS可以使网页外观变得优美,而且还能改善网页的可访问性和交互性。CSS有三种创建方式:内部样式表、外部样式表和内联样式表。内部样式表是在<head
CSS是一种用于网页设计的风格表语言。CSS可以使网页外观变得优美,而且还能改善网页的可访问性和交互性。CSS有三种创建方式:内部样式表、外部样式表和内联样式表。内部样式表是在<head>标签内部添加<style>标签,然后编写CSS样式代码;外部样式表是把样式代码单独放在一个CSS文件中,通过<link>标签将其引入HTML文件;内联样式表是在HTML标签上直接添加样式,如<p style="color:red">。
除了创建方式,CSS还有六种选择器:元素选择器、ID选择器、类选择器、伪类选择器、属性选择器和后代选择器。元素选择器指定一个或多个HTML元素作为选择器的对象,如<p>、<div>等;ID选择器指定一个元素的ID属性作为选择器的对象,如<div id="container">;类选择器指定一个或多个元素的类名作为选择器的对象,如<div class="container">;伪类选择器指定一个元素的某个状态作为选择器的对象,如:hover、:first-child等;属性选择器指定一个元素的某个属性作为选择器的对象,如[target]、[href$=".pdf"]等;后代选择器指定一个元素的后代元素作为选择器的对象,如.container p{}。
/* 内部样式表 */ <head> <style> body { background-color: #f2f2f2; font-family: Arial, sans-serif; } h1 { color: blue; } </style> </head> /* 外部样式表 */ <head> <link rel="stylesheet" href="style.css"> </head> /* 内联样式表 */ <p style="color:red">Hello, world!</p> /* 元素选择器 */ p { font-size: 14px; } /* ID选择器 */ #container { width: 960px; margin: 0 auto; } /* 类选择器 */ .intro { font-style: italic; } /* 伪类选择器 */ a:hover { color: red; } /* 属性选择器 */ input[type="text"] { border: 1px solid #ccc; } /* 后代选择器 */ .container p { margin-bottom: 10px; }
粉丝
0
关注
0
收藏
0