【前端】HTML和Markdown设置下换线

HTML以及编辑的Markdown如何设置下划线样式

本篇文章就给大家介绍css添加文字下划线样式的方法。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。

1、常规办法

<u>这里是常规办法添加下划线</u>

效果如下：

这里是常规办法添加下划线

---

2、text-decoration属性

<span style="text-decoration:underline">这是text-decoration属性设置的下划线。</span>

效果如下：

---

3、border-bottom属性

border-bottom属性使用起来比较灵活，并且可以设置线的格式，因此能满足你一篇文章的不同需求~~~

<p>这是第实线样式，<span style="border-bottom: 1px solid #000000;">Mming‘s Blog</span>! </p> 
<p>这是变粗的实线，<span style="border-bottom: 5px solid #0081EF;">Mming‘s Blog</span>! </p>
<p>这是虚线样式，<span style="border-bottom: 2px dashed #000000;">Mming‘s Blog</span>! </p>
<p>这是虚点下划线，<span style="border-bottom: 2px dotted #000000;">Mming‘s Blog</span>! </p>
<p>这是双下划綫，<span style="border-bottom: 5px double #000000;">Mming‘s Blog</span>! </p>

效果如下：

border-bottom属性可以通过控制线的粗细、颜色、样式来实现不同的文字下划线样式。

以上就是在HTML或者支持HTML的markdown文件中给文字添加下划线的方式，简单处理可以直接使用u标签，对下划线格式有要求时可以使用border-bottom属性对下划线进行设置。