html - 我如何实现缩进边框

Question

只是想知道如何更改我的导航菜单以产生缩进效果。就像 1px 的一种浅色和 1px 的深色。

也有人知道为什么我不能将内容自动居中为白色，我尝试了 margin:0 auto; 但不得不以一种奇怪的解决方法进行编码。

soz，网站是http://digitalgenesis.com.au/sites/1 Cheers Daz

Answer 1

您可能可以使用border-style: inset;您想要的边框效果，不需要嵌套块技巧或类似的东西。

您的#infowrap元素不会使用 simple 自动居中，margin: 0 auto;因为它是一个块元素，因此其默认宽度是其父元素的宽度，这会导致auto左右边距为零。margin: 0 auto;如果您将内部包装在一个块中并给它一个明确的宽度（例如：http: //jsfiddle.net/ambiguous/aMemg/），它将起作用。

Answer 2

http://jsfiddle.net/jkmwy/

您可以设置边框左/右/上/下的样式以创建斜面效果。

html

<div id="a"><div id="b">blah</div></div>

css

#b {
    height: 200px;
    text-align: center;
    background-color: white;
    border: 1px solid red;
    line-height: 200px;
}

#a {
    border: 1px solid yellow;
    width: 300px;

}

body {
    background-color: black;
}