html中div颜色背景,html – 1 DIV上的多种背景颜色

使用CSS3并且只有一个div,渐变是一种相当简单的方法：

是的,我骗了.这根本不是很简单,因为你需要使用相同的东西的无数不同的供应商前缀版本：

div {

background: #000fff; /* Old browsers */

background: -moz-linear-gradient(top, #000fff 0%, #000fff 50%, #ffff00 50%, #ffff00 100%); /* FF3.6+ */

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000fff), color-stop(50%,#000fff), color-stop(50%,#ffff00), color-stop(100%,#ffff00)); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(top, #000fff 0%,#000fff 50%,#ffff00 50%,#ffff00 100%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(top, #000fff 0%,#000fff 50%,#ffff00 50%,#ffff00 100%); /* Opera11.10+ */

background: -ms-linear-gradient(top, #000fff 0%,#000fff 50%,#ffff00 50%,#ffff00 100%); /* IE10+ */

background: linear-gradient(top, #000fff 0%,#000fff 50%,#ffff00 50%,#ffff00 100%); /* W3C */

}

我生成了CSS here,并删除了filter属性,因为它将导致IE6-9中的实际渐变.