如何制作一个带有圆角和背景颜色的Div？

Question

当我在CSS文件中为一个元素指定"background-color: foo;"时，我没有得到任何颜色。我需要声明什么其他属性呢？我已经设置了绝对宽度。它需要一个父容器吗(它的基本父容器是一个div)?我漏掉了什么？

此外，我想使用HTML5为它添加圆角。这些圆角只需要在Safari中工作，因为这是一个Web应用程序，而不是普通的网站。

- wide_eyed_pupil

---

互联网上充满了圆角 DIV 指南，你尝试过什么？ - Mahmoud Al-Qudsi

你建议我尝试什么？我可以发布我的代码，但它看起来像下面的那些，<头皮发麻>。 - wide_eyed_pupil

Answer 1

看起来您有两个问题： 1. 设置元素的背景；2. 您想在Safari中设置元素的圆角。

1. 如果您要设置的元素是

   标签，您需要设置

   标签的宽度和高度，例如：

   <div id='mydiv'>这里放置一些元素</div>

CSS代码：

   #mydiv { 
      background-color: #111;
      height: 100px;
      width:100px
   }

2. 设置圆角（以下代码适用于所有浏览器）：

   .round-corner {
      -webkit-border-radius: 5px 5px 5px 5px; 
      -moz-border-radius: 5px 5px 5px 5px;
      -o-border-radius: 5px 5px 5px 5px;
      border-radius: 5px 5px 5px 5px;
   }

- Someth Victory

---

我希望高度是动态的，我可以不设置高度，让元素自动拉伸吗？ - wide_eyed_pupil

@wide_eyed_pupil：是的，你可以。 - Ayush

Answer 2

背景颜色必须是十六进制或浏览器可识别的有效字符串

例如：

background: #F0F0F0;

或者

background: white;

对于边框：

border-radius: 4px;

演示

- Ayush