10-11

作者: 浩气一条蛟龙 | 来源:发表于2017-10-11 20:33 被阅读0次

    10-11公用css

    /* CSS Document */
    body {
        margin-top: 0px;
    }
    .box_zero{margin: 0 auto;
        padding: 0;
        height: 300px;
        width: 500px;
        background-color:#666;
    }
    .box_one{
        height: 100px;
        width: 100px;
        float: left;
        background-color: #F00;
    }
    .box_two{
        height: 100px;
        width: 100px;
        float: right;
        background-color: #F00;
    }
    .box {
        margin:auto;
        height: 110px;
        width: 1185px;
        background-color: #666;
    }
    .box1 {
        height: 60px;
        width: 1185px;
        background-color: #F00;
    }
    .box2 {
        height: 50px;
        width: 840px;
        background-color: #00F;
        float: right;
    }
    .box3 {
        height: 50px;
        width: 100px;
        border: solid 1px #FFF;
        float: left;
        background-color: #F90;
    }
    a{
        display:block;}
    

    题目一:浮动

    <!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>10.11One</title>
    <link rel="stylesheet" type="text/css" href="作业10-11css.css" />
    <style type="text/css">
    </style>
    </head>
    <body>
    <div class="box_zero">
      <div class="box_one"></div>
        <div class="box_two"></div>
    </div>
    </body>
    </html>
    

    题目二:元素转换

    <!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>10.11Two</title>
    <link rel="stylesheet" type="text/css" href="作业10-11css.css" />
    </head>
    <body>
    <div class="box">
      <div class="box1"></div>
      <div class="box2">
        <div class="box3"><a href="苍爹秧歌"></a></div>
        <div class="box3"><a href="苍爹秧歌"></a></div>
        <div class="box3"><a href="苍爹秧歌"></a></div>
        <div class="box3"><a href="苍爹秧歌"></a></div>
        <div class="box3"><a href="苍爹秧歌"></a></div>
        <div class="box3"><a href="苍爹秧歌"></a></div>
        <div class="box3"><a href="苍爹秧歌"></a></div>
      </div>
    </div>
    </body>
    </html>

    相关文章

      网友评论

          本文标题:10-11

          本文链接:https://www.haomeiwen.com/subject/xsssyxtx.html