本文概述
- HTML样式颜色
- HTML样式背景色
- HTML Style字体家族
- HTML样式的字体大小
- HTML样式文本对齐
- 支持的浏览器
样式属性可以与任何HTML标记一起使用。要将样式应用于HTML标签, 你应该具有CSS属性的基本知识, 例如颜色, 背景色, 文本对齐, 字体系列, 字体大小等。
样式属性的语法如下:
style= "property:value"
HTML样式颜色color属性用于定义文本颜色。
让我们看一个简单的示例, 通过css的color属性对html标签进行样式设置。
<
h3 style="color:green">
This is Green Color<
/h3>
<
h3 style="color:red">
This is Red Color<
/h3>
立即测试
输出:
这是绿色
这是红色
HTML样式背景色background-color属性用于定义HTML标签的背景色。
让我们看一个通过css background-color属性设置html标签样式的示例
<
h3 style="background-color:yellow;
">
This is yellow background<
/h3>
<
h3 style="background-color:red;
color:white">
This is red background<
/h3>
立即测试
输出:
这是黄色的背景
这是红色背景
HTML Style字体家族font-family属性指定HTML标签的字体系列。
让我们看一个通过css font-family属性设置html标签样式的示例
<
h3 style="font-family:times new roman">
This is times new roman font family<
/h3>
<
p style="font-family:arial">
This is arial font family<
/p>
立即测试
输出:
这是时代新的罗马字体家族
这是arial字体家族
HTML样式的字体大小font-size属性用于定义HTML标签的文本大小。
让我们看一个font-size属性的例子
<
h3 style="font-size:200%">
This is 200% h3 tag<
/h3>
<
p style="font-size:200%">
This is 200% p tag<
/p>
立即测试
输出:
这是200%的h3标签
这是200%p标签
HTML样式文本对齐text-align属性用于定义HTML元素的水平文本对齐方式。
让我们看一个通过css text-align属性设置html标签样式的示例
<
h3 style="text-align:right;
background-color:pink;
">
This text is located at right side<
/h3>
<
p style="text-align:center;
background-color:pink;
">
This text is located at center side<
/p>
立即测试
如果要将标题放在中心或左边, 请分别使用“ text-align:center”或“ text-align:left”。
输出:
此文字位于右侧
这段文字位于中间
HTML5不支持旧版HTML中支持的< center> 标记。支持的浏览器
Element | Chrome | IE | Firefox | Opera | Safari |
style attribute | Yes | Yes | Yes | Yes | Yes |
推荐阅读
- HTML sub标签
- HTML strong标记
- HTML strike标记(HTML5不支持)
- HTML span标记
- HTML space空格代码
- HTML source标签
- HTML small标记
- HTML5服务器发送的事件
- HTML select标签