html - 我怎样才能在边框周围而不是元素周围有一个带阴影的边框？

Question

div我的小提琴会告诉你一切，但我需要一个带阴影的边框，现在如果我使用没有高度的空，这很好，我使用box-shadow属性，但当我div包含一些文本时没有得到这种效果......所以有什么解决方法为了这？我需要添加一个空元素来实现这种效果吗？

小提琴

CSS

.what_i_want {
    width: 100px;
    border-bottom: 2px solid #000000;
    margin: 50px;
    box-shadow: 0 0 5px #000;
}

.how_i_achieve_the_above_here {
    margin: 50px;
    border-bottom: 2px solid #000000;
}

HTML

<div class="what_i_want"></div>
<div class="how_i_achieve_the_above_here">Vaibhav</div>

Answer 1

jsfiddle

.how_i_achieve_the_above_here:after{
    position:absolute;
    content: '';
    width:100%;
    height:2px;
    box-shadow: 0 0 5px #000;
    left:0;
    bottom:-2px;
}    

Answer 2

box-shadow 不会在单词周围的“盒子”周围放置一个阴影吗？你不能只使用 100% 宽度的<h1>or<p>标记和带阴影的底部边框吗？未经测试，但似乎它应该工作。