写CSDN博客时，调节字体大小、颜色及其他样式的常用操作方法

字体颜色样式系列

为了突出重点内容，想设置不同颜色，为了方便使用，跟大家一起分享

Size：规定文本的尺寸大小。可能的值：从1到7的数字。浏览器默认值是 3。

颜色挑选网址: https://blog.csdn.net/wo919191/article/details/84249531

文本内容使用font标签包裹，可通过face设置字体，size设置字号，color设置颜色

<font color="#FF8C0" size=3 face="华文楷体">文本内容使用font标签包裹，可通过face设置字体，size设置字号，color设置颜色font>

随

<font color =red size=4>**随**font>

随

<font  size=4>**随**font>

我是黑体字

<font face="黑体">我是黑体字font>

我是微软雅黑

<font face="微软雅黑">我是微软雅黑font>

我是华文彩云

<font face="STCAIYUN">我是华文彩云font>

我是黑体字

<font face="黑体">我是黑体字font>

我是微软雅黑

<font face="微软雅黑">我是微软雅黑font>

我是华文彩云

<font face="STCAIYUN">我是华文彩云font>

strong标签加粗

strong标签<strong>加粗strong>

B标签加粗

B标签<b>加粗b>

h加粗标签

<h1><font face="Arial black">h加粗标签 font>h1>

color=#0099ff size=6 face=“黑体”

<font color=#0099ff size=6 face="黑体">color=#0099ff size=6 face="黑体"font>

color=#00ffff

<font color=#00ffff size=6>color=#00fffffont>

color=gray

<font color=gray size=6>color=grayfont>

This is a header

<h1 style="color:blue;text-align:center">This is a headerh1>

黑体abc

<font color=#0099ff size=6 face="黑体"> 黑体abcfont>

样式abc

<font color=#00ffff size=6>样式abcfont>

color=样式gray

<font color=gray size=6>color=样式grayfont>

color=样式gray

<font color=#B0C4DE size=6>color=样式grayfont>

color=样式gray

<font color=##FFFF00 size=6>color=样式grayfont>

color=样式gray

<font color=##B8860B size=6>color=样式grayfont>

color=样式gray

<font color=####3CB371 size=6>color=样式grayfont>

color=样式gray

<font color=##FF0000 size=6>color=样式grayfont>

color=样式gray

<font color=##DodgerBlue size=6>color=样式grayfont>

color=样式gray

<font color=##LawnGreen size=6>color=样式grayfont>

背景色

这里是要写入的内容

这里是要写入的内容

这里是要写入的内容

#D1EEEE

 <table><tr><td bgcolor=PowderBlue>这里是要写入的内容 
 
 <table><tr><td bgcolor=#00FA9A>这里是要写入的内容

 <table><tr><td bgcolor=#C0FF3E>这里是要写入的内容td>tr>table>

 <table><tr><td bgcolor=##D1EEEE>#D1EEEEtd>tr>table>

缩进 和 空格

  ：输入一个空格
  缩进文本

   ：输入一个空格
   缩进文本

居中

2.1、方式一：

内容
2.2、方式二：

内容

2.1、方式一： <center>内容center>
2.2、方式二： <div align=center> 内容 div>

图片

这里通过width、height控制图片的大小

<img src="http://ww2.sinaimg.cn/bmiddle/11.gif" width="400" height="400" alt=" 图片不见了。。。 "/>

