html如何使文本加点状线

1、首先新建或打开word文档。

2、其次选中需要设置下划线的空白处，点击鼠标右键，选择“字体”。

3、最后在文字下划线的设置中选择点状线即可解决html使文本加点状线的问题。

HTML标签中<HR>标签可以帮你在每行文字下面画条横线，具体实现方法：

<HR>标签的属性介绍：

none：无样式；dotted：点线；dashed：虚线；solid：实线；

double：双线；groove：槽线；ridge：脊线；inset：内凹；outset：外凸。

1、dotted：点线

<HR style="border:3 dotted #ff0033" width="100%" SIZE=3>

2、dashed：虚线

<HR style="border:3 dashed #ff0033" width="100%" SIZE=3>

3、solid：实线

<HR style="border:3 solid #ff0033" width="100%" SIZE=3>

4、double：双线

<HR style="border:3 double #ff0033" width="100%" SIZE=3>

5、groove：槽线

<HR style="border:6 groove #ff0033" width="100%" SIZE=6>

6、ridge：脊线

<HR style="border:6 ridge #ff0033" width="100%" SIZE=6>

7、inset：内凹

<HR style="border:6 inset #ff0033" width="100%" SIZE=6>

8、outset：外凸

<HR style="border:6 outset #ff0033" width="100%" SIZE=6>

温馨提示：

通过实践5—8并不理想，最好不要用。

两头渐变透明 纺锤形 右边渐变透明 左边渐变透明 立体效果 钢针效果

备注：这几种效果不适合表内嵌套存在，例句写在表外

以下代码利用box模型实现，只适用于Chrome和Safari浏览器：

<style>

    body {background-color:#000}

    ul {margin:0 padding:0 width:480px}

    li {display:-webkit-box -webkit-box-orient:horizontal height:24px margin:0 padding:0}

    li .box1 {height:24px line-height:24px color:#aaa margin-right:4px}

    li .box2 {-webkit-box-flex:1 height:16px margin-top:4px border-bottom:1px dotted #aaa}

    li .box3 {width:80px height:24px line-height:24px color:#a00 margin-left:4px}

</style>

<ul>

    <li>

        <div class=box1>&gt 部分试日</div>

        <div class=box2></div>

        <div class=box3>￥25.60</div>

    </li>

    <li>

        <div class=box1>&gt 特突然特</div>

        <div class=box2></div>

        <div class=box3>￥17.10</div>

    </li>

    <li>

        <div class=box1>&gt 点范围为热舞</div>

        <div class=box2></div>

        <div class=box3>￥91.00</div>

    </li>

</ul>

---