11.07测试题

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link rel="shortcut icon" href="冰霜奇迹(www.10088mu.com)奇迹私服,千人在线,特色奇迹,玩家赚钱的奇迹私服_files/tit.png"/>
<style type="text/css">
    *{ margin:0px auto; padding:0px;}

    .a1{ width:0px; height:0px; border-left:100px solid transparent; border-bottom: 100px solid transparent; border-right:100px solid transparent; border-top:100px solid #309;}
    .a2{ width:100px; height:100px; border-left:10px solid #309; border-bottom:10px solid #309;
     transform:rotate(45deg);}
    .a3{ width:100%; height:350px; background-color:#0F0;  font-family:微软雅黑; font-size:24px; color:#F00}
    .a4{ width:600px; height:40px; border:2px solid #e9e9e9}
    .a5{ width:100px; height:38px; float:left; text-align:center; vertical-align:middle; line-height:38px; font-family:微软雅黑; font-size:14px; color:#333; font-weight:bold; cursor:pointer;}
    .a5:hover{ background-color:#b3b6bb; border-top:2px solid #F39; color:#FFF}
    
    .a6{ width:100%; height:350px; background-color:#0F0;  font-family:微软雅黑; font-size:24px; color:#F00; text-align:center; vertical-align:middle; line-height:350px}
    .a7{ width:100%; height:300px; background-color:#90C; clear:both;}

</style>
</head>

<body>
<br />
<br />
<br />

    <div class="a1"></div>
<br />
<br />
<br />
<br />
    <div class="a2"></div>
<br />
<br />
<br />
<br />
    <div class="a3"><br />
        <p>*{设置外边距为0像素 居中,内边距为0像素,字体是微软雅黑,字体大小是14像素}</p>
        <br />
        <p>#content{上外边框宽度为20像素 右外边宽度为0像素 下外边宽度为0像素 左wai边宽度为300像素。div宽度为350像素,高度为100像素,边框为2像素,实线 颜色是#60f,超出范围隐藏,增加10像素内边距。}<p>
        <br />
        <p>#waicheng{div宽100像素,高50像素,左外边框宽度320像素,超出范围隐藏,缩小上边框外围2像素}</p>
        <br />
        <p>#sanjiao{div宽度为50像素,高度为50像素,边框宽度为2像素,实线,颜色是#60f,旋转45°,相对自身位置向上移动27像素 距离上边0像素,距离左边0像素,背景颜色为白色}</p></div> 
   
   <br />
   <br />
   <br />
   <br />
   <br />
       <div class="a4">
    <div class="a5"><a>春节</a></div>
    <div class="a5">元宵节</div>
    <div class="a5">端午节</div>
    <div class="a5">中秋节</div>
    <div class="a5">国庆节</div>

    </div>
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   
    <p class="a6">固定位置 top:0px; position:fixed</p>

    <div class="a7"></div>



</body>
</html>

 

posted @ 2017-01-15 13:52  小太白  阅读(218)  评论(0编辑  收藏  举报