css - 边框不见了

Question

我不明白为什么没有显示边框。我有一个封装所有元素的主包装器；我只是将每个元素的背景设为透明的白色，然后向包装器添加透明的白色边框。

http://violetoeuvre.com/

/* Wrapper - Main *********/    
.main_wrapper{ 
        display:block;
        background: rgba(255,0,0,.5);
        width:1000px;
        height: 2000px;
        margin-left:18%;
        margin-top:7%;
        border:10px;
        border-color: rgba(255,255,255,.5);
}

html

<div class="main_wrapper">

<!-- Logo _____________________________________________________-->

<div class="logo">
    <a href="index.html"><img alt="emma carmichael" height="150px"
            src="images/Home/emma-logo.png"></a>
</div>

<!---Navigation Menu ______________________________________________-->

    <div id="main_menu" class="wrapper_nav_box">
        <div class="nav_box">
            <a href="writing.html">WRITING</a> 
        </div>
        <div class="nav_box">
            <a href="http://tumblr.com">BLOG</a>
        </div>
        <div class="nav_box">
            <a href="contact.html">CONTACT</a>
        </div>
    </div>

有什么想法吗？

Answer 1

作为@Lotus said :

You forgot to include the border-style

作为使用 Lotus 建议的速记的替代方法，您可以这样做:

.main_wrapper
{ 
    /*other stuff*/
    border-width: 10px;
    border-style: solid;
    border-color: rgba(255,255,255,.5);
}

---

注意:我添加这个是为了扩展 Lotus 的回答，并帮助回答 @Claire的 comment “我知道我应该使用速记，但为什么其他方法行不通呢？”