CSS文本样式学习

CSS文本样式学习

今天我学习了CSS里面关于文本样式还有颜色,我相信我们将会对CSS更加深入进去,因为这里面的世界是真的非常吸引人。

CSS的固定格式是:

<head>
	<style>
		标签{
			属性:;
		}
	</style>
</head>

1:规定文字样式的属性: font-style:值
2:规定文字粗细的属性: font-weight:值
3:规定文字大小的属性: font-size:值
4:规定文字字体的属性: font-family
它们的取值有很多,这里就不一一说了,大家可以看 w3c的网站上面都有介绍。
下面就让大家感受一下这些属性;

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="css/style.css">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=>, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>开心一刻</title>
    <style>
       p{
          font-style: italic;
          font-weight: bolder;
          font-size: 200px;
          font-family:"宋体";
       }
    </style>
</head>
<body>
    <p>马泽是大佬</p>
</body>
</html>

下面是效果:
在这里插入图片描述那么如果设置的字体不存在,会默认使用系统字体,如果我们不想用系统默认的字体在怎么办呢?
我们可以在后面用备选字体
如果想给中文和英文分别单独设置字体应该怎么弄呢?
我们要明白:但凡中文字体都包含有英文字体
但是但凡是英文字体里面都没有中文字体
那么:我们应该将英文字体写在前面

常见的中文字体:宋体,黑体,微软雅黑
常见的英文字体:Times,New Roman,Arial
并不是名称是英文就是英文字体,因为中文字体都有自己的英文名称。

文字属性的缩写

font:样式 粗细 大小 '字体';

注意:每个属性之间都有空格,有的属性值可以省略
size属性和family属性不可以删除,位置也不能乱放,size在family前面。

文本装饰的属性
格式:

text-decoration:

后面的值可以是:line-through(删除线)
null(空,常用于去除超链接的下划线)
文本水平对齐的属性
格式:

text-align:left()/right()/center(中间)

文本缩进的属性

text-indent:

单位一般为em,一个em就代表一个文字距离

在CSS中如何通过color属性修改文字颜色
格式:color:值
1:英文单词:局限性,不能指出所有的颜色。
2:rgb:r(red),g(green),b(blue)
格式:rgb(数字1,数字2,数字3)
数字范围(0~255)
在前端开发中,并不常用黑色
让红绿蓝三个值一样就是灰色,三个值越小就是偏黑色,越大偏白色
3:rgba a代表透明度,范围0~1,0是完全透明,1为不透明
4:十六进制表示颜色本质就是rgb

下面说一下标签选择器
有id选择器和类选择器
id选择器:根据指定的id找到对应的标签,然后设置属性
格式:

#id名称{
	属性:值;
}

每一个html标签都有一个属性叫id,每个标签都可以设置id
同一个界面:id的名称是不可以重复的,id名称前加#
id的名称只能有字母,数字,下划线组成,数字不能开头
id名称不能是html标签的名称
在企业中,若仅仅是为了设置样式,不会使用id,因为前端开发中id是结合js使用的。

类选择器
格式:

.类名{
	属性:值;
}

类名是专门给某个特定的标签设置样式的。
在html中每个标签可以绑定多个类名
格式:

<标签名称 class="类名1 类名2...">

class 选择器用于描述一组元素的样式,class 选择器有别于id选择器,class可以在多个元素中使用。

class 选择器在HTML中以class属性表示, 在 CSS 中,类选择器以一个点"."号显示:
类名的第一个字符不能使用数字
今天就先说到这里了。

发布了23 篇原创文章 · 获赞 12 · 访问量 1571

猜你喜欢

转载自blog.csdn.net/weixin_45607985/article/details/103624499