常见的CSS样式

// 文字下划波浪线
  .text{
      text-decoration-line:underline;
      text-decoration-style: wavy;
    }

// 下边框波浪线
    div {
        background: radial-gradient(circle at 10px -7px, transparent 8px, currentColor 8px, currentColor 9px, transparent 9px) repeat-x,
        radial-gradient(circle at 10px 27px, transparent 8px, currentColor 8px, currentColor 9px, transparent 9px) repeat-x;
        background-size: 20px 20px;background-position: -10px calc(100% + 16px), 0 calc(100% - 4px);
        }

// 表单，lable标签，左右对齐
// css
       ul li{
            width: 80px;
            list-style: none;
            text-align: justify;
            text-align-last: justify;
        }
        p{
            width: 580px;
            text-align: justify;
            text-align-last: right;
        }

// html
    <ul>
        <li>姓名</li>
        <li>联系方式</li>
        <li>email(邮件)</li>
    </ul>
    <p>
        语法：text-align-last: auto|left|right|center|justify|start|end|initial|inherit;

        text-align-last 属性规定如何对齐文本的最后一行。
        注意：text-align-last 属性只有在 text-align 属性设置为 "justify" 时才起作用。
    </p>

text_align.png

注意：li 这个标签要设置 list-style: none; 去掉默认属性，否则在IE浏览器中当只有一行的时候，会出现并没有左右两端对齐，而是类似右对齐的bug。。。

参考文章：使用text-align:justify，让内容两端对齐，兼容IE及主流浏览器的方法