1. 编辑文字样式，在head的style里定义，body中直接调用即可
<html>
<head>
<style>
body {background-color:lightgrey}
h1 {color:blue}
p {color:green}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
2. Styling HTML with CSS 三种方式
Inline, Internal, External
3. Inline
<body>
<h1 style="color:blue">This is a Blue Heading</h1>
</body>
4. Internal
<head>
<style>
body {background-color:lightgrey}
h1 {color:blue}
p {color:green}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
5. External
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
6. color, font-family, font-size
h1 {
color:blue;
font-family:verdana;
font-size:300%;
}
p {
color:red;
font-family:courier;
font-size:160%;
}
7. box
border:1px solid grey 框的粗细，填充程度和颜色
8. box里的空间大小
border:1px solid grey;
padding:10px;
9. box外的空间大小
border:1px solid grey;
padding:10px;
margin:30px;
10. id 定义一句话
<head>
<style>
p#p01 {
color: blue;
}
</style>
</head>
<body>
<p>This is a paragraph.</p>
<p id="p01">I am different.</p>
</body>
11. class 定义多句话
<head>
<style>
p.error {
color:red;
}
</style>
</head>
<body>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
<p class="error">I am different.</p>
<p>This is a paragraph.</p>
<p class="error">I am different too.</p>
</body>
12. Use id to address single elements. Use class to address groups of elements. (未理解)
13. Deprecated Tags and Attributes in HTML5 （未理解）
In older HTML versions, several tags and attributes were used to style documents.
These tags and attributes are not supported in HTML5!
Avoid using the <font>, <center>, and <strike> elements.
Avoid using the color and bgcolor attributes.
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
