一、CSS是什么
CSS= Cascading Style Sheet,即层叠样式表,是一种指定HTML文档视觉表现的标准。对文档元素的字体、颜色、外边距、缩进、边框、甚至定位进行了列举,即成为了CSS标准中的属性。例如:
body {
color:white; /*字体为白色*/
background-color:black; /*背景为黑色*/
}
p {
color:#00ff90; /*设置p元素(即<p> · · · · · ·</p>)的字体为#00ff90号颜色*/
}
属性还有很多、如:
font-weight:900; /*设置字体的粗细*/
margin:auto; /*设置外边区域的厚度*/
· · · · · ·
二、如何使CSS发挥作用
方法1.用<style>和</style>标签把一个CSS样式表(即CSS的语句)抱起来发在head中(即<head>和</head>标签之间)
相当于在头部多了一个面具(style)元素:
<!DOCTYPE html>
<html> <!--<html xmlns="http://www.w3.org/1999/xhtml">-->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>This is a HTML</title>
<style>
body {
color:white;
background-color:black;
}
p {
color:#00ff90;}
</style>
<body>
<f>HELLO</f>
<li>123</li>
<li>456</li>
<p> CAN YOU SEE</p>
<ul id="purchases">
<li>ABC</li>
<li>DEF</li>
</ul>
</body>
</html>
方法2.创建一个xx.css文件,以mystyles.css文件为例。在head中使用<link>标签:
<!DOCTYPE html>
<html> <!--<html xmlns="http://www.w3.org/1999/xhtml">-->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>This is a HTML</title>
<link href="mystyle.css"/ rel="stylesheet" type="text/css">
<body>
<f>HELLO</f>
<li>123</li>
<li>456</li>
<p> CAN YOU SEE</p>
<ul id="purchases">
<li>ABC</li>
<li>DEF</li>
</ul>
</body>
</html>