html的文本设置和css里的字符设置

最新推荐文章于 2023-02-16 16:12:28 发布

朝去夜来

最新推荐文章于 2023-02-16 16:12:28 发布

阅读量272

点赞数

分类专栏： html 文章标签： html5 css

本文链接：https://blog.csdn.net/wenqi1/article/details/119877749

版权

html 专栏收录该内容

18 篇文章 16 订阅

订阅专栏

文本设置：

已废除：

加粗

<ins> </ins> 下划线

<emphasized> </emphasized> 倾斜简写为

<del> </del> 删除线

目前使用的：

加粗 倾斜

下划线 <s> </s> 删除线

其他：

有部分符号在标签内无法使用或者使用会导致混乱，所以有了以下代替符号

< 表示 < > 表示 > © 表示 ◎   表示空格

CSS文本设置

text-align:center; 文本居中

text-indent:2em; 文本首行缩进2字符

color:red; 文本颜色为红色，颜色可以随需要更改

text-decoration:line-through 文本删除线

text-decoration:overline 文本上划线

text-decoration:underline 文本下划线

text-decoration:none 当我们使用超链接时，可以用这个去除超链接的下划线

font-size:30px; 文本大小

font-family:"微软雅黑"; 文本字体

font-style:normal 文本格式正常，italic表示文本倾斜

font-weight:bolder 文本更加粗，lighter表示文本细体，normal表示正常，bold表示加粗，或者也可以写100-900之间的整百数字

以上有四种字体的设置，我们可以写成一行。即：

font: normal bold 40px "微软雅黑"; 其中normal bold可以省略不写

CSS标签

id标签：

我们可以给标签上面加id，再在style里面对这个标签设置属性和值。id标签用#id{}表示。

<DOCTYPE! html>
<html>
    <head>
	<title>7跑马灯中的ccs练习</title>
	<meta charset="utf-8">
	<style>
	   #one{color:blue;font-size:15px;}
	   #two{color:red;font-size:15px;}
	</style>
    </head>
   <body>
       <marquee id="one" direction="left" scrollamount="15">
	   生命不止，学习不停
       </marquee>
	   <marquee id="two" direction="right" scrollamount="25" behavior="alternate" color="red">
	   You are right!
       </marquee>
    </body>
</html>

类标签：

加入标签内的class=name，那么style里的类标签用.name{}表示。如果想要两个特性，可以在style里设置多个内标签，下面的class可等于多个类标签，用空格隔开

<DOCTYPE! html>
<html>
    <head>
	<title>7跑马灯中的ccs练习</title>
	<meta charset="utf-8">
	<style>
	   .cc1{
	   text-align:center;
	   color:red;
	   font:30px "华文行楷";
	   }
	</style>
    </head>
   <body>
	   <h1 class="cc1">最经典的励志小故事</h1>
    </body>
</html>

还有一种就是直接用标签在style里设置，比如h1，p，div等。

<DOCTYPE! html>
<html>
    <head>
	<title>7跑马灯中的ccs练习</title>
	<meta charset="utf-8">
	<style>
	   .cc1{
	   text-align:center;
	   color:red;
	   font:30px "华文行楷";
	   }
	   p{
	   text-indent:2em;
	   font:15px "楷体";
	   }
	</style>
    </head>
   <body>
	   <h1 class="cc1">最经典的励志小故事</h1>
	       <p>有位秀才第三次进京赶考，住在一个经常住的店里。考试前两天他做了三个梦，第一个梦是梦到自己在墙上种白菜，第二个梦是下雨天，他戴了斗笠还打伞，第三个梦是梦到跟心爱的表妹脱光了衣服躺在一起，但是背靠着背。</p>
	       <p>这三个梦似乎有些深意，秀才第二天就赶紧去找算命的解梦。算命的一听，连拍大腿说：“你还是回家吧。你想想，高墙上种菜不是白费劲吗？戴斗笠打雨伞不是多此一举吗？跟表妹都脱光了躺在一张床上了，却背靠背，不是没戏吗？”</p>
	       <p>秀才一听，心灰意冷，回店收拾包袱准备回家。店老板非常奇怪，问：“不是明天才考试吗，今天你怎么就回乡了？”秀才如此这般说了一番。店老板乐了：“哟，我也会解梦的。我倒觉得，你这次一定要留下来。你想想，墙上种菜不是高种吗？戴斗笠打伞不是说明你这次有备无患吗？跟你表妹脱光了背靠背躺在床上，不是说明你翻身的时候就要到了吗？”</p>
	       <p>秀才一听，更有道理，于是精神振奋地参加考试，居然中了个探花。</p>
		   <br>
	   <h1 class="cc1">鹦鹉</h1>
	       <p>一个人去买鹦鹉，看到一只鹦鹉前标：此鹦鹉会两门语言，售价二百元。另一只鹦鹉前则标道：此鹦鹉会四门语言，售价四百元。该买哪只呢？两只都毛色光鲜，非常灵活可爱。这人转啊转，拿不定主意。</p>
	       <p>结果突然发现一只老掉了牙的鹦鹉，毛色暗淡散乱，标价八百元。这人赶紧将老板叫来：这只鹦鹉是不是会说八门语言？店主说：不。这人奇怪了：那为什么又老又丑，又没有能力，会值这个数呢？店主回答：因为另外两只鹦鹉叫这只鹦鹉老板。</p>
	       <p>这故事告诉我们，真正的领导人，不一定自己能力有多强，只要懂信任，懂放权，懂珍惜，就能团结比自己更强的力量，从而提升自己的身价。相反许多能力非常强的人却因为过于完美主义，事必躬亲，什么人都不如自己，最后只能做最好的攻关人员，销售代表，成不了优秀的领导人。</p>
    </body>
</html>

朝去夜来

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
html的文本设置和css里的字符设置

文本设置：已废除： 加粗<ins></ins> 下划线<emphasized> </emphasized> 倾斜简写为<del> </del> 删除线目前使用的： 加粗 倾斜 下划线...
复制链接

扫一扫