0
点赞
收藏
分享

微信扫一扫

HTML|内联CSS-背景和字体


HTML|内联CSS-背景和字体

CSS (Cascading Style Sheets) 用于渲染 HTML 元素标签的样式。

CSS 是在 HTML4 开始使用的,是为了更好的渲染 HTML 元素而引入的。

CSS 可以通过以下方式添加到HTML中:

  • 内联样式:在HTML元素中使用"style" 属性
  • 内部样式表:在HTML文档头部 head>区域使用style>元素来包含CSS
  • 外部引用:使用外部CSS文件

内联样式

当特殊的样式需要应用到个别元素时,就可以使用内联样式。 使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。以下实例显示出如何改变段落的颜色和左外边距。

1.内联背景颜色

在标签中添加属性style,并且在style中加上background-color:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>内联CSS</title>
</head>
<!--
内联CSS
在标签中添加style并且设置background-color即可设置对应部位的颜色
-->
<bodystyle="background-color:">

<h1style="background-color:">标题</h1>
<pstyle="background-color:">
第一行
<br>
第二行
</p>

</body>
</html>

HTML|内联CSS-背景和字体_css3

2.字体、字体颜色、字体大小

可以通过style中添加如下属性来设置文字:

字体:font-family
颜色:color
大小:font-size

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>内联CSS</title>
</head>
<!--
内联CSS
在标签中添加style并且设置background-color即可设置对应部位的颜色
-->
<bodystyle="background-color:">

<h1style="background-color:">标题</h1>
<pstyle="background-color:">
第一行
<br>
第二行
</p>

<hr>
<!--
字体:font-family
颜色:color
大小:font-size
-->
<h1style="color:">标题</h1>
<pstyle="font-family: Arial;color: red;font-size:">
第一行
</p>

</body>
</html>

HTML|内联CSS-背景和字体_css3_02

可以看到红框内的内容就是设置了字体颜色,样式和大小。

人生没有白走的路,每一步都算数!


举报

相关推荐

0 条评论