html

最新推荐文章于 2024-06-20 12:47:37 发布

胡泽宽

最新推荐文章于 2024-06-20 12:47:37 发布

阅读量372

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/iwuio/article/details/72887150

“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。

超文本标记语言的结构包括“头”部分（英语：Head）、和“主体”部分（英语：Body），其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。

来总结一下。

align代表左右位置，可以是left，right，center。valign代表上下位置，可以是top，middle，bottom。

表格

表格的元素：table 表，tr 行，th 标题， td 单元格，caption 表名。

<head>
   <head><title>表格的例子</title></head>
   <body>
       <table border="1" align="center" bgcolor="#ffdddd">
           <caption>2004年度期末考试成绩单</caption>
           <tr align="center" valign="middle">
             <th>姓名</th>
             <th>语文</th>
             <th>数学</th>
             <th>英语</th>
           </tr>
           <tr align="center" valign="middle">
              <td>李明</td>
              <td>9</td>
              <td>3</td>
              <td>4</td>
           </tr>
           <tr align="center" valign="middle">
              <td>王云</td>
              <td>9</td>
              <td>35</td>
              <td>4</td>
           </tr>
           <tr align="center" valign="middle">
              <td>赵丽</td>
              <td>9</td>
              <td>53</td>
              <td>49</td>
           </tr>
       </table>
   </body>
</head>

列表

默认数字开头，相对应的列改变数字。添加value=""。

<ol >
    
 <li>语文
    
 <li value=15>数学
  
 <li>英语
   
 <li>自考 
</ol>

设置开头顺序格式再ol标记，添加type。属性有I，a。设置表头符号，也是type，元素有disc，square，circle。

<ol type="I">        <!--设置符合格式-->
   <li>《java》
   <li>《jsp》
   <li>《vc++》
   <li>《vb》
   <li>《c++》
<ol>

<ol type="a">
   <li>《java》
   <li>《jsp》
   <li>《vc++》
   <li>《vb》
   <li>《c++》
<ol>

<ul type="disc">
   <li>《java》
   <li>《jsp》
   <li>《vc++》
   <li>《vb》
   <li>《c++》
</ul>

<ul type="square"> <!--具有箭头图标-->
   <li>《java》
   <li>《jsp》
   <li>《vc++》
   <li>《vb》
   <li>《c++》
</ul>

<ul type="circle">
   <li>《java》
   <li>《jsp》
   <li>《vc++》
   <li>《vb》
   <li>《c++》
</ul>

表单，主要是input，属性text代表文本框，radio代表单选框，checkbox代表多选框，select代表下拉列表，option代表每一个可选项。

<html>
   <head><title>表单的例子</title></head>
   <body>
      <form method="get" action="reg.jsp">  <!--get是不安全的提交方式-->
       <table>
            <tr>
                  <td>
                      用户名：
                  </td>
                  <td>
                      <input type="text" name="user" value="游客" size="30">
                  </td>
            </tr>
            <tr>
                  <td>
                       密码：
                  </td>
                  <td>
                       <input type="password" name="pwd">
                  </td>
            </tr>
        
            <tr>
                  <td>
                       性别：
                  </td>
                  <td>
                       <input type="radio" name="sex" value="1"  >男  <!--默认选中-->
                       <input type="radio" name="sex" value="0" checked> 女
                  </td>
            </tr>
            <tr>
                  <td>
                      兴趣爱好：
                  </td>
                  <td>
                         <input type="checkbox" name="interest" value="football">足球
                         <input type="checkbox" name="interest" value="backetball">篮球
                         <input type="checkbox" name="interest" value="volleyball">排球
                         <input type="checkbox" name="interest" value="swim">游泳
                  </td>
            </tr>
            <tr>
                  <td>
                        最高学历：
                  </td>
                  <td>

                        <select size="1" name="education">
                        <option value="" selected>...</option><!--默认选中-->
                        <option value="高中">高中</option>
                        <option value="大学">大学</option>
                        <option value="硕士">硕士</option>
                        <option value="博士">博士</option>
                        </select><br> 
                  </td>
            </tr>
            <tr>
                  <td valign="top"  >
                    个人简历：
                  </td>
                  <td>
                         <textarea name="personal" rows="5" cols="30">个人简历</textarea>
                  </td>
            </tr>

            <tr>
                  <td>
        <input type="reset" > 
                  </td>
                  <td>
        <input type="submit" >
                  </td>
            </tr>
       </table>   
      </form>
   </body>
</html>