导入外部样式表
<head> <link rel="stylesheet" type="text/css" href="mystyle.css" /> </head>
body{background: url(images/donkey.jpg) repeat-x fixed center right;}
p.ex2
{
border:red solid thin;
outline:#00ff00 dotted thick;
font:italic bold sans-serif;
}
p.ex1{border: medium double rgb(250,0,255)}
p.small{line-height: 0.4}
p.big{line-height: 2}
input[type="text"]
{
width:150px;
display:block;
margin-bottom:10px;
background-color:yellow;
font-family: Verdana, Arial;
}
input[type="button"]
{
width:220px;
margin-left:35px;
display:block;
font-family: Verdana, Arial;
background-color:red;
}
img{position:absolute;clip:rect(0px 50px 200px 0px)}
#adiv
{
background-color:#00FFFF;
float:right;
margin:0 0 15px 20px;
padding:15px;
width:150px;
height:150px;
overflow: scroll
}<form name="input" action="" method="get"> <input type="text" name="Name" value="Bill" size="20"> <input type="text" name="Name" value="Gates" size="20"> <input type="button" value="Example Button"> </form> <p class="big">bigbigbig</p> <p class="big">bigbigbig</p> <p class="big">bigbigbig</p> <p class="small">smallsmallsmall</p> <p class="small">smallsmallsmall</p> <p class="small">smallsmallsmall</p> <p class="small">smallsmallsmall</p><br /> <p class="ex1">aaaaaaaaaaaaaaaaaaaa</p><br /> <p class="ex1">aaaaaaaaaaaaaaaaaaaa</p> <p class="ex2">aaaaaaaaaaaaaaaaaaaa</p> <img src="images/ba8.jpg" alt="" /><br /> <div id="adiv"> 这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，用户代理都会提供一种滚动机制。因此，有可能即使元素框中可以放下所有内容也会出现滚动条。默认值是 visible。 </div>