HTML Basic Tutorial ♡

TEXT插字 & IMAGE插图 ♡

————————————————————————————————————

❥ 字体 颜色

-----------------------------------

I am red

 <div style="color: red;">I am red</div>

I am blue

<div style="color: blue;">I am blue</div>

 -----------------------------------

* 显示颜色 ， 显示字

————————————————————————————————————

❥ 字体 大小

-----------------------------------

I am big

<div style="font-size: 36px;">I am big</div>

I am small

<div style="font-size: 15px;">I am small</div>

------------------------------------

* 显示大小 ， 显示字 

————————————————————————————————————

❥ 字体 间距

-----------------------------------

你好吗

<div style="letter-spacing: 10px;">你好吗</div>

你好吗

<div style="letter-spacing: -3px;">你好吗</div>

-----------------------------------
* 显示间距 ， 显示字 

————————————————————————————————————

❥ 字体 位置
-----------------------------------

左边

<div style="text-align: left;">左边</div>

中间

<div style="text-align: center;">中间</div>

右边

<div style="text-align: right;">右边</div>

-----------------------------------
 * 显示位置 ， 显示字 

————————————————————————————————————

空行 =  <br/>   

你好

你好

你好
<br/>
你好

————————————————————————————————————

：【字体 综合】：

颜色 + 大小 + 间距 + 位置 + 空行
-----------------------------------

我做了一件好事。

今天的心情很愉快。

<div style="color: red; font-size: 20px;letter-spacing: 10px; text-align: center;">
我做了一件好事。</div>
<br />
<div style="color: blue; font-size: 35px; letter-spacing: 5px; text-align: left;">
今天的心情很愉快。</div>

-----------------------------------

* 显示颜色 ， 显示大小 ， 显示间距 ，  显示位置 ， 显示字 

————————————————————————————————————

————————————————————————————————————


❥ 图片
 -----------------------------------

<img src="https://welcome.gif" />

* 图片链接 Image Link

 -----------------------------------

————————————————————————————————————

❥ 图片宽高
 -----------------------------------

<img src="https://welcome.gif " style="  width: 100px; height: 25px;" />

* 图片链接 Image Link *图片宽度 *图片高度

 -----------------------------------

————————————————————————————————————

▸ 基本上我 highlight 的都可以换成自己想要的格式
    跟着 format 走就对了！

  

后言：html 是不是没有想象中那么难呢？(๑ÒωÓ๑)