现在的位置: 首页 > 综合 > 正文

HTML基础学习笔记

2018年05月03日 ⁄ 综合 ⁄ 共 4327字 ⁄ 字号 评论关闭

<html>
 <head>
  <title>            
   基础HTML学习
  </title>      <t/标题/t>
          <t/ meta标签用于设置一些头信息/t>
  <meta http-equiv="content-type" content="text/html;charset=gb2312"> <t/指定/t>
  <meta http-equiv="refresh" content="10;url=file:///E:/Temp/html.htm"> <t/重定向,指定时间后自动打开指定url/t>
  <meta name="keywords" content="heml,学习">       <t/搜索引擎抓取的关键字/t>
  <meta name="description" content="这是一个关于html的学习测试">  <t/关于该页面的描述/t>
  <meta http-equiv="expires" content="0">    <t/网页的过期时间,禁止浏览器缓存该页面/t>
  <meta http-equiv="pragma" content="no-cache">  <t/禁止代理服务器缓存该页面/t>
  
 </head>
  
 <body bgcolor="#40e0d0" background="">   <t/背景色和背景图片/t>
 
  <a name="AnchorName">        <t/锚点/t>
  <a href="http://www.baidu.com" target="left">超链接</a>   <t/超链接.target属性决定了链接在哪边打开,它的值通常为以下五种:
                     _blank、_self、_parent、_top和自定义,依次表示为:
                     新窗口、当前窗口、父窗口、顶层窗口和框架/t>
  <a href="file:///E:/Temp/html.htm#AnchorName" target="TargetWindow">超链接</a> <t/url#xxx 表示打开指定页面的指定位置,xxx指定锚点名/t>
  
  <hr noshade color="#ffffff" width="500" size="5" align="left">   <t/分割线,指定无阴影,颜色,宽度,大小,对齐方式/t>
  
  <h1>1号标题</h1>  <t/标题特征:1.黑体字,2.自动插入空行,3.h1最大,h6最小/t>
  <h2>2号标题</h2>
  <h3>3号标题</h3>
  <h4>4号标题</h4>
  <h5>5号标题</h5>
  <h6>6号标题</h6>
  
  <font face="楷体_GB2312" size="7" color="red">字体</font> <t/字体大小范围1-7,颜色可以使用数字或者预定义的名字/t>
  <br>      <t/新的一行/t>
  <tt>打字机风格字体</tt>
  <br>
  <cite>引用方式(斜体)</cite>
  <br>
  <em>强调(斜体加粗体)</em>
  <br>
  <b>黑体</b>
  <i>斜体</i>
  <u>下划线</u>
  <s>中划线</s>
  <blink>闪烁</blink>
  <sup>上标</sup>
  <sub>下标</sub>
  <br>
  
  <font face="楷体_GB2312" size="7" color="red">显示特殊字符</font>
  <br>
  &lt;,&gt;,&reg;,&amp;,&nbsp;,&copy;,&trade;,&quot; 
  <br>      <t/可以使用&#xx来显示字符,xx为字符的unicode码/t>
  
  <font face="楷体_GB2312" size="7" color="red">布局</font>
  <br>换行
  <nobr>不换行<nobr>
  <p>分段落显示</p>
  <div>分块显示</div>
  <span>分块显示</span>
  <pre>保留原有格式</pre>
  <br>
  
  <font face="楷体_GB2312" size="7" color="red">对齐</font>
  <h1 align="left">
  <div align="right">
  <table align="center">
  <hr align="top">  <t/可取值还有 middle,buttom/t>
  <center>对齐到中间</center>
  
  <font face="楷体_GB2312" size="7" color="red">图片</font>
  <br>
  <img src="snap1.jpg" align="center" alt="图片无法显示时显示的文字" border="10">  <t/src指定图片url,border指定边框的厚度/t>
  <br>
  
  <font face="楷体_GB2312" size="7" color="red">表格</font>
  <br>
  <table width="300" align="left" border="2">
   <tr>  <t/表头(可选)/t>
    <th width="30%" align="center">表头1</th>
    <th width="30%" align="center">表头2</th>
    <th align="center">表头3</th>
   </tr>
   <tr>
    <td>11</td>
    <td>12</td>
    <td>13</td>
   </tr>
   <tr>
    <td rowspan="" colspan="">21</td>
   </tr>
  </table>
  
  <br>
  <font face="楷体_GB2312" size="7" color="red" align="center">表单</font>
  <br>
  <form method="post" action="user.jsp"> <t/method指定表单提交方式,action指定提交到的文件/t>
   <input type="text" name="input"> <t/表单中的输入标签,name表示赋值给的变量名
            type指定输入框类型,可选text radio checkbox password hidden
             select submit reset button textarea image/t>
   <input type="text" name="TextInput" value="" maxlength="" size="">  <t/文本框,value指定默认值,
                 maxlength最大字符长度,size文本框宽度/t>
   <input type="password" name="PasswordInput" value="" size="" maxlength=""> <t/密码输入框/t>
   <input type="radio" name="RadioInput" value="" checked>  <t/单选框/t>
   <input type="checkbox" name="CheckBoxInput" value="" checked>   <t/复选框/t>
   <input type="hidden" name="HiddenInput" value=""> <t/隐藏域,不显示在网页中/t>
   
   <select name="SelectInput" size="5" multiple>  <t/列表框,multiple标记指定可以多选/t>
    <option value="01" selected>001</option> <t/列表框中的值,selected标记指定默认选中/t>
    <option value="02">002</option>
    <option value="03">003</option>
    <option value="04" selected>004</option>
    <option value="05">005</option>
    <option value="06">006</option>
    <option value="07">007</option>
   </select>
   
   <textarea rows="5" cols="6" wrap="Soft">多行多列文本框</textarea> <t/Warp指定换行方式,可选值Off不换行,
                Soft整个单词自动换行,Hard截断单词自动换行/t>
   
   <input type=button name="" value="按钮"> <t/按下按钮没有反映/t>
   <input type=submit name="" value="提交"> <t/按下按钮该表单中数据提交到服务器/t>
   <input type=reset name="" value="重置">  <t/按下按钮,表单中数据被重置/t>
   <input type="image" src="">    <t/点击图片提交/t>
   
  </form>
  
    
 </body> 
 
</html>

 

<html>
 <head>
  <title>框架演示</title>
 </head>
 <t/如果网页含有框架,那么不应该有body部分/t>
 <frameset cols="200,30%,*">  <t/设置大小/t>
  <frame name="left" src="01.htm" noresize> <t/noresize标记指定不允许改变大小/t>
  <frame name="middle" src="02.htm">
  <frameset rows="40%,*">    <t/内嵌一个frameset/t>
   <frame name="up" src="03.htm">
   <frame name="down" src="04.htm">
  </frameset>
 </frameset>
</html>

 

 

 

抱歉!评论已关闭.