![测试图片](https://img-blog.csdnimg.cn/20210419174516559.jpg)

带尺寸的图片

![测试图片](https://img-blog.csdnimg.cn/20210419174516559.jpg =100x100)

居中的图片

![测试图片](https://img-blog.csdnimg.cn/20210419174516559.jpg#pic_center)

居中且带尺寸的图片

![测试图片](https://img-blog.csdnimg.cn/20210419174516559.jpg#pic_center =100x100)

空白行

虽然说markdown能回车换行，但是没办法做到n个空白行，而且。换行的办法就比较多了，因为别忘了，markdown是支持HTML标签的：

1. 使用块标签，撑开一行，如p、div

或

<p>p>
或
<div>div>

2. 简单点的方法，就直接使用 br 标签
   内容1
   
   内容2

内容1<br/><br/>内容2

文章内容的定位

有时候我们在写文章时，想提供读者一个参考。这里使用的便是a标签的锚点定位，既可以跳到本页的某一处，也可以定位到另一个网页的某一处：

1. 在目标处设置一个id；
2. 使用a标签，属性 href =”URL#id”
3. 使用markdown的语法：文字

自从我学习编程开始

本文的首行
本文的首行

<span id="aaa">自从我学习编程开始span >

<a href="#aaa">本文的首行a>
[本文的首行](#aaa)

文本样式

一次Enter为换行，两次Enter为段落
敲掉文本 强调文本
加粗文本 加粗文本
标记文本
删除文本
文本
文本^上标
文本_下标
小号字体
大号字体
H₂O is是液体
2¹⁰ 运算结果是 1024

引用文本

*敲掉文本* _强调文本_
**加粗文本**  __加粗文本__
==标记文本==
~~删除文本~~
<u>文本u>
文本^上标^
文本~下标~
<small>小号字体small>
<big>大号字体big>
H~2~O is是液体
2^10^ 运算结果是 1024
> 引用文本

分割线

使用星号"*"、减号"-“或下划线”_"，连续三个或三个以上

---

---

---

***
_____
-----

表格

markdown表格             冒号":"表示对齐方式

项目	Value
电脑	$1600
手机	$12
导管	$1

Column 1	Column 2
centered 文本居中	right-aligned 文本居右

项目     | Value
-------- | -----
电脑  | $1600
手机  | $12
导管  | $1

| Column 1 | Column 2      |
|:--------| -------------:|
| centered 文本居中 | right-aligned 文本居右 |

html表格

单元格-合并-指定宽度	单元格-背景色	单元格-华文楷体
	单元格-字体颜色-5号字	单元格-文本左对齐
	单元格 - 华文彩云 - 5号字	单元格第一行 单元格第二行 单元格第三行

<table id="htmltable">
<tr>
<td width=20% rowspan=3>单元格-合并-指定宽度td><td bgcolor="#FF9797">单元格-背景色td><td><font face="华文楷体">单元格-华文楷体font>td>
tr>
<tr>
<td><font color=blue size=5>单元格-字体颜色-5号字font>td><td align="left"><font>单元格-文本左对齐font>td>tr>
<tr>
<td><font face="华文彩云" size=5>单元格 - 华文彩云 - 5号字font>td><td>单元格第一行<br>单元格第二行<br>单元格第三行td>
tr>
table>

测试锚点——跳转至10.2html表格

[测试锚点——跳转至10.2html表格](#htmltable)

注脚

注脚1:¹
注脚2:²

**注脚1**:^[这是注脚1]
**注脚2**:[^2]
[^2]:这是注脚2

注释

> [^_^]: <>  (注释内容1——符号左右加空格)
> [//]: # (注释内容2——符号左右加空格)
> 

自定义列表

markdown

this is a markdown

authors

author is 人间小美味695

markdown
: this is a markdown

authors
: author is 人间小美味695

特殊符号使用实体编号代替：

X Y Z [ \ ] ^ _ ` a b c

X Y Z [ \ ] ^ _ ` a b c

ASCII字符集——参考文档：

添加表情符号：

更多表情网址
效果图：
代码 说明 显示效果

❤️

❤️ ❤️




✨ ✨ ⭐️ ⭐️


❗️ ❗️
❓ ❓ ❕ ❕
❔ ❔







✊ ✊
✌️ ✌️
✋ ✋ ✋ ✋
☝️ ☝️




































☀️ ☀️ ☔️ ☔️
☁️ ☁️ ❄️ ❄️
⛄️ ⛄️ ⚡️ ⚡️
























⛪️ ⛪️



⛺️ ⛺️





⛲️ ⛲️

1️⃣ 1️⃣ 2️⃣ 2️⃣
3️⃣ 3️⃣ 4️⃣ 4️⃣
5️⃣ 5️⃣ 6️⃣ 6️⃣
7️⃣ 7️⃣ 8️⃣ 8️⃣
9️⃣ 9️⃣
0️⃣ 0️⃣
#️⃣ #️⃣
◀️ ◀️ ⬇️ ⬇️
▶️ ▶️ ⬅️ ⬅️

↙️ ↙️
↘️ ↘️ ➡️ ➡️
⬆️ ⬆️ ↖️ ↖️
↗️ ↗️ ⏬ ⏬
⏫ ⏫
⤵️ ⤵️ ⤴️ ⤴️
↩️ ↩️ ↪️ ↪️
↔️ ↔️ ↕️ ↕️

⏪ ⏪
⏩ ⏩ ℹ️ ℹ️

代码	说明	显示效果
>:(	生气
:")	脸红
	心碎
:/	困惑
:,(	哭
:(	皱眉
<3	心	❤️
]:(	小鬼
o:)	无辜
:,)	哭笑
x-)	大笑
:\|	面无表情
:o	安静
:@	愤怒
:)	微笑
]:)	微笑
;(	呜咽
:P	吐舌鬼脸
8-)	太阳镜
,:(	流汗
,:)	流汗
:s	不爽
;)	飞媚眼

代码	显示效果	代码	显示效果
:smile:		:laughing:
:blush:		:smiley:
:thought_balloon:		:smirk:
:heart_eyes:		:kissing_heart:
:kissing_closed_eyes:		:flushed:
:relieved:		:satisfied:
:grin:		:wink:
:stuck_out_tongue_winking_eye:		:stuck_out_tongue_closed_eyes:
:grinning:		:kissing:
:kissing_smiling_eyes:		:stuck_out_tongue:
:sleeping:		:worried:
:frowning:		:anguished:
:open_mouth:		:grimacing:
:confused:		:hushed:
:expressionless:		:unamused:
:sweat_smile:		:sweat:
:disappointed_relieved:		:weary:
:pensive:		:disappointed:
:confounded:		:fearful:
:cold_sweat:		:persevere:
:cry:		:sob:
:joy:		:astonished:
:scream:		:tired_face:
:angry:		:rage:
:triumph:		:sleepy:
:yum:		:mask:
:sunglasses:		:dizzy_face:
:imp:		:smiling_imp:
:neutral_face:		:no_mouth:
:innocent:		:alien:
:yellow_heart:		:blue_heart:
:purple_heart:		:heart:	❤️
:green_heart:		:broken_heart:
:heartbeat:		:heartpulse:
:two_hearts:		:revolving_hearts:
:cupid:		:sparkling_heart:
:sparkles:	✨	:star:	⭐️
:star2:		:dizzy:
:boom:		:collision:
:anger:		:exclamation:	❗️
:question:	❓	:grey_exclamation:	❕
:grey_question:	❔	:zzz:
:dash:		:sweat_drops:
:notes:		:musical_note:
:fire:		:hankey:
:poop:		:shit:
:+1:		:thumbsup:
:-1:		:thumbsdown:
:ok_hand:		:punch:
:facepunch:		:fist:	✊
:v:	✌️	:wave:
:hand:	✋	:raised_hand:	✋
:open_hands:		:point_up:	☝️
:point_down:		:point_left:
:point_right:		:raised_hands:
:pray:		:point_up_2:
:clap:		:muscle:
:metal:		:fu:
:runner:		:running:
:couple:		:family:
:two_men_holding_hands:		:two_women_holding_hands:
:dancer:		:dancers:
:ok_woman:		:no_good:
:information_desk_person:		:raising_hand:
:bride_with_veil:		:person_with_pouting_face:
:person_frowning:		:bow:
:couple_with_heart:		:massage:
:haircut:		:nail_care:
:boy:		:girl:
:woman:		:man:
:baby:		:older_woman:
:older_man:		:person_with_blond_hair:
:man_with_gua_pi_mao:		:man_with_turban:
:construction_worker:		:cop:
:angel:		:princess:
:smiley_cat:		:smile_cat:
:heart_eyes_cat:		:kissing_cat:
:smirk_cat:		:scream_cat:
:crying_cat_face:		:joy_cat:
:pouting_cat:		:japanese_ogre:
:japanese_goblin:		:see_no_evil:
:hear_no_evil:		:speak_no_evil:
:guardsman:		:skull:
:feet:		:lips:
:kiss:		:droplet:
:ear:		:eyes:
:nose:		:tongue:
:love_letter:		:bust_in_silhouette:
:busts_in_silhouette:		:speech_balloon:
:sunny:	☀️	:umbrella:	☔️
:cloud:	☁️	:snowflake:	❄️
:snowman:	⛄️	:zap:	⚡️
:cyclone:		:foggy:
:ocean:		:cat:
:dog:		:mouse:
:hamster:		:rabbit:
:wolf:		:frog:
:tiger:		:koala:
:bear:		:pig:
:bamboo:		:gift_heart:
:dolls:		:school_satchel:
:mortar_board:		:flags:
:fireworks:		:sparkler:
:wind_chime:		:rice_scene:
:jack_o_lantern:		:ghost:
:santa:		:christmas_tree:
:gift:		:bell:
:no_bell:		:tanabata_tree:
:tada:		:confetti_ball:
:balloon:		:crystal_ball:
:cd:		:dvd:
:house:		:house_with_garden:
:school:		:office:
:post_office:		:hospital:
:bank:		:convenience_store:
:love_hotel:		:hotel:
:wedding:		:church:	⛪️
:department_store:		:european_post_office:
:city_sunrise:		:city_sunset:
:japanese_castle:		:european_castle:
:tent:	⛺️	:factory:
:tokyo_tower:		:japan:
:mount_fuji:		:sunrise_over_mountains:
:sunrise:		:stars:
:statue_of_liberty:		:bridge_at_night:
:carousel_horse:		:rainbow:
:ferris_wheel:		:fountain:	⛲️
:roller_coaster:		:ship:
:one:	1️⃣	:two:	2️⃣
:three:	3️⃣	:four:	4️⃣
:five:	5️⃣	:six:	6️⃣
:seven:	7️⃣	:eight:	8️⃣
:nine:	9️⃣	:keycap_ten:
:1234:		:zero:	0️⃣
:hash:	#️⃣	:symbols:
:arrow_backward:	◀️	:arrow_down:	⬇️
:arrow_forward:	▶️	:arrow_left:	⬅️
:capital_abcd:		:abcd:
:abc:		:arrow_lower_left:	↙️
:arrow_lower_right:	↘️	:arrow_right:	➡️
:arrow_up:	⬆️	:arrow_upper_left:	↖️
:arrow_upper_right:	↗️	:arrow_double_down:	⏬
:arrow_double_up:	⏫	:arrow_down_small:
:arrow_heading_down:	⤵️	:arrow_heading_up:	⤴️
:leftwards_arrow_with_hook:	↩️	:arrow_right_hook:	↪️
:left_right_arrow:	↔️	:arrow_up_down:	↕️
:arrow_up_small:		:arrows_clockwise:
:arrows_counterclockwise:		:rewind:	⏪
:fast_forward:	⏩	:information_source:	ℹ️
:ok:		:twisted_rightwards_arrows:
:repeat:		:repeat_one:
:new:		:top:
:up:		:cool:
:free:		:ng:
:cinema:		:koko:

![图片](https://img-blog.csdnimg.cn/20200417160350476.gif)

---

1. 这是注脚1 ↩︎

2. 这是注脚2 ↩︎