HTML学习笔记（三）——HTML样式-CSDN博客

本文链接：https://blog.csdn.net/FERN_/article/details/77993488

1、定义背景颜色

<h2 style="background-color:red">This is a heading</h2>  <!--定义标题的背景颜色-->
<p style="background-color:green">This is a paragraph.</p>    <!--定义段落的背景颜色-->

<body>标签拥有两个配置背景的标签，可以是颜色或者图像。
（1）如果背景是颜色时，背景颜色（bgcolor）可以是16进制数，RGB值或颜色名

<body bgcolor="#000000">   <!--颜色可以为16进制数-->
<body bgcolor="rgb(0,0,0)">    <!--颜色可以为rgb数-->
<body bgcolor="black">    <!--颜色可以为颜色名-->

（2）如果背景为图片时，背景（background）属性值为图像的URL，如果图像小于浏览器的窗口，将会在浏览器的窗口中进行复制

**注意：**gif和jpg文件均可作为HTML的背景
<body>中的text属性可以配置一整个网页上字体的颜色

2、定义字体颜色尺寸：

<h1 style="font-family:verdana">A heading</h1>   <!--font-family定义字体-->
<p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p>    <!--font-family定义字体，color定义颜色，font-size定义大小-->

3、定义文本对齐方式：

<h1 style="text-align:center">This is a heading</h1>     <!--text-align定义文字的对齐方式-->

其中，text-align所能选择的选项有：left center right

4、插入样式表(CSS)的三种方法
（1）外部样式表：

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

即用css文件（css文件就是风格样式单，用来进行网页风格设计的文件）进行网页样式的定义，可以通过更改css这一个文件，实现对全部网页外观的更改，通过标签链接到一个外部样式，制作好CSS文件，然后将它放在head区域

（2）内部样式表：

<head>
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>

在<head>部分通过<style>标签定义内部样式表

（3）内联样式：即上文中所述，定义在标签里的

5、<div></div>可以定义一个节或者区域的属性

<div style="color:#00FF00">       
  <h3>This is a header</h3>
  <p>This is a paragraph.</p>
</div>

此处的head和paragraph将拥有同样的颜色