html - 在某些内容的顶部和底部创建边框

Question

我正在尝试使用 CSS

    ---------------------
      SOME CONTENT HERE
    ---------------------

所以我基本上想要的是边框位于内部任何内容的顶部和底部（最好是 <p></p>） 这是我正在使用的一些代码，但它绝对不起作用它的意思是。

padding: 5px 1px;
box-shadow: 0 2px 5px black,
    0 -2px 5px #800000,
    0 0 5px black,
    0 0 5px #800000;

我该怎么做？

Answer 1

你想要边框还是阴影？你的代码告诉我你想要一个阴影，你的问题问一个边界。如果边框：

border-top: 1px solid black;
border-bottom: 1px solid black; 

如果阴影：

-webkit-box-shadow: 0px 6px 2px -1px #000,  0px -6px 2px -1px #000;
box-shadow: 0px 6px 2px -1px #000,  0px -6px 2px -1px #000;

示例：http: //jsfiddle.net/pGGXH/69/

Answer 2

您可以将以下代码用于顶部和底部边框

  border-top:1px dashed black;
  border-bottom:1px dashed black;

对于阴影效果，请通过此链接

sebass代码的一些修改

-webkit-box-shadow: 0px 1px 15px -1px #000,  0 -1px 15px -1px #000;
 box-shadow: 0px 1px 15px -1px #000,  0 -1px 15px -1px #000;

Answer 3

如果你想要一个边框，那么你可以这样做。

.div {
    border-top: 1px solid black; 
    border-bottom: 1px solid black;
    width: 50px;
    height: 50px;
}​

演示 - http://jsfiddle.net/9VCZU/