5种要掌握的CSS3技术

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>

你可能感兴趣的:(css3)