二维码
搜索 ×

HTML 样式

  • 作者：图形开发学院
  • 更新时间：2023年11月01日
  • 阅读量：0
  • 收藏数：0

HTML 样式

HTML 属性用于向元素添加样式，例如颜色、字体、大小等。style

1
2
3
4
5
I am Red

I am Blue

I am Big

结果

HTML 样式属性

设置 HTML 元素的样式，可以使用属性来完成。style

HTML 属性的语法如下：style

1
<*tagname* style="*property*:*value;*">

该属性是 CSS 属性。该值是 CSS 值。

在本教程的后面部分，您将了解有关 CSS 的更多信息。

背景颜色

CSS 属性定义背景色 对于 HTML 元素。background-color

1
2
3
4
5
6
7
8
将页面的背景颜色设置为 powderblue：

<body style="background-color:powderblue;">  

<h1>This is a heading</h1>  
<p>This is a paragraph.</p>

</body>

1
2
3
4
5
6
7
8
为两个不同的元素设置背景颜色：

<body>

<h1 style="background-color:powderblue;">This is a heading</h1>  
<p style="background-color:tomato;">This is a paragraph.</p>  

</body>

文本颜色

CSS 属性定义 一个 HTML 元素：color

1
2
<h1 style="color:blue;">This is a heading</h1>  
<p style="color:red;">This is a paragraph.</p>

字体

CSS 属性定义要使用的字体 对于 HTML 元素：font-family

1
2
<h1 style="font-family:verdana;">This is a heading</h1>  
<p style="font-family:courier;">This is a paragraph.</p>

文字大小

CSS 属性定义 一个 HTML 元素：font-size

1
2
<h1 style="font-size:300%;">This is a heading</h1>  
<p style="font-size:160%;">This is a paragraph.</p>

文本对齐方式

CSS 属性定义 HTML 元素的水平文本对齐方式：text-align

1
2
<h1 style="text-align:center;">Centered Heading</h1>  
<p style="text-align:center;">Centered paragraph.</p>

本章小结

  • 使用 属性设置 HTML 元素的样式style
  • 用于背景颜色background-color
  • 用于文本颜色color
  • 用于文本字体font-family
  • 用于文本大小font-size
  • 用于文本对齐text-align

推荐教程