View Code
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<link href="style.css" rel="stylesheet" type="text/css" />
<title>An Introduction to CSS3; A Nettuts Tutorial</title>
<style>
#wrapper {
width: 100%;
height: 100%;
}
div {
width: 100px;
height: 100px;
margin: 10px;
float: left;
}
#round {
-moz-border-radius: 10px;
-webkit-border-radius: 11px;
border: 1px solid #000;
background-color: #000;
}
#indie {
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomleft: 10px;
-webkit-border-top-left-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
border: 1px;
solid #000;
background-color: #000;
}
#opacity {
opacity: 0.3;
background-color: #000;
}
#shadow {
border: 1px solid #000;
background-color: #fff;
-webkit-box-shadow: 3px 5px 10px #ccc;
-moz-box-shadow: 3px 5px 10px #ccc;
}
#resize {
background-color: #fff;
border: 1px solid #000;
resize: both;
overflow: auto;
max-width: 500px;
max-height: 500px;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="round"></div>
<div id="indie"></div>
<div id="opacity"></div>
<div id="shadow"></div>
<div id="resize"></div>
</div>
</body>
</html>