总有一款适合你。
做系统的话,稳重且流行用 bootstrap,覆盖非常全,插件也很灵活。
线性渐变(Linear Gradients)- 向下/向上/向左/向右/对角方向实例
从上到下的线性渐变:
#grad {
background: -webkit-linear-gradient(red, blue)/* Safari 5.1 - 6.0 */
background: -o-linear-gradient(red, blue)/* Opera 11.1 - 12.0 */
background: -moz-linear-gradient(red, blue)/* Firefox 3.6 - 15 */
background: linear-gradient(red, blue)/* 标准的语法 */
}
-----------------------------------------------------------------------
径向渐变(Radial Gradients)- 由它们的中心定义
实例
颜色结点均匀分布的径向渐变:
#grad {
background: -webkit-radial-gradient(red, green, blue)/* Safari 5.1 - 6.0 */
background: -o-radial-gradient(red, green, blue)/* Opera 11.6 - 12.0 */
background: -moz-radial-gradient(red, green, blue)/* Firefox 3.6 - 15 */
background: radial-gradient(red, green, blue)/* 标准的语法 */
}
方法:根据浏览者的分辨率自动调用样式表1、新建两个样式表分别命名为:1024.css800.css(当然有更多分辨率,可以增加样式表)
2、在样式表中分别定义好图片作为网页背景。
3、新建一个网页文件,把下面代码复制过去。
<script language="JavaScript">
<!--
function test(){
var a=screen.width+".css"
//alert(a)
//测试变量a的值
document.getElementById("eric").href =a
}
//-->
</script>
<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312">
<title>无标题文档</title>
<link href="" rel="stylesheet" type="text/css" id="eric">
</head>
<body onLoad="test()">
</body>
</html>
搞定!