如何删除空div

我想完全穿透光剑.

该text-decoration: line-through;属性仅适用于div内的文本,而不仅适用于div.

我看到Linethrough/strikethrough整个HTML表格行并尝试了.但它不能正常工作.所以我的问题是"我如何使用CSS删除空div".

您可以使用链接问题border-bottom中的属性执行类似操作.像这样:

div.strike {
  position: relative;
}
div.strike:before {
  content: " ";
  position: absolute;
  top: 50%;
  left: 0;
  border-bottom: 1px solid #111;
  width: 100%;
}

您只需更改颜色值的值即可更改border-bottom颜色.这是Jsfiddle.

我想你只想在这张图片中使用像这样的光剑吗？

我想在不使用删除的情况下采用一种方法.然后我意识到你可以用linear-gradient而不是.当然,您可以改善它的对齐/颜色.

我在下面的代码示例中添加了以下两行

/* added these 2 lines */
background: #FF0000;
background: linear-gradient(to bottom,  #ff0000 0%,#ffdddd 50%,#ff0000 99%);

这样您就可以在不使用穿透的情况下获得红色→白色→红色效果.结果,你会得到一把漂亮的红色军刀.

div.handle
{
    height:10px;
    width:100px;
    background-color:black;
    display: inline-block;
    border-radius: 0 4px 4px 0;
    border-spacing: 0;
    border-collapse: collapse;
}
div.sword
{
    height:6px;
    width:400px;

    /* added these 2 lines */
    background: #FF0000;
    background: linear-gradient(to bottom,  #ff0000 0%,#ffdddd 50%,#ff0000 99%);

    display: inline-block;
    border-radius: 3px;
    border-spacing: 0;
    border-collapse: collapse;
    margin-top: 1px;
    margin-bottom: 1px;
    text-decoration: line-through;
}
div.red
{
    box-shadow: 0 0 10px red;
    border:1px solid red;
}