一、HTML 样式- CSS
CSS（Cascading Style Sheets）可译为“层叠样式表”或“级联样式表”，它定义如何显示 HTML 元素，用于控制 Web 页面的外观。
CSS 用于渲染HTML元素标签的样式。样式存储在样式表中，通常放在<head>部分或存储在外部CSS文件中。
二、使用 CSS
CSS 可以通过以下方式添加到 HTML 中：
- 内联样式
在HTML元素中使用style属性 - 内部样式表
在HTML文档头部<head>区域使用<style>元素来包含CSS - 外部引用
使用外部 CSS 文件（最好的方式）
（一）内联样式
<h1>标题一</h1>
<p>段落一。。。。。。</p>
<a href="http://www.baidu.com/" style="text-decoration:none;">访问百度</a>
<p style="color:blue;margin-left:20px;">段落二。。。。。。</p>
内联样式.png
（二）内联样式表
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS</title>
<meta charset="utf-8">
<style type="text/css">
h1 {color:green;}
p {color:yellowgreen;}
</style>
</head>
<body>
<h1>标题一</h1>
<p>段落一。。。。。。</p>
<a href="http://www.baidu.com/" style="text-decoration:none;">访问百度</a>
</body>
</html>
内联样式表.png
（三）外部链接
CSS文件
h1 {color:blueviolet;}
p {color:greenyellow;}
外部链接实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="/PRO_Python3/Python学习/Test2018/TestCSS/CSS01.css">
</head>
<body>
<h1>标题一</h1>
<p>段落一。。。。。。</p>
<a href="http://www.baidu.com/" style="text-decoration:none;">访问百度</a>
</body>
</html>
外部链接.png
（四）CSS 实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="/PRO_Python3/Python学习/Test2018/TestCSS/CSS01.css">
</head>
<body style="background-color:lightskyblue;">
<h1 style="font-family:verdana;text-align:center;">标题一</h1>
<p>段落一。。。。。。</p>
<a href="http://www.baidu.com/" style="text-decoration:none;">访问百度</a>
<p style="background-color:greenyellow;color:blue;margin-left:20px;">段落二。。。。。。</p>
</body>
</html>
CSS 实例.png
网友评论