第8章 练习与实验答案
练习8
1.选择题
(1) D (2)B  (3) D  (4) A  (5) C
2.填空题
(1)text-indent
(2)text-align:center;
(3)background-repeat:repeat-x;
(4)background-position
(5) red或RGB(100%,0,0)、rgb(255,0,0)、#FF0000、#F00
(6) 边框为2像素、双实线、红。
3.问答题
见教材。
实验8
1. 代码
<html>
    <head>
        <title>CSS+DIV</title>
        <style type="text/css">
            body{
                margin:0;   
            }
            #wrap{
                width:900px;
                margin:0 auto;   
                border:2px solid  red;
                margin-top:5px;
            }
            div{
                text-align:center;
            }
            #pic{
                width:420px;
                height:300px;
                background-image:url(ex8.jpg);
                background-repeat:no-repeat;
                background-position:center;
                float:left;
                background-color:#77A;
            }
            #text{
                background-image:url(ex8.jpg);
                width:420px;   
                height:500px;
                float:right;
                background-color:#77A;
                padding:10px;
                font-weight:bold;
            }
            #title{
                font-family:"华文彩云"    ;
                font-size:32px;
            }
            #author{
                font-size:12px;   
                font-family:"黑体";
                text-align:right;
                margin-bottom:24px;
            }
            p{
                font-family:"隶书";
                font-size:24px;
                margin:2px;
                letter-spacing:0.5em;   
                line-height:1.5em;
                text-align:center;
            }
        </style>
    </head>
    <body>
        <div id="wrap">
            <div id="pic"></div>
            <div id="text">
                <div id="title">木兰花令.拟古决绝词</div>
                <div id="author">纳兰性德</div>
                <div id="content">
                    <p>人生若只如初见，</p>
                    <p>何事秋风悲画扇。</p>
                    <p>等闲变却故人心，</p>
                    <p>却道故心人易变。</p>
                    <p>骊山雨罢清宵半，</p>web前端开发笔试题库
                    <p>泪雨霖铃终不怨。</p>
                    <p>何如薄幸锦衣郎，</p>
                    <p>比翼连枝当日愿。</p>
                </div>
            </div>
        </div>
    </body>
</html>
2.代码
<html>
    <head>
        <title>Head Line</title>
        <style type="text/css">
            h1{
                background:#678;
                color:white;
                text-align:center;   
            }
            p{
                font-family:Arial;
                font-size:16px;
                line-height:1.5em;   
            }
            .firstLetter{
                font-size:3em;
                float:left;   
            }
            img{
                border:1px dashed  gray;
                margin:10px 10px 10px 0;
                padding:5px;
                float:left;   
            }
        </style>
    </head>
    <body>
        <h1>Head Line</h1>
        <img src="cup.jpg"/>
        <p><span class="firstLetter">M</span>obile Widget使用的标准的Web技术，如HTML，CSS，javascript等。这些经典的Web技术规范是由W3C（万维网联盟）的下属各个工作组制定并推进的。作为开发Widget之前的知识准备，在本章中我们将逐一介绍这些技术。
    </body>
</html>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。