引言
在网页设计中，文字排版不可或缺。有时需要表达一些特殊的含义，比如正在删除或者修改的文字，这时候就需要为文字添加删除线。
方法一：使用text-decoration属性
最常见的方法就是使用CSS的text-decoration属性。该属性有三个值可选：none（没有线），underline（下划线），line-through（删除线）。我们就可以将text-decoration设置为line-through来添加删除线。
.text--deleted {
text-decoration: line-through;
}
可以在HTML中添加一个class名为text--deleted的元素，然后在CSS中将该类的text-decoration属性设置为line-through。
text-decoration属性的其他可能值：
none：没有装饰
underline：下划线
overline：上划线
line-through：删除线
blink：闪烁
方法二：使用伪元素
除了text-decoration属性，我们还可以使用伪元素来为文字添加删除线。具体步骤如下：
将需要添加删除线的元素的position属性设置为relative
为需要添加删除线的元素添加一个伪元素
设置伪元素的内容为空，将伪元素的宽度设为100%，高度设为1px
将伪元素的背景颜色设置为想要的删除线颜色，这里我们将其设置为红色
将伪元素的位置设置在文字下方，即将top属性设置为100%
代码如下：
.text--deleted::after {
content: '';
display: block;
width: 100%;
height: 1px;
background-color: red;
position: absolute;
top: 100%;
}
可以在HTML中添加一个class名为text--deleted的元素，然后在CSS中为其添加一个伪元素，并将该伪元素设置为红色的100%宽度、1px高度的块级元素。
方法三：使用JavaScript
如果需要动态地添加删除线，我们也可以使用JavaScript来实现。具体步骤如下：
获取需要添加删除线的元素
创建一个新的元素，设置其宽度为原始元素的宽度，高度为1px，颜色为想要的删除线颜色
将新元素插入到原始元素之后
代码如下：
const textDeleted = document.querySelector('.text-deleted');
const line = document.createElement('div');
line.style.width = textDeleted.offsetWidth + 'px';
line.style.height = '1px';
line.style.backgroundColor = 'red';
textDeleted.insertAdjacentElement('afterend', line);
可以在HTML中添加一个class名为text-deleted的元素，然后在JavaScript中为其创建一个新的元素，并将其插入到文本之后。
结论
以上三种方法均可用于添加删除线，但在大多数情况下，使用text-decoration属性即可满足需求。如果需要动态地添加删除线，则可以使用JavaScript来实现。如果需要更多的控制，比如删除线的颜色、样式等，那么使用伪元素则是一种比较好的选择。总之，在Web开发中，为文字添加删除线是一种非常基础和常用的技术。