HTML代码

插入注释：

 <!-------------分割线---------------->
瓜皮之牙 
<div class="card text-auto">
<div class="card-body">
瓜皮之牙
</div>
</div>

KBD代码备忘，默认效果： KBD <kbd>KBD</kbd>

加个颜色效果：KBD <kbd class=bg-info>KBD</kbd>

KBD <kbd class=bg-primary>KBD</kbd>

KBD <kbd class=bg-secondary>KBD</kbd>

KBD <kbd class=bg-success>KBD</kbd>

KBD <kbd class=bg-danger>KBD</kbd>

KBD <kbd class=bg-warning>KBD</kbd>

KBD <kbd class=bg-dark>KBD</kbd>

文字超链接：示例文字

<a href="链接" target="_blank">示例文字</a>

文字超链接带颜色： 示例文字

<a href="链接" target="_blank"><font color=#3DA3B7>示例文字</font></a>

文本字号带颜色：示例文字

<font color=red size="5">示例文字</font>

文字H1标签字体大小：

瓜皮之牙


<h1 style="font-size:60px">瓜皮之牙</h1>

文字字体显示：瓜皮之牙

<font face="微软雅黑">瓜皮之牙</font>

显示 Tooltip 效果1：瓜皮之牙
<font title= "提示内容" >瓜皮之牙</font>

显示 Tooltip 效果2：瓜皮之牙
<font data-toggle="tooltip" title="感谢CL老大">瓜皮之牙</font>

图片代码：

<img src="图片网址" width = 500 />

图片代码2（点击图片不会放大）：

<img src='图片网址' width=500 class='no-lity'>

图片后面加style，可控制留白区域： style='margin-right:300px'

图片自适应放大：

<img src='图片链接' style="height: calc(100vh - 300px);" class='no-lity'>

图片居中并带超链接：

<div align="center"><a href="网址链接"><img src="图片网址" width = 500 /></a></div>

图片移动 

<marquee  scrollAmount=10  direction=left><img src="图片网址" width = 500 /></marquee>

漂亮格子1效果：

名称：我的电脑
作者：CL
安装：文本

漂亮格子1代码：

<div style=width:500px class=' font16 border rounded p-2 mb-4 text-info bg-light'>
	<strong class='d-inline-block' style='width:35px'>名称</strong>：我的电脑<br/>
	<strong class='d-inline-block' style='width:35px'>作者</strong>：CL<br/>
	<strong class='d-inline-block' style='width:35px'>安装</strong>：<a href="链接" target="_blank"><font color=#3DA3B7>文本</font></a><br/>
</div>

漂亮格子2效果：

粗体文字：文本内容文本内容
粗体文字：文本内容文本内容

漂亮格子2代码：

<div style='width:700px;background-color:#FFFBF6' class= 'font16 border rounded p-2 mb-4'>
	<strong class='d-inline-block' style='width:65px'>粗体文字</strong>：文本内容<br/>
	<strong class='d-inline-block' style='width:65px'>粗体文字</strong>：文本内容<br/>
</div>

漂亮格子3效果：

文本内容文本内容
文本内容文本内容
文本内容文本内容

漂亮格子3代码：

<div style=width:500px class=' font16 border rounded p-2 mb-4 text-info bg-light'>
	<strong class='d-inline-block' style='width:1px'> </strong>111<br/>
	<strong class='d-inline-block' style='width:1px'> </strong>222<br/>
	<strong class='d-inline-block' style='width:1px'> </strong>333<br/>
</div>

漂亮格子4效果：

技巧：点击这里

小技巧：
如果不想显示边框线条，将 border 改成 border-0 即可
漂亮格子4代码：

<div class='d-flex align-items-center font16 border rounded p-2' style='width:500px;color:black; background-color:White;' >
	<img src='https://files.getquicker.net/_sitefiles/kb/sharedaction/249c8830-af6b-41b3-4de7-08d94db1a131/2021/11/12/172203_202824_gpzy_142.gif'>
<div class='ml-2'>
	<strong class='d-inline-block' style='width:35px'>技巧</strong>：<a href="链接" target="_blank"><font color=#3DA3B7>点击这里</font></a><br/>
</div>
</div>

漂亮格子5效果：

加粗：巴拉巴拉巴拉巴拉巴拉巴拉

漂亮格子5代码：

<div class='d-flex align-items-center font16 border rounded p-2' style='width:885px;color:black; background-color:#FFFFF9EC;' >
	<img src='https://files.getquicker.net/_sitefiles/_guides/52593d69-c99a-4367-8b98-08d9a65be47e/2021/11/19/111807_202824_ico_013.gif'>
<div class='ml-1'>
<font color=#895B3B><b>加粗：</b>巴拉巴拉巴拉巴拉巴拉巴拉</font>
</div>
</div>

漂亮格子6效果

漂亮格子6代码

<div style='width:600px' class="alert alert-warning alert-dismissible fade show" role="alert">
  <strong>紧急通知！</strong> 您必须呼吸才能生存！
  <button type="button" class="close" data-dismiss="alert" aria-label="Close">
    <span aria-hidden="true">&times;</span>
  </button>
</div>

左右分栏代码：

<html>
    <table style="margin-left: auto; margin-right: auto;">
        <tr>
            <td>
                <!--左侧内容-->
                11111111111111111111
                <!--左侧内容-->
            </td>
            <td>
                <!--右侧内容-->
                22222222222222222
                <!--右侧内容-->
            </td>
        </tr>
    </table>
</html>

插入音频效果

普通代码：

<audio controls>
<source src="音频链接" type="audio/mpeg">
</audio>

自动播放代码：

<audio controls src="0000.mp3" autoplay="autoplay" loop="loop" preload="auto" type="audio/mp3"></audio>

自动播放并循环模式（不想自动播放，就把 autoplay="autoplay"删掉即可）

<audio controls src="0000.mp3" autoplay="autoplay" loop="true" preload="auto" type="audio/mp3"></audio>

插入视频

<video id="video" controls="" width="50%" frameborder="0" style="margin:0px"><source id="mp4" src="视频连接" type="video/mp4"></video>