简述 css 样式表的使用方式。
摘要：
1.CSS 样式表简介 
2.使用内联样式 
3.使用内部样式表 
4.使用外部样式表 
5.CSS 选择器 
6.常用 CSS 样式属性 
7.应用 CSS 样式实例
正文：
CSS(层叠样式表) 是一种用于描述 HTML 或 XML 文档样式的样式表语言。通过使用 CSS 样式表，可以为网页中的元素 (如标题、段落、图像等) 设置字体、颜、大小、位置和其他外观属性。CSS 样式表可以应用于 HTML 文档的内部或外部，可以通过各种选择器来选取需要应用样式的元素。
以下是使用 CSS 样式表的一些常见方式:
## 使用内联样式
内联样式是指在 HTML 元素中使用`style`属性来设置元素的样式。例如，以下代码将在段落元素中设置字体颜为红:
``` 
<p >这是一个红的段落。</p> 
```
使用内联样式的方法不太推荐，因为它会使 HTML 文档变得难以阅读和维护。
## 使用内部样式表
内部样式表是指在 HTML 文档的`<head>`部分使用`<style>`标签来定义 CSS 样式。例如，以下代码定义了一个名为`my-style`的 CSS 样式，它将应用于 HTML 文档中的所有段落元素:
``` 
<head> 
  <style> 
    .my-style { 
      color:red; 
    } 
  </style> 
</head> 
<body> 
  <p class="my-style">这是一个红的段落。</p> 
  <p class="my-style">这是另一个红的段落。</p> 
</body> 
css外部样式表代码```
使用内部样式表比使用内联样式更推荐，因为它可以使 HTML 文档更容易阅读和维护，并且可以轻松地为多个元素应用相同的样式。
## 使用外部样式表
外部样式表是指将 CSS 样式定义在一个单独的`.css`文件中，并在 HTML 文档中使用`<link>`标签引用该文件。例如，以下代码将引用一个名为`styles.css`的外部样式表，其中定义了一个名为`my-style`的 CSS 样式，它将应用于 HTML 文档中的所有段落元素:
``` 
<head> 
  <link rel="stylesheet" href="styles.css"> 
</head> 
<body> 
  <p class="my-style">这是一个红的段落。</p> 
  <p class="my-style">这是另一个红的段落。</p> 
</body> 
```
使用外部样式表是最推荐的，因为它可以最大程度地提高 HTML 文档的可读性和可维护性，并且可以轻松地为多个 HTML 文档应用相同的样式。
## CSS 选择器
CSS 选择器是用于选取需要应用样式的 HTML 元素的一种方式，它包括元素选择器、类选择器、ID 选择器、属性选择器等。通过使用选择器，可以精确地选择需要的元素，并为其设置样式。
## 常用 CSS 样式属性
CSS 样式属性包括字体、颜、大小、位置、背景、边框等属性，通过使用这些属性，可以为 HTML 元素设置各种样式。
## 应用 CSS 样式实例
以下是一个简单的应用 CSS 样式的实例，它将创建一个具有蓝背景和白文本的 div 元素，该元素具有 10 像素的内外边距，并居中显示:
``` 
<!DOCTYPE html> 
<html> 
<head> 
  <style> 
    .blue-box { 
      background-color:blue; 
      color:white; 
      margin:10px; 
      padding:10px; 
      display:block; 
      margin-left:auto; 
      margin-right:auto; 
    } 
  </style> 
</head> 
<body> 
  <div class="blue-box"> 
    这是一个蓝的 div 元素。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。