如何制作具有圆角和背景颜色的Div?

时间:2012-05-29 04:10:46

标签: css html5 background-color rounded-corners

当我指定“background-color:foo;”时到我的CSS文件中的元素我没有任何颜色。我需要声明什么其他属性,我有一个绝对宽度设置?它是否需要父容器(它具有基本作为父容器)?我在这里想念的是什么?!

另外,我想使用HTML5为它提供圆角。角落只需要在Safari中工作,因为它适用于不是一般消费的Web应用程序。

2 个答案:

答案 0 :(得分:9)

看来你有2个问题: 1.将背景设置为元素; 2.你想把圆角设置成一个元素并在野生动物园中工作。

  1. 如果元素是div标签,则需要设置div标签的宽度和高度,例如:

    <div id='mydiv'>some elements here</div>

  2. 你的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;
       }
    

答案 1 :(得分:1)

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

所以,像这样:

background: #F0F0F0;

background: white;

对于边界:

border-radius: 4px;

<强> Demo