CSS样式-文字篇

最新推荐文章于 2023-02-13 20:28:58 发布

努力学习javaee的小白选手

最新推荐文章于 2023-02-13 20:28:58 发布

阅读量409

点赞数

分类专栏： javaee 文章标签： css css3 html

本文链接：https://blog.csdn.net/m0_50555031/article/details/124890110

版权

本文详细介绍了CSS中设置文本颜色、文字大小、文本对齐、文本修饰、字体斜体、文字粗细等属性的使用方法，包括各种示例和代码演示，帮助读者掌握CSS文字样式设置。

摘要由CSDN通过智能技术生成

这篇的主要目的是记录CSS种文字的样式

1、文本颜色

颜色属性被用来设置文字的颜色

颜色是通过CSS最经常的指定：

十六进制值 - 如: ＃FF0000
一个RGB值 - 如: RGB(255,0,0)
颜色的名称 - 如: red

示例：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>文本颜色(runoob.com)</title> 
<style>
body {color:red;}
h1 {color:#00ff00;}
p.ex {color:rgb(0,0,255);}
</style>
</head>

<body>
<h1>这是标题</h1>
<p>这是一个普通的段落，请注意,本文是红色的</p>
<p class="ex">这是一个类为"ex"的段落。这个文本是蓝色的。</p>
</body>
</html>

输出结果：

2、文字大小

使用font-size 属性设置文本的大小。

使用正确的HTML标签，就<h1> - <h6>表示标题和<p>表示段落

字体大小的值可以是绝对或相对的大小。

绝对大小：

设置一个指定大小的文本
不允许用户在所有浏览器中改变文本大小
确定了输出的物理尺寸时绝对大小很有用

相对大小：

相对于周围的元素来设置大小
允许用户在浏览器中改变文字大小

控制字体大小的方法：

（1）设置字体大小像素

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>px设置字体大小</title>
<style>
h1 {font-size:40px;}
h2 {font-size:30px;}
p {font-size:14px;}
</style>
</head>
<body>

<h1>大小为40px</h1>
<h2>大小为30px</h2>
<p>大小为14px</p>

</body>
</html>

运行结果：