用純HTML實(shí)現(xiàn)如下頁(yè)面：

exam.png

試卷.png

試卷名稱：

<div>
    <h1>統(tǒng)一建模語(yǔ)言理論測(cè)試</h1>
</div>

試卷卷頭

<div>
    <div>考試科目：統(tǒng)一建模語(yǔ)言</div>
    <div>時(shí)間：100分鐘</div>
    <div><label for="score">得分：</label><input type="text" id="score"></div>
    <div><label for="class">班級(jí)（必填）：</label><input type="text" id="class"></div>
    <div><label for="number">學(xué)號(hào)（必填）：</label><input type="text" id="number"></div>
    <div><label for="name">姓名（必填）：</label><input type="text" id="name"></div>
</div>

<label>標(biāo)簽為 input 元素定義標(biāo)注,其中for值與相關(guān)<input>標(biāo)簽id 一致

填空題

<div>
    <h4>一、 填空題（每空5分，共20分）</h4>
    <ol>
        <li>
            <span> UML的中文全稱是：</span>
            <div><input type="text" id="fillBlank-1"></div>
        </li>
        <li>
            <span> 對(duì)象最突出的特征是：</span>
            <div><input type="text" id="fillBlank-2"></div>
        </li>
    </ol>
</div>

選擇題

<div>
    <h4>二、選擇題（每題10分，共20分）</h4>
    <ol>
        <li>
            <span> UML與軟件工程的關(guān)系是：</span>
            <div><input type="radio" name="selectOne-1" value="A">(A)UML就是軟件工程</div>
            <div><input type="radio" name="selectOne-1" value="B">(B)UML參與到軟件工程中軟件開發(fā)過程的幾個(gè)階段</div>
            <div><input type="radio" name="selectOne-1" value="C">(C)UML與軟將工程無關(guān)</div>
            <div><input type="radio" name="selectOne-1" value="D">(D)UML是軟件工程的一部分</div>
        </li>
        <li>
            <span>Java語(yǔ)言支持：</span>
            <div><input type="radio" name="selectOne-2" value="A">(A)單繼承</div>
            <div><input type="radio" name="selectOne-2" value="B">(B)多繼承</div>
            <div><input type="radio" name="selectOne-2" value="C">(C)單繼承和多繼承都支持</div>
            <div><input type="radio" name="selectOne-2" value="D">(D)單繼承和多繼承都不支持</div>
        </li>
    </ol>
</div>

當(dāng)<input>標(biāo)簽的"type=radio"時(shí)，name 屬性值相等的<input>標(biāo)簽構(gòu)成單選關(guān)系組

多項(xiàng)選擇題

<div>
    <h4>三、多項(xiàng)選擇題（每題10分，共20分）</h4>
    <ol>
        <li>
            <span>用例的粒度分為以下哪三種：</span>
            <div><input type="checkbox" id="selectMore_1_A" value="A">(A)概述級(jí)</div>
            <div><input type="checkbox" id="selectMore_1_B" value="B">(B)需求級(jí)</div>
            <div><input type="checkbox" id="selectMore_1_C" value="C">(C)用戶目標(biāo)級(jí)</div>
            <div><input type="checkbox" id="selectMore_1_D" value="D">(D)子功能級(jí)</div>
        </li>
        <li>
            <span>類圖由以下哪三部分組成：</span>
            <div><input type="checkbox" id="selectMore_2_A" value="A">(A)名稱(Name)</div>
            <div><input type="checkbox" id="selectMore_2_B" value="B">(B)屬性(Attribute)</div>
            <div><input type="checkbox" id="selectMore_2_C" value="C">(C)操作(Operation)</div>
            <div><input type="checkbox" id="selectMore_2_D" value="D">(D)方法(Function)</div>
        </li>
    </ol>
</div>

判斷題

<div>
    <h4>四、 判斷題（每題10分，共20分）</h4>
    <ol>
        <li>
            <span>用例圖只是用于和客戶交流和溝通的，用于確定需求。</span>
            <div><input type="radio" name="judge-1" value="true">對(duì)</div>
            <div><input type="radio" name="judge-1" value="false">錯(cuò)</div>
        </li>
        <li>
            <span>在狀態(tài)圖中終止?fàn)顟B(tài)在一個(gè)狀態(tài)圖中允許有任意多個(gè)。</span>
            <div><input type="radio" name="judge-2" value="true">對(duì)</div>
            <div><input type="radio" name="judge-2" value="false">錯(cuò)</div>
        </li>
    </ol>
</div>

簡(jiǎn)答題

<div>
    <h4>五、 簡(jiǎn)答題（每題20分，共20分）</h4>
    <ol>
        <li>
            <span> 簡(jiǎn)述什么是模型以及模型的表現(xiàn)形式？</span>
            <textarea name="summary"  cols="30" rows="10"></textarea>
        </li>
    </ol>
</div>

計(jì)算分?jǐn)?shù)

<div>
    <button type="submit">計(jì)算分?jǐn)?shù)</button>
</div>

代碼點(diǎn)這里
效果圖點(diǎn)這里