- ·上一篇内容:HTML 块级元素和内联元素
- ·下一篇内容:HTML 颜色名称
HTML 颜色
在网页中,我们通常使用多种颜色让网页生动多彩。颜色可以运用在网页文本、网页区域背景、区域边框等地方。
不同颜色可以表达不同的情感,进而给人喜悦、哀伤或让人感觉网页提供的内容和服务更加专业和可信。
在HTML中通常使用颜色名称、RGB、RGBA、HEX、HSL或HSLA等方式指定颜色。
颜色名称
在HTML中可以使用颜色名称来指定要设置的颜色,如black、white、blue、red等。所有现代浏览器支持140种标准颜色名称。
下面给出一些颜色的名称。
设置元素背景的颜色
使用CSS的background-color可以指定某个元素的背景颜色。如下面两个效果。
离离原上草,
一岁一枯荣。
野火烧不尽,
春风吹又生。
下面是使用颜色设置元素背景的一个例子。
<h1
style="background-color:blue;">HTML颜色</h1>
<p
style="background-color:brown;">在HTML中可以使用颜色名称来指定要设置的颜色,如black、white、blue、red等。所有现代浏览器支持140种标准颜色名称。</p>
其预览效果如下图所示:
设置字体的颜色
我们可以使用颜色设置字体的颜色。
如下面两个内容的字体颜色。
翔宇亭IT乐园:http://www.biye5u.com
离离原上草,
一岁一枯荣。
野火烧不尽,
春风吹又生。
下面这个例子演示了使用元素的style属性来设置字体颜色的方法。
<h2 style="color:dodgerblue;">使用颜色名称来设置字体颜色</h2>
<p
style="color:darkgreen;">在HTML中可以使用颜色名称设置字体的颜色。</p>
其效果如下图所示:
设置元素边框的颜色
我们可以使用颜色名称设置元素边框的颜色。
下面两行文字分别使用green和blue设置的边框。
下面这个例子使用元素的style属性设置了边框的颜色。
<h2 style="border:1px solid green;">使用颜色名称来设置边框的颜色</h2>
<p
style="border:2px solid tomato;">在HTML中可以使用颜色名称设置边框的颜色。</p>
第一行文字设置边框的粗细为1像素,实线,绿色;第2个例子设置边框粗细为2个像素,实线,tomato颜色。
其效果如下图所示:
以上各例的效果可以使用自己的浏览器来预览其效果。
HTML的颜色值
在HTML中,可以使用RGB、HEX、HSL、RGBA或HSLA的值来指定一种颜色。
如对以上内容有疑问或文中有错误之处,请留言指出。如需转载,请注明出处:翔宇亭IT乐园(http://www.biye5u.com),并给出本文的链接地址:http://www.biye5u.com/article/html5/2023/6599.html。
微信搜索“优雅的代码”关注本站的公众号,或直接使用微信扫描下面二维码关注本站公众号,以获取最新内容。
个人成长离不开各位的关注,你的关注就是我继续前行的动力。