美文网首页
HTML任务完成

HTML任务完成

作者: Aym_fuhong | 来源:发表于2016-12-10 23:19 被阅读0次

    1.练习说明:

    • 列表完成思路:
      总体是个无序列表 —> 无序列表的每个标签中有一个有序列表 —> 有序列表的每个标签中有一个无序列表
    task01.png

    代码如下:

    <ul>  
      <li>JavaScript
        <ol>        
         <li>第一章    
            <ul>        
                <li>const</li>           
                <li>let</li>          
           </ul>        
         </li>      
          <li>第二章        
            <ul>                
              <li>function</li>             
              <li>object</li>          
          </ul>          
        </li>   
       </ol>  
      </li>    
    <li>Java   
         <ol>     
           <li>第一章        
            <ul>             
              <li>class</li>  
              <li>package</li>         
           </ul>     
        </li>        
        <li>第二章      
              <ul>            
                 <li>private</li>       
                 <li>public</li>     
              </ul>      
          </li>    
        </ol>  
      </li>
    </ul>
    
    • 表格完成思路:
      完成一个5行4列的表格,他的border='1',添加表头文字 —> 第一行第一列和第四列rowspan='2',第二列cowspan='2' —> 第四行第一列cowspan=‘2’ —> 添加表格单元格文字,并设置居中 —> 将第一行第二列文字加粗
    task02.png

    代码如下:

    <!DOCTYPE html>
    <html lang="en">
    <head>  
      <meta charset="UTF-8">  
      <title>html任务</title>  
      <style>  
          td {     
           text-align: center;      
      }  
      </style>
    </head>
    <body>
    <table border='1'>    
    <caption>购物车</caption>  
      <tr>     
       <td rowspan='2'>名称</td>    
        <td colspan='2'><strong>2016-11-22</strong></td>  
          <td rowspan='2'>小计</td>  
      </tr>  
      <tr>    
        <td>重量</td>    
        <td>单位</td> 
       </tr>   
     <tr>     
       <td>苹果</td>    
        <td>3公斤</td>    
        <td>5元/每公斤</td>     
       <td>15元</td>  
      </tr>  
      <tr>    
        <td>香蕉</td>    
        <td>2公斤</td>   
         <td>6元/每公斤</td>   
         <td>12元</td>  
      </tr>  
      <tr>    
        <td colspan='3'>总价</td>    
        <td>27元</td>  
      </tr>
    </table>
    </body>
    </html>
    

    2.任务完成

    结果如图:

    task03.png

    代码如下:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">  
      <title>HTML练习</title>
    </head>
    <body>
    <p><h1>统一建模语言理论测试</h1></p>
    考试科目:统一建模语言<br/>
    考试时间:100分钟<br/
    >得分:<br/>
    班级(必填):<input type='text'/><br/>
    学号(必填):<input type='text'/><br/>
    姓名(必填):<input type='text'/><br/>
    <p><strong>一、填空题(每空5分,共20分)</strong></p>
    <div style="margin-left: 20px">
    1.UML的中文全称是:<br/>
    <input type='text'/><br/>
    2.对象最突出的特征是:<br/>
    <input type='text'/>&nbsp;<input type='text'/>&nbsp;<input type='text'/>
    </div
    ><p><strong>二、选择题(每题10分,共20分)</strong></p>
    <div style="margin-left: 20px">  
      1.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/>  
      2.Java语言支持:<br/>  
      <input type='radio'/>(A)单继承<br/> 
       <input type='radio'/>(B)多继承<br/> 
       <input type='radio'/>(C)单继承和多继承都支持<br/>  
      <input type='radio'>(D)单继承和多继承都不支持
    </div>
    <p><strong>三、多项选择题(每题10分,共20分)</strong></p>
    <div style="margin-left: 20px">   
     1.用例的粒度分为以下哪三种:<br/>   
     <input type='checkbox'/>(A)概述级<br/> 
       <input type='checkbox'/>(B)需求级<br/> 
       <input type='checkbox'/>(C)用户目标级<br/>  
      <input type='checkbox'/>(D)子功能级<br/>
        2.类图由以下哪三部分组成:<br/>
        <input type='checkbox'/>(A)名称(Name)<br/>  
      <input type='checkbox'/>(B)属性(Attribute)<br/>
        <input type='checkbox'/>(C)操作(Operation)<br/>  
      <input type='checkbox'>(D)方法(Function)
    </div>
    <p><strong>四、判断题(每题10分,共20分)</strong></p>
    <div style="margin-left: 20px">   
     1.用例图只是用于客户交流和沟通的,用于确定需求。   
     <input type='radio'/>对   
     <input type='radio'/>错<br/>    
    2.在状态图中,终止状态在状态图中允许有任意多个。 
       <input type='radio'/>对  
      <input type='radio'/>错
    </div>
    <p><strong>五、简答题(每题10分,共20分)</strong></p>
    <div style="margin-left: 20px">
        1.简述什么是模型以及模型的表现形式? 
       <textarea style="width: 100px; height: 60px;"></textarea><br/>  
      <input type='button' value='计算分数'/>
    </div>
    </body>
    </html>
    

    相关文章

      网友评论

          本文标题:HTML任务完成

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