美文网首页
HTML : 表单实现

HTML : 表单实现

作者: z嘉嘉嘉 | 来源:发表于2016-12-12 21:19 被阅读0次

    作业内容

    使用纯html实现考试页面(不使用任何css/js),使用正确合适的标签做出如下的页面效果。内容需要完全一样,但页面样式仅供参考:


    知识点

    相关标签:

    • **<textarea> **
      <textarea> 标签定义多行的文本输入控件。
      • 文本区中可容纳无限数量的文本,其中的文本的默认字体是等宽字体(通常是 Courier)。
      1. 可以通过 cols 和 rows 属性来规定 textarea 的尺寸,不过更好的办法是使用 CSS 的 height 和 width 属性。
     <textarea rows="3" cols="20">
        hello world !  
    </textarea>
    

    思路

    • 该页面分为6个模块
      1个标题
      5个题目模块
      1个提交按钮
      每个题目模块包含: 一个小标题 + 一个有序列表
      每个列表的不同根据其实现内容不同列数和内容不同

    实现

    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>统一建模语言理论测试</title>
    </head>
    <body>
    <h1>统一建模语言理论测试</h1>
    <div>
        考试科目:统一建模语言<br/>
        时间:100分钟<br/>
        得分:<br/>
        班级(必填):<input type="text"/><br/>
        学号(必填):<input type="text"/><br/>
        姓名(必填):<input type="text"/><br/>
    </div>
    <div>
        <h4>一、填空题(每空5分,共20分)</h4>
        <ol>
            <li>
                UML的中文全称是:<br/>
                <input type="text"/>
            </li>
            <li>
                对象最突出的特征是:<br/>
                <input type="text"/><input type="text"/><input type="text"/>
            </li>
        </ol>
    </div>
    <div>
        <h4>二、选择题(每题10分,共20分)</h4>
        <ol>
            <li>UML 与软件工程的关系是:<br/>
                <input type="radio">(A)UML就是软件工程<br/>
                <input type="radio">(B)UML参与到软件工程中软件开发过程的几个阶段<br/>
                <input type="radio">(C)UML与软件工程无关<br/>
                <input type="radio">(D)UML是软件工程的一部分<br/>
            </li>
            <li>Java语言支持:
                <input type="radio">(A)单继承<br/>
                <input type="radio">(B)多继承<br/>
                <input type="radio">(C)单继承和多继承都支持<br/>
                <input type="radio">(D)单继承和多继承都不支持<br/>
            </li>
        </ol>
    </div>
    <div>
        <h4>三、多项选择题(每题10分,共20分)</h4>
        <ol>
            <li>用例的粒度分为以下哪三种:<br/>
                <input type="checkbox"/>(A)概述级<br/>
                <input type="checkbox"/>(B)需求级<br/>
                <input type="checkbox"/>(C)用户目标级<br/>
                <input type="checkbox"/>(D)子功能级<br/>
            </li>
            <li>类图由一下哪三部分组成:<br/>
                <input type="checkbox"/>(A)名称(Name)<br/>
                <input type="checkbox"/>(B)属性(Attribute)<br/>
                <input type="checkbox"/>(C)操作(Operation)<br/>
                <input type="checkbox"/>(D)方法(Function)<br/>
            </li>
        </ol>
    </div>
    <div>
        <h4>四、判断题(每题10分,共20分)</h4>
        <ol>
            <li>用例图只是用于和客户交流沟通的,用于确定需求。<input type="radio"/>对<input type="radio"/>错</li>
            <li>在状态图中,终止状态在一个状态图中允许有任意多个。<input type="radio"/>对<input type="radio"/>错</li>
        </ol>
    </div>
    <div>
        <h4>五、简答题(每题10分,共20分)</h4>
        <ol>
            <li>简述什么是模型以及模型的表现形式?<textarea></textarea></li>
        </ol>
    </div>
    <input type="button" value="计算分数"/>
    </body>
    </html>
    

    参考+工具

    W3School : HTML
    rangl推荐的代码格式化工具

    相关文章

      网友评论

          本文标题:HTML : 表单实现

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