CSS(3)教程 css的一般属性
大家好呀，上一节课我们聊了关于字体以及文本的基本属性，这节课小编带着大家了解一些css3的基本属性，目录如下表：
CSS属性 颜色
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.p1{color: #000;}.p2{background-color: #000;color: rgb(253, 252, 252);}</style>
</head>
<body><p class="p1">我是p标签1号！</p><p class="p2">我是p标签2号！</p>
</body>
</html>CSS内容颜色
我们先了解一下内容颜色，看上图，p1表现的是内容颜色。内容颜色是什么颜色呢？指得是将要在文章中输出的内容指定颜色。#000是颜色表，是黑色。如图：
这就是内容颜色的定义了。颜色也补充一下，当你用vscode编辑器（推荐，不会下载的看这一篇：html教程（3）_小旭的前端笔记的博客-CSDN博客）的时候，将鼠标放上去，会有颜色表，自己选择即可。
还有一种颜色，就是小编的#000，不理解的朋友看下表，这种颜色叫做RGB，有兴趣的朋友上网搜一搜。
R
G
B
值
R
G
B
值
R
G
B
值
黑色
0
0
0
#000000
黄色
255
255
0
#FFFF00
浅灰蓝色
176
224
230
#B0E0E6
象牙黑
41
36
33
#292421
香蕉色
227
207
87
#E3CF57
品蓝
65
105
225
#4169E1
灰色
192
192
192
#C0C0C0
镉黄
255
153
18
#FF9912
石板蓝
106
90
205
#6A5ACD
冷灰
128
138
135
#808A87
dougello
235
142
85
#EB8E55
天蓝
135
206
235
#87CEEB
石板灰
112
128
105
#708069
forum gold
255
227
132
#FFE384
暖灰色
128
128
105
#808069
金黄色
255
215
0
#FFD700
青色
0
255
255
#00FFFF
黄花色
218
165
105
#DAA569
绿土
56
94
15
#385E0F
白色
255
255
255
#FFFFFF
瓜色
227
168
105
#E3A869
靛青
8
46
84
#082E54
古董白
250
235
215
#FAEBD7
橙色
255
97
0
#FF6100
碧绿色
127
255
212
#7FFFD4
天蓝色
240
255
255
#F0FFFF
镉橙
255
97
3
#FF6103
青绿色
64
224
208
#40E0D0
白烟
245
245
245
#F5F5F5
胡萝卜色
237
145
33
#ED9121
绿色
0
255
0
#00FF00
白杏仁
255
235
205
#FFFFCD
桔黄
255
128
0
#FF8000
黄绿色
127
255
0
#7FFF00
cornsilk
255
248
220
#FFF8DC
淡黄色
245
222
179
#F5DEB3
钴绿色
61
145
64
#3D9140
蛋壳色
252
230
201
#FCE6C9
翠绿色
0
201
87
#00C957
花白
255
250
240
#FFFAF0
棕色
128
42
42
#802A2A
森林绿
34
139
34
#228B22
gainsboro
220
220
220
#DCDCDC
米色
163
148
128
#A39480
草地绿
124
252
0
#7CFC00
ghostWhite
248
248
255
#F8F8FF
锻浓黄土色
138
54
15
#8A360F
酸橙绿
50
205
50
#32CD32
蜜露橙
240
255
240
#F0FFF0
锻棕土色
135
51
36
#873324
薄荷色
189
252
201
#BDFCC9
象牙白
250
255
240
#FAFFF0
巧克力色
210
105
30
#D2691E
草绿色
107
142
35
#6B8E23
亚麻色
250
240
230
#FAF0E6
肉色
255
125
64
#FF7D40
暗绿色
48
128
20
#308014
navajoWhite
255
222
173
#FFDEAD
黄褐色
240
230
140
#F0E68C
海绿色
46
139
87
#2E8B57
old lace
253
245
230
#FDF5E6
玫瑰红
188
143
143
#BC8F8F
嫩绿色
0
255
127
#00FF7F
海贝壳色
255
245
238
#FFF5EE
肖贡土色
199
97
20
#C76114
雪白
255
250
250
#FFFAFA
标土棕
115
74
18
#734A12
紫色
160
32
240
#A020F0
乌贼墨棕
94
38
18
#5E2612
紫罗蓝色
138
43
226
#8A2BE2
红色
255
0
0
#FF0000
赫色
160
82
45
#A0522D
jasoa
160
102
211
#A066D3
砖红
156
102
31
#9C661F
马棕色
139
69
19
#8B4513
湖紫色
153
51
250
#9933FA
镉红
227
23
13
#E3170D
沙棕色
244
164
96
#F4A460
淡紫色
218
112
214
#DA70D6
珊瑚色
255
127
80
#FF7F50
棕褐色
210
180
140
#D2B48C
梅红色
221
160
221
#DDA0DD
耐火砖红
178
34
34
#B22222
印度红
176
23
31
#B0171F
蓝色
0
0
255
#0000FF
栗色
176
48
96
#B03060
钴色
61
89
171
#3D59AB
粉红
255
192
203
#FFC0CB
dodger blue
30
144
255
#1E90FF
草莓色
135
38
87
#872657
jackie blue
11
23
70
#0B1746
橙红色
250
128
114
#FA8072
锰蓝
3
168
158
#03A89E
蕃茄红
255
99
71
#FF6347
深蓝色
25
25
112
#191970
桔红
255
69
0
#FF4500
孔雀蓝
51
161
201
#33A1C9
深红色
255
0
255
#FF00FF
土耳其玉色
0
199
140
#00C78C
CSS整体颜色
什么叫做整体颜色呢？就是这个标签里，背景，内容全都是一种颜色，我们叫他：
background-color: #000;
使用这种属性的时候，尽量将内容在指定一个颜色，向下图一样：
.p2{
background-color: #000;
color: rgb(253, 252, 252);
}
效果如下：
总结
如果我的文章能帮到您，记得订阅我的专栏，和点赞哦！
来我的主页点点关注吧！小旭的前端笔记的博客_CSDN博客-html5 css3 js完整教程领域博主
CSS(3)教程 css的一般属性相关推荐
- css阴影教程,CSS高级技巧:阴影效果
上一篇CSS教程 文章:CSS高级技巧:网页布局 CSS阴影效果 (Drop Shadows) 一点阴影可以给平板的设计增加纵深的感觉, 很多时候我们都是直接用PhotoShop直接制作带阴影的图片以 ...
- html改变元素外边距,CSS 简明教程 - 外边距 ( margin ) 属性
CSS margin 属性用于在 HTML 元素周围创建 「 空白 」,这些空白在元素的边框之外创建 我们可以单独设置元素的上边距,下边距,左边距和右边距,也可以使用 margin 属性同时设置所有边 ...
- css样式教程---css控制背景图片-背景相关的css
最近做网站的时候,感觉css使用并不是那么轻松,于是从网上找了点教程看看,感觉还是挺重要的,一个好的CSS代码,只要你熟悉了,以后拿过来之间套上就行了, 真是方面,但是看的那CSS代码总叫人感觉头大, ...
- css样式表诞生,[css]简明教程 CSS样式表概述
CSS(Cascading Style sheets,层叠样式表)是一种制作网页的新技术,现在已经为大多数的浏览器所支持,成为网页设计必不可少的工具之一.使用CSS能够简化网页的格式代码,加快下载显示 ...
- 《Web前端开发精品课 HTML与CSS进阶教程》——1.4 id和class
本节书摘来自异步社区<Web前端开发精品课 HTML与CSS进阶教程>一书中的第1章,第1.4节,作者: 莫振杰 更多章节内容可以访问云栖社区"异步社区"公众号查看. ...
- HTML/CSS学习笔记03【CSS概述、CSS选择器、CSS属性、CSS案例-注册页面】
w3cschool菜鸟教程.CHM(腾讯微云):https://share.weiyun.com/c1FaX6ZD HTML/CSS学习笔记01[概念介绍.基本标签.表单标签][day01] HTML ...
- 菜鸟教程-css学习笔记
CSS实例中有很多CSS的例子,可以学习. <!DOCTYPE html> <html> <head> <meta charset="utf-8&q ...
- 好程序员HTML5前端教程-css的引入方式和选择器
好程序员HTML5前端教程-css的引入方式和选择器 01.引入css方式(重点掌握) 行内样式 内接样式 外接样式 3.1 链接式 3.1 导入式 css介绍 现在的互联网前端分三层: HTML:超 ...
- DIV+CSS基础教程
DIV+CSS基础教程 第一节 了解DIV+CSS 一.什么是DIV+CSS DIV元素是html(超文本语言)中的一个元素,是标签,用来为HTML文档内大块(block-level)的内容提供结构 ...
最新文章
- itmz文件如何打开_如何使用proteus8打开低版本proteus7的仿真文件？
- OpenStack 通用设计思路
- python如何读写文件-python文件的写入和读取
- css知多少（1）——我来问你来答（转）
- 【Linux环境下安装Maven与环境配置简易教程】
- 关于内存中栈和堆的区别[转]
- 如何免费注册使用虚拟主机和二级域名建站
- win11如何快速加密硬盘 Windows11快速加密硬盘的设置方法
- Http代理抓包 Fiddler与Charles
- github 检查代码质量_使用Gradle做Java代码质量检查
- java计算机毕业设计美发门店管理系统源码+系统+数据库+lw文档
- ant组件中select默认选中某一项
- Differential Geometry之第二章曲线的局部理论
- Unity小游戏教程系列 | 创建小型太空射击游戏（三）
- 使用Echarts.js自定义X轴Y轴刻度画网格
- 马斯克与Twitter风波大戏
- Hack the box: Bastion
- SpringBoot 整合 EasyExcel 数据写入Excel 合并单元格
- BlackJack--21点扑克游戏Java实现
- CTF Crypton系列————4、考眼力