検索

ホームページ >ウェブフロントエンド >htmlチュートリアル >HTMLの概要

HTMLの概要

WBOY
WBOYオリジナル
2016-10-15 10:32:061447ブラウズ

一、HTML

  1. 网页编程语言。Html之所以能展现出各种各样的效果，是浏览器的功能。
  2. HTML(HyperText Markup Language)就是描述网页长什么样子、有什么内容的一个文本。查看网页的描述内容（HTML）的方式：使用IE浏览器的话，在网页上点击右键，选择“查看源文件”
  3. B/S(Browser/ Server)：浏览器-服务器，客户端只需要一个浏览器
  4. C/S(Client/Server)：客户端必须安装对应的软件。比如：QQ、MSN、FoxMail

二、最基本的HTML结构

<span style="color: #008080;"> 1</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> <!DOCTYPE> 是HTML5声明，<!DOCTYPE> 必须是 HTML 文档的第一行，位于 <html> 标签之前。<!DOCTYPE>是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。</span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 2</span> <span style="color: #0000ff;"><!</span><span style="color: #ff00ff;">DOCTYPE html</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 3</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 4</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> head标签是所有头部元素的容器。head标签内的元素可包含脚本、样式表和提供页面的元信息等等。以下标签都可以添加到 head 部分：title、base、link、meta、script 以及style。头部的内容不会显示在浏览器的。 </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 5</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">head</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 6</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 设置字符集，如果字符集不对，可能导致乱码。一般建议utf-8国际编码 </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 7</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">meta </span><span style="color: #ff0000;">http-equiv</span><span style="color: #0000ff;">="Content-Type"</span><span style="color: #ff0000;"> content</span><span style="color: #0000ff;">="text/html; charset=gb2312或utf-8或gbk"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;"> 8</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 定时自动跳转 </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 9</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">meta </span><span style="color: #ff0000;">http-equiv</span><span style="color: #0000ff;">="refresh"</span><span style="color: #ff0000;"> content</span><span style="color: #0000ff;">="10;URL=http://www.leixuesong.cn"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;">10</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> SEO相关标签，title定义文档的标题,百度建议一般不要超过32位,meta定义页面关键词和页面的描述</span><span style="color: #008000;">--></span>
<span style="color: #008080;">11</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">title</span><span style="color: #0000ff;">></span>网页标题<span style="color: #0000ff;"></</span><span style="color: #800000;">title</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">12</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">meta </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="keywords"</span><span style="color: #ff0000;"> content</span><span style="color: #0000ff;">="PHP程序员,技术博客,个人博客"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;">13</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">meta </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="description"</span><span style="color: #ff0000;"> content</span><span style="color: #0000ff;">="我的博客记录了Linux学习，PHP开发与编程，Web前端开发，MySQL学习和教程，NoSQL数据库教程以及个人的人生经历和观点。"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;">14</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">link </span><span style="color: #ff0000;">rel</span><span style="color: #0000ff;">="stylesheet"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="text/css"</span><span style="color: #ff0000;"> href</span><span style="color: #0000ff;">="main.css"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;">15</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">script </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="text/javascript"</span><span style="color: #ff0000;"> src</span><span style="color: #0000ff;">="http://pagead2.googlesyndication.com/pagead/show_ads.js"</span><span style="color: #0000ff;">></</span><span style="color: #800000;">script</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">16</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">head</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">17</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 正文部分，所有在浏览器上可见的内容必须写在body标签内部 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">18</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">body</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">19</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">body</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">20</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>

三、最常用的HTML标签

a、布局标签

  • div标签定义文档中的分区或节（division/section），可以把文档分割为独立的、不同的部分，主要用于布局。
  • aside标签的内容可用作文章的侧栏，html5新增标签。
  • header标签定义页面的头部（介绍信息），html5新增标签。
  • section标签定义文档中的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分，html5新增标签。
  • footer 标签定义文档或节的页脚，通常包含文档的作者、版权信息、使用条款链接、联系信息等等，html5新增标签。
  • article标签规定文章独立的其他内容，比如：标题、内容、评论，html5新增标签。

b、文本标签

  • h1-h6标签可定义标题（h1最大，h6最小）
  • p标签定义段落
  • b/strong标签加粗
  • em标签来表示强调的文本，斜体
  • strong标签表示重要文本
  • u标签下划线
  • s标签删除线
  • br标签表示回车换行
  • hr标签表示水平线
  • span标签被用来组合文档中的行内元素。
  • blockquote标签表示块引用
  • pre标签可定义预格式化的文本，保持原有格式的一种标签。
  • sub标签下标，
  • sup>标签上标
  • 表示一个空格
  • ©表示版权符
  • <表示<
  • >表示>

c、a标签定义超链接

  • 指定页面间的跳转，链接可以指向外部链接或者页面内部id锚点，可以在当前页面打开，新开窗口。 
    <span style="color: #0000ff;"><</span><span style="color: #800000;">a </span><span style="color: #ff0000;">href</span><span style="color: #0000ff;">="指向的链接地址或者网址#ID名"</span><span style="color: #ff0000;"> target</span><span style="color: #0000ff;">="_blank|_self|_top|_parent"</span><span style="color: #0000ff;">></span>百度<span style="color: #0000ff;"></</span><span style="color: #800000;">a</span><span style="color: #0000ff;">></span>
  • 超级链接 
    <span style="color: #0000ff;"><</span><span style="color: #800000;">a </span><span style="color: #ff0000;">href</span><span style="color: #0000ff;">="http://www.yahoo.com"</span><span style="color: #ff0000;"> target</span><span style="color: #0000ff;">="_self"</span><span style="color: #ff0000;"> title</span><span style="color: #0000ff;">="去美国雅虎"</span><span style="color: #0000ff;">></span>雅虎<span style="color: #0000ff;"></</span><span style="color: #800000;">a</span><span style="color: #0000ff;">></span>
  • 图片超链接 
    <span style="color: #0000ff;"><</span><span style="color: #800000;">a </span><span style="color: #ff0000;">href</span><span style="color: #0000ff;">="http://www.microsoft.com"</span><span style="color: #0000ff;">><</span><span style="color: #800000;">imgborder</span><span style="color: #0000ff;">="0"</span><span style="color: #ff0000;"> src</span><span style="color: #0000ff;">="1.jpg"</span><span style="color: #0000ff;">/></</span><span style="color: #800000;">a</span><span style="color: #0000ff;">></span>
  • 相对URL
    相对URL表示相对于当前文档的资源;
    “/”表示网站根目录，“../”表示父目录;
    “../../”表示父目录的父目录，“./”或者不写任何斜线表示相对于当前路径的目录
    站内引用最好用相对URL，这样域名改变了、目录改变了都不受影响。 
    <span style="color: #0000ff;"><</span><span style="color: #800000;">img </span><span style="color: #ff0000;">src</span><span style="color: #0000ff;">="../images/csharp1.jpg"</span> <span style="color: #0000ff;">/></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">img </span><span style="color: #ff0000;">src</span><span style="color: #0000ff;">="/images/csharp1.jpg"</span> <span style="color: #0000ff;">/></span>
  • 将的target属性设定为"_blank"就可以在新窗口中打开超链接。
    国情：国内的网站很多都是默认在新窗口中打开。target的取值范围：
    _blank :在新窗口中打开
    _self :在自己的窗口中打开
    _parent :父窗口中打开
    _top :表示在顶级窗口打开
    框架名称：在指定框架中打开。
  • 锚记：用name属性为 起名字：这里是最后。这样可以通过转到平台来跳转到超链接的部分。

d、多媒体标签

  • img标签主要在网页中插入图像，可以定义图片替换文本、显示宽度和高度、是否带边框，建议等比例设置，否则图像会变形。

　　　注意图片是链接的，不是插入的，所以如果src指向的文件不存在了，就看不了了。alt属性为图片无法显示时的显示文本，鼠标方式去也会有悬浮提示“点击查看大图”；title用来显示当鼠标放到图片上时显示的文字；border属性指定边框，border="0"不显示边框；width、height属性指定图片的显示大小，如果不指定则是图片的原始大小。

  • <span style="color: #0000ff;"><</span><span style="color: #800000;">img </span><span style="color: #ff0000;">src</span><span style="color: #0000ff;">="图片地址"</span><span style="color: #ff0000;"> alt</span><span style="color: #0000ff;">="替换文本，图片打不开的时候显示"</span><span style="color: #ff0000;"> width</span><span style="color: #0000ff;">="图片宽度"</span><span style="color: #ff0000;"> height</span><span style="color: #0000ff;">="高度"</span><span style="color: #ff0000;"> border</span><span style="color: #0000ff;">="0"</span> <span style="color: #0000ff;">/></span>
  • audio标签定义声音，比如音乐或其他音频流。html5新增标签。 
    <span style="color: #0000ff;"><</span><span style="color: #800000;">audio </span><span style="color: #ff0000;">src</span><span style="color: #0000ff;">="someaudio.wav"</span><span style="color: #0000ff;">></span>您的浏览器不支持 audio 标签。<span style="color: #0000ff;"></</span><span style="color: #800000;">audio</span><span style="color: #0000ff;">></span>
  • video标签定义视频，比如电影片段或其他视频流。html5新增标签。 
    <span style="color: #0000ff;"><</span><span style="color: #800000;">video </span><span style="color: #ff0000;">src</span><span style="color: #0000ff;">="movie.ogg"</span><span style="color: #ff0000;"> controls</span><span style="color: #0000ff;">="controls"</span><span style="color: #0000ff;">></span>您的浏览器不支持 video 标签。<span style="color: #0000ff;"></</span><span style="color: #800000;">video</span><span style="color: #0000ff;">></span>

e、序列化标签

  • ul和li无序列表标签。 
    <span style="color: #0000ff;"><</span><span style="color: #800000;">ul</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>HTML<span style="color: #0000ff;"></</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>JS<span style="color: #0000ff;"></</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>PHP<span style="color: #0000ff;"></</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"></</span><span style="color: #800000;">ul</span><span style="color: #0000ff;">></span>
  • ol和li有序列表标签，可以使用type属性规定有序列表符号的类型。1 按数字有序排列，为默认值，（1、2、3、4）；a 按小写字母有序排列，（a、b、c、d）；A 按字母大写有序排列，（A、B、C、D）。i 按小写罗马字母有序，（i, ii, iii, iv）；I 按小写罗马字母有序，（I, II, III, IV）。 
    <span style="color: #0000ff;"><</span><span style="color: #800000;">ol</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>HTML<span style="color: #0000ff;"></</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>JS<span style="color: #0000ff;"></</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>PHP<span style="color: #0000ff;"></</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"></</span><span style="color: #800000;">ol</span><span style="color: #0000ff;">></span>
  • dl标签定义了定义列表（definition list），dl标签用于结合 dt（定义列表中的项目）和 dd（描述列表中的项目）。 
    <span style="color: #0000ff;"><</span><span style="color: #800000;">dl</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">dt</span><span style="color: #0000ff;">></span>计算机<span style="color: #0000ff;"></</span><span style="color: #800000;">dt</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">dd</span><span style="color: #0000ff;">></span>用来计算的仪器 ... ...<span style="color: #0000ff;"></</span><span style="color: #800000;">dd</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"></</span><span style="color: #800000;">dl</span><span style="color: #0000ff;">></span>

f、表格标签

  • 为表格，在内部通过创建行，内部通过创建单元格。可以将table的border属性设为0来隐藏表格线。
  • cellpadding内容和表格边线之间的距离
  • cellspacing单元格之间的间距。
  • rowspan(跨行)、colspan（跨列）进行单元格的合并,是td的属性。 
    <span style="color: #008080;"> 1</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">table </span><span style="color: #ff0000;">width</span><span style="color: #0000ff;">="100%"</span><span style="color: #ff0000;"> height</span><span style="color: #0000ff;">="193"</span><span style="color: #ff0000;"> border</span><span style="color: #0000ff;">="1"</span><span style="color: #ff0000;"> cellpadding</span><span style="color: #0000ff;">="0"</span><span style="color: #ff0000;"> cellspacing</span><span style="color: #0000ff;">="0"</span><span style="color: #ff0000;"> bordercolor</span><span style="color: #0000ff;">="#FF0000"</span><span style="color: #ff0000;"> bgcolor</span><span style="color: #0000ff;">="#000000"</span><span style="color: #ff0000;"> background</span><span style="color: #0000ff;">=""</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 2</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 3</span>     <span style="color: #0000ff;"><</span><span style="color: #800000;">th</span><span style="color: #0000ff;">></span>标题<span style="color: #0000ff;"></</span><span style="color: #800000;">th</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 4</span>     <span style="color: #0000ff;"><</span><span style="color: #800000;">th</span><span style="color: #0000ff;">></span>标题<span style="color: #0000ff;"></</span><span style="color: #800000;">th</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 5</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 6</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 7</span>     <span style="color: #008000;"><!--</span><span style="color: #008000;"> 合并横向单元格 </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 8</span>     <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">colspan</span><span style="color: #0000ff;">="2"</span><span style="color: #ff0000;"> nowrap</span><span style="color: #0000ff;">="nowrap"</span><span style="color: #0000ff;">></span><span style="color: #ff0000;">&amp;</span>nbsp;<span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 9</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">10</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">11</span>     <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">12</span>     <span style="color: #008000;"><!--</span><span style="color: #008000;"> 合并纵向单元格 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">13</span>     <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">rowspan</span><span style="color: #0000ff;">="2"</span><span style="color: #0000ff;">></span> <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">14</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">15</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">16</span>     <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">height</span><span style="color: #0000ff;">="16"</span><span style="color: #0000ff;">></span> <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">17</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">18</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">table</span><span style="color: #0000ff;">></span>

g、表单标签

  • form标签定义提交方式、提交地址、表单字符集以及如何对其进行编码，需要提交的表单一定要放在form标签内。 
    <span style="color: #0000ff;"><</span><span style="color: #800000;">form </span><span style="color: #ff0000;">id</span><span style="color: #0000ff;">="form1"</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="form1"</span><span style="color: #ff0000;"> method</span><span style="color: #0000ff;">="post|get"</span><span style="color: #ff0000;"> enctype</span><span style="color: #0000ff;">="multipart/form-data"</span><span style="color: #ff0000;"> action</span><span style="color: #0000ff;">="提交到的地址"</span><span style="color: #0000ff;">></</span><span style="color: #800000;">form</span><span style="color: #0000ff;">></span>
  • input标签用于搜集用户信息 
    <span style="color: #008080;"> 1</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="userName"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="text"</span><span style="color: #ff0000;"> maxlength</span><span style="color: #0000ff;">="5"</span><span style="color: #ff0000;"> size</span><span style="color: #0000ff;">="100"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="asdfasdfasfd"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;"> 2</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 密码，输入的字符会被掩码（显示为星号或原点） </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 3</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="pwd"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="password"</span><span style="color: #ff0000;"> maxlength</span><span style="color: #0000ff;">="5"</span><span style="color: #ff0000;"> size</span><span style="color: #0000ff;">="100"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">=""</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;"> 4</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 文件类型的表单，上传文件时，form表单一定要设置为enctype="multipart/form-data" </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 5</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="file"</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="file"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;"> 6</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 隐藏表单 </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 7</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="hidden"</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="country"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="China"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;"> 8</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 提交 </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 9</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="submit"</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="Submit"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="提交"</span><span style="color: #ff0000;"> disabled</span><span style="color: #0000ff;">="disabled"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;">10</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 重置 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">11</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="reset"</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="Submit2"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="重置"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;">12</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> radio单选 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">13</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="sex"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="radio"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="1"</span> <span style="color: #0000ff;">/></span><span style="color: #000000;">男
</span><span style="color: #008080;">14</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="sex"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="radio"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="2"</span><span style="color: #ff0000;"> checked</span><span style="color: #0000ff;">="checked"</span> <span style="color: #0000ff;">/></span><span style="color: #000000;">女
</span><span style="color: #008080;">15</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> checkbox多选 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">16</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="skill"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="checkbox"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="1"</span><span style="color: #ff0000;"> checked</span><span style="color: #0000ff;">="checked"</span> <span style="color: #0000ff;">/></span><span style="color: #000000;">PHP
</span><span style="color: #008080;">17</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="skill"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="checkbox"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="2"</span> <span style="color: #0000ff;">/></span><span style="color: #000000;">前端
</span><span style="color: #008080;">18</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="skill"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="checkbox"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="2"</span> <span style="color: #0000ff;">/></span>数据库

    注：checked=”checked”可以简写成checked

  • label标签为input元素定义标注，如果您点击label元素文本，就会触发此input控件。

  • textarea标签，设置文本区内的可见行数和宽度

　　禁止拉伸属性：style="resize:none" 

  • <span style="color: #0000ff;"><</span><span style="color: #800000;">textarea </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="content"</span><span style="color: #ff0000;"> cols</span><span style="color: #0000ff;">="30"</span><span style="color: #ff0000;"> rows</span><span style="color: #0000ff;">="10"</span><span style="color: #0000ff;">></span>大段文本输入框<span style="color: #0000ff;"></</span><span style="color: #800000;">textarea</span><span style="color: #0000ff;">></span>
  • button标签定义一个按钮 
    <span style="color: #008080;">1</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 提交按钮 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">2</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">button </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="submit"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="提交"</span><span style="color: #0000ff;">></span>提交<span style="color: #0000ff;"></</span><span style="color: #800000;">button</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">3</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 重置按钮 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">4</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">button </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="reset"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="重置"</span><span style="color: #0000ff;">></span>重置<span style="color: #0000ff;"></</span><span style="color: #800000;">button</span><span style="color: #0000ff;">></span>
  • select标签和option标签下拉列表 
    <span style="color: #008080;"> 1</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 单选菜单列表框 </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 2</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">select </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="user"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 3</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="1"</span><span style="color: #0000ff;">></span>ray<span style="color: #0000ff;"></</span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 4</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="2"</span><span style="color: #ff0000;"> selected</span><span style="color: #0000ff;">="selected"</span><span style="color: #0000ff;">></span>raykaeso<span style="color: #0000ff;"></</span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 5</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">select</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 6</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 多选列表下拉框，shift加鼠标单击，可以连续选择多个选择，CTRL+鼠标点击，可以点击多个。</span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 7</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">select </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="user"</span><span style="color: #ff0000;"> size</span><span style="color: #0000ff;">="10"</span><span style="color: #ff0000;"> multiple</span><span style="color: #0000ff;">="multiple"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 8</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="1"</span><span style="color: #0000ff;">></span>雷雪松<span style="color: #0000ff;"></</span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 9</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="2"</span><span style="color: #ff0000;"> selected</span><span style="color: #0000ff;">="selected"</span><span style="color: #0000ff;">></span>ray<span style="color: #0000ff;"></</span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">10</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="3"</span><span style="color: #0000ff;">></span>raykaeso<span style="color: #0000ff;"></</span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">11</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">select</span><span style="color: #0000ff;">></span>

    注: selected=”selected” は、選択されたことを意味する selected と省略できます

4. その他の HTML に関する事項

  1. HTML タグと属性は大文字と小文字を区別しません。HTML タグと属性は小文字にすることをお勧めします。属性値は二重引用符で囲む必要があります。
  2. HTML タグはすべて開始タグで始まり、終了タグで終わります。ほとんどの HTML タグは、p タグや div タグなどの二重タグと呼ばれるペアで表示されます。開始タグで終わる一部の HTML タグは、hr タグや br タグなど、単一タグと呼ばれます。ほとんどの HTML 要素は属性を持つことができ、テキスト コンテンツは開始タグと終了タグの間に書き込まれます。
  3. HTML タグをインデントして改行し、読みやすく保守しやすいようにコードの各行が長すぎないようにしてください。
  4. HTML タグの使用は、タグのネスト ルールに準拠する必要があります。タグが a タグをネストしたり、p タグが div タグをネストしたりすることは禁止されています。
  5. 時代遅れまたは非推奨の HTML タグを使用せず、テーブル レイアウト、iframe フレームのネスト、および Flash Player の使用を減らすことをお勧めします。

五、表格、表单实例

<span style="color: #008080;"> 1</span> <span style="color: #0000ff;"><!</span><span style="color: #ff00ff;">DOCTYPE html</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 2</span> <span style="color: #0000ff;"><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 3</span> <span style="color: #0000ff;"><span style="color: #800000;">頭</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 4</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">メタ</span><span style="color: #ff0000;">charset</span><span style="color: #0000ff;">="utf-8"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 5</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">メタ</span><span style="color: #ff0000;">http-equiv</span><span style="color: #0000ff;">="X-UA互換"</span><span style="color: #ff0000;">コンテンツ</span><span style="color: #0000ff;">="IE=edge,chrome=1"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 6</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">タイトル</span><span style="color: #0000ff;">></span>例<span style="color: #0000ff;"></</span><span style="color: #800000;">タイトル</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 7</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">メタ</span><span style="color: #ff0000;">名前</span><span style="color: #0000ff;">="説明"</span><span style="color: #ff0000;">コンテンツ</span><span style="color: #0000ff;">=""</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 8</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">メタ</span><span style="color: #ff0000;">名前</span><span style="color: #0000ff;">="キーワード"</span><span style="color: #ff0000;">コンテンツ</span><span style="color: #0000ff;">=""</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 9</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">リンク</span><span style="color: #ff0000;">href</span><span style="color: #0000ff;">=""</span><span style="color: #ff0000;"> rel</span><span style="color: #0000ff;">="スタイルシート"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">10</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">頭</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">11</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">ボディ</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">12</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">フォーム</span><span style="color: #ff0000;">メソッド</span><span style="color: #0000ff;">="POST"</span><span style="color: #ff0000;">アクション</span><span style="color: #0000ff;">="1.php"</span><span style="color: #ff0000;"> enctype</span><span style="color: #0000ff;">="multipart/form-data"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">13</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">テーブル</span><span style="color: #ff0000;">border</span><span style="color: #0000ff;">="1"</span><span style="color: #ff0000;"> bordercolor</span><span style="color: #0000ff;">="#F4F4F4"</span><span style="color: #ff0000;">幅</span><span style="color: #0000ff;">="560"</span><span style="color: #ff0000;">整列</span><span style="color: #0000ff;">="center" </span><span style="color: #ff0000;">セルパディング</span> <span style="color: #0000ff;">="5"</span><span style="color: #ff0000;">ルール</span><span style="color: #0000ff;">="すべて"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">14</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">caption</span><span style="color: #0000ff;">></span>个人中心<span style="color: #0000ff;"></</span><span style="color: #800000;">caption</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">15</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr </span><span style="color: #ff0000;">bgcolor</span><span style="color: #0000ff;">="#F9F9F9"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">16</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">colspan</span><span style="color: #0000ff;">="3"</span><span style="color: #0000ff;"> >
</span>17<span style="color: #800000;"> </span></<span style="color: #0000ff;"></span>tr<span style="color: #0000ff;"></span>><span style="color: #800000;">
</span>18<span style="color: #0000ff;"> </span><<span style="color: #800000;"></span>tr<span style="color: #0000ff;"></span>><span style="color: #008080;">
</span>19<span style="color: #0000ff;"> </span><<span style="color: #800000;"></span>td <span style="color: #0000ff;"></span>align<span style="color: #008080;"></span>="right"<span style="color: #0000ff;"></span>><span style="color: #800000;">ユーザー名: </span></<span style="color: #0000ff;"></span>td<span style="color: #008080;"></span>><span style="color: #0000ff;">
</span>20<span style="color: #800000;"> </span><<span style="color: #ff0000;"></span>td<span style="color: #0000ff;"></span>><<span style="color: #0000ff;"></span>input <span style="color: #0000ff;"></span>type<span style="color: #800000;"></span>="text"<span style="color: #0000ff;"></span> name<span style="color: #008080;"></span>="ユーザー名"<span style="color: #0000ff;"></span> maxlength<span style="color: #800000;"></span>="15"<span style="color: #0000ff;"> </span>無効化されました<span style="color: #800000;"></span> ="無効"<span style="color: #ff0000;"></span>値<span style="color: #0000ff;"></span>="管理者"<span style="color: #ff0000;"></span>></<span style="color: #0000ff;"></span>td<span style="color: #ff0000;"></span>><span style="color: #0000ff;">
</span>21<span style="color: #ff0000;"> </span><<span style="color: #0000ff;"></span>td<span style="color: #ff0000;"></span>><<span style="color: #0000ff;"></span>input <span style="color: #0000ff;"></span>type<span style="color: #800000;"></span>="送信"<span style="color: #0000ff;"></span>値<span style="color: #008080;"></span>="ユーザー名を検出"<span style="color: #0000ff;"></span>><<span style="color: #800000;"></span>フォント<span style="color: #0000ff;"></span>カラー<span style="color: #800000;"> </span>="#0E9EFF"<span style="color: #ff0000;"></span>サイズ<span style="color: #0000ff;"></span>="1"<span style="color: #ff0000;"></span>><span style="color: #0000ff;">5-15人</span></<span style="color: #0000ff;"></span>font<span style="color: #800000;"></span>></<span style="color: #ff0000;"></span>td<span style="color: #0000ff;"></span>><span style="color: #ff0000;">
</span>22<span style="color: #0000ff;"> </span></<span style="color: #0000ff;"></span>tr<span style="color: #0000ff;"></span>><span style="color: #800000;">
</span>23<span style="color: #0000ff;"> </span><<span style="color: #800000;"></span>tr<span style="color: #0000ff;"></span>><span style="color: #008080;">
</span>24<span style="color: #0000ff;"> </span><<span style="color: #800000;"></span>td <span style="color: #0000ff;"></span>align<span style="color: #008080;"></span>="right"<span style="color: #0000ff;"></span>><span style="color: #800000;">パスワード: </span></<span style="color: #0000ff;"></span>td<span style="color: #008080;"></span>><span style="color: #0000ff;">
</span>25<span style="color: #800000;"> </span><<span style="color: #ff0000;"></span>td<span style="color: #0000ff;"></span>><<span style="color: #0000ff;"></span>入力 <span style="color: #0000ff;"></span>type<span style="color: #800000;"></span>="パスワード"<span style="color: #0000ff;"></span> 名前<span style="color: #008080;"></span>="パスワード"<span style="color: #0000ff;"></span> maxlength<span style="color: #800000;"></span>="15"<span style="color: #0000ff;"> </span>></span>td<span style="color: #ff0000;"></span>><span style="color: #0000ff;">
</span>26<span style="color: #ff0000;"> </span><<span style="color: #0000ff;"></span>td<span style="color: #ff0000;"></span>><<span style="color: #0000ff;"></span>フォント<span style="color: #0000ff;"></span>color<span style="color: #800000;"></span>="#0E9EFF"<span style="color: #0000ff;"></span>サイズ<span style="color: #008080;"></span>="1"<span style="color: #0000ff;"></span>><span style="color: #800000;"> パスワード 5-15桁</span>< /<span style="color: #0000ff;"></span>フォント<span style="color: #800000;"></span>><span style="color: #ff0000;"><span style="color: #800000;">TD</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">27</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">28</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">29</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">align</span><span style="color: #0000ff;">="right"</span><span style="color: #0000ff;">></span>パスワードを確認してください: <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">30</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="パスワード"</span><span style="color: #ff0000;">名前</span><span style="color: #0000ff;">="再パスワード"</span><span style="color: #ff0000;">最大長</span><span style="color: #0000ff;">="15" </span><span style="color: #0000ff;">><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">31</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">><</span><span style="color: #800000;">font </span><span style="color: #ff0000;">color</span><span style="color: #0000ff;">="#0E9EFF"</span><span style="color: #ff0000;"> size</span><span style="color: #0000ff;">="1"</span><span style="color: #0000ff;">></span>はパスワードと一致している必要があります<span style="color: #0000ff;">&lt ;/ </span><span style="color: #800000;">フォント</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">32</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">33</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr </span><span style="color: #ff0000;">bgcolor</span><span style="color: #0000ff;">="#F9F9F9"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">34</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">colspan</span><span style="color: #0000ff;">="3"</span><span style="color: #0000ff;">><</span><span style="color: #800000;">b</span><span style="color: #0000ff;">></span>2.基本情報<span style="color: #0000ff;"></</span><span style="color: #800000;">b</span><span style="color: #0000ff;">&g t;< / </span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">35</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">36</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">37</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">align</span><span style="color: #0000ff;">="right"</span><span style="color: #0000ff;">></span>性別: <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">38</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">><</span><span style="color: #800000;">入力</span><span style="color: #ff0000;">タイプ</span><span style="color: #0000ff;">="ラジオ"</span><span style="color: #ff0000;">名前</span><span style="color: #0000ff;">="性別"</span><span style="color: #ff0000;">値</span><span style="color: #0000ff;">="男性"</span> <span style="color: #ff0000;">チェックしました</span><span style="color: #0000ff;"> ="チェック済み"</span><span style="color: #0000ff;">></span>男性<span style="color: #0000ff;"><</span><span style="color: #800000;">入力</span><span style="color: #ff0000;">タイプ</span><span style="color: #0000ff;">="ラジオ"</span><span style="color: #ff0000;">名前</span><span style="color: #0000ff;">="性別"</span><span style="color: #ff0000;">値</span><span style="color: #0000ff;">="女性"</span><span style="color: #0000ff;">></span>女<span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">39</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">40</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">41</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">align</span><span style="color: #0000ff;">="right"</span><span style="color: #0000ff;">></span>趣味: <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">42</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">43</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">入力</span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="チェックボックス"</span><span style="color: #ff0000;">名前</span><span style="color: #0000ff;">="like[]"</span><span style="color: #ff0000;">値</span><span style="color: #0000ff;">="ゲーム"</span><span style="color: #ff0000;">チェック済み</span><span style="color: #0000ff;">="チェック済み"</span> / > <span style="color: #0000ff;"></span>ゲーム
<span style="color: #000000;"></span>44<span style="color: #008080;"> </span><<span style="color: #0000ff;"></span>input <span style="color: #800000;"></span>type<span style="color: #ff0000;"></span>="チェックボックス"<span style="color: #0000ff;"></span> name<span style="color: #ff0000;"></span>="like[]"<span style="color: #0000ff;"></span> value<span style="color: #ff0000;"></span>="kill"<span style="color: #0000ff;"> </span>/><span style="color: #0000ff;"></span>kill
<span style="color: #000000;"></span>45<span style="color: #008080;"> </span><<span style="color: #0000ff;"></span>input <span style="color: #800000;"></span>type<span style="color: #ff0000;"></span>="チェックボックス"<span style="color: #0000ff;"></span> name<span style="color: #ff0000;"></span>="like[]"<span style="color: #0000ff;"></span> value<span style="color: #ff0000;"></span>="set fire"<span style="color: #0000ff;"> </span>/><span style="color: #0000ff;"></span>set fire
<span style="color: #000000;"></span>46<span style="color: #008080;"> </span><<span style="color: #0000ff;"></span>input <span style="color: #800000;"></span>type<span style="color: #ff0000;"></span>="チェックボックス"<span style="color: #0000ff;"></span> name<span style="color: #ff0000;"></span>="like[]"<span style="color: #0000ff;"></span> value<span style="color: #ff0000;"></span>="本を読む"<span style="color: #0000ff;"> </span>/><span style="color: #0000ff;">本を読む</span><<span style="color: #0000ff;"></span>br<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>52<span style="color: #008080;"> </span></<span style="color: #0000ff;"></span>td<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>53<span style="color: #008080;"> </span><<span style="color: #0000ff;"></span>td<span style="color: #800000;"></span>></<span style="color: #0000ff;"></span>td<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>54<span style="color: #008080;"> </span></<span style="color: #0000ff;"></span>tr<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>55<span style="color: #008080;"> </span><<span style="color: #0000ff;"></span>tr<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>56<span style="color: #008080;"> </span><<span style="color: #0000ff;"></span>td <span style="color: #800000;"></span>align<span style="color: #ff0000;"></span>="right"<span style="color: #0000ff;"></span>><span style="color: #0000ff;">教育: </span></<span style="color: #0000ff;"></span>td<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>57<span style="color: #008080;"> </span><<span style="color: #0000ff;"></span>td<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>58<span style="color: #008080;"> </span><<span style="color: #0000ff;"></span>選択<span style="color: #800000;"><span style="color: #ff0000;">名前</span><span style="color: #0000ff;">="教育"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">59</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">オプション</span><span style="color: #ff0000;">値</span><span style="color: #0000ff;">="小学校"</span><span style="color: #0000ff;">></span>小学校<span style="color: #0000ff;"></</span><span style="color: #800000;">オプション</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">60</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">オプション</span><span style="color: #ff0000;">値</span><span style="color: #0000ff;">="中学校"</span><span style="color: #0000ff;">></span>中学校<span style="color: #0000ff;"></</span><span style="color: #800000;">オプション</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">61</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">オプション</span><span style="color: #ff0000;">値</span><span style="color: #0000ff;">="高校"</span><span style="color: #0000ff;">></span>高校<span style="color: #0000ff;"></</span><span style="color: #800000;">オプション</span><span style="color: #0000ff;">></span>
&62<span style="color: #008080;"> & lt; </span><span style="color: #0000ff;">オプション </span><span style="color: #800000;">値</span><span style="color: #ff0000;"> = "大学" </span><span style="color: #0000ff;"> 選択済み</span><span style="color: #ff0000;"> = "選択" </span><span style="color: #0000ff;"> & gt;
</span>63<span style="color: #0000ff;"> </span><<span style="color: #0000ff;"></span>オプション<span style="color: #800000;"></span>値<span style="color: #0000ff;"></span>="大学院生"<span style="color: #008080;"></span>><span style="color: #0000ff;">大学院生</span></<span style="color: #800000;"></span>オプション<span style="color: #ff0000;"></span>><span style="color: #0000ff;">
</span>64<span style="color: #0000ff;"> </span></<span style="color: #0000ff;"></span>選択<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>65<span style="color: #008080;"> </span></<span style="color: #0000ff;"></span>td<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>66<span style="color: #008080;"> </span><<span style="color: #0000ff;"></span>td<span style="color: #800000;"></span>></<span style="color: #0000ff;"></span>td<span style="color: #008080;"></span>><span style="color: #0000ff;">
</span>67<span style="color: #800000;"> </span></<span style="color: #0000ff;"></span>tr<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>68<span style="color: #008080;"> </span><<span style="color: #0000ff;"></span>tr <span style="color: #800000;"></span>bgcolor<span style="color: #0000ff;"></span>="#F9F9F9"<span style="color: #008080;"></span>><span style="color: #0000ff;">
</span>69<span style="color: #800000;"> </span><<span style="color: #ff0000;"></span>td <span style="color: #0000ff;"></span>colspan<span style="color: #0000ff;"></span>="3"<span style="color: #008080;"></span>><<span style="color: #0000ff;"></span>b<span style="color: #800000;"></span>><span style="color: #ff0000;">3.自己紹介</span></<span style="color: #0000ff;"></span>b<span style="color: #0000ff;"></span>&g t;< / <span style="color: #800000;"></span>td<span style="color: #0000ff;"></span>><span style="color: #0000ff;">
</span>70<span style="color: #800000;"> </span></<span style="color: #0000ff;"></span>tr<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>71<span style="color: #008080;"> </span><<span style="color: #0000ff;"></span>tr<span style="color: #800000;"></span>><span style="color: #0000ff;">
</span>72<span style="color: #008080;"> </span><<span style="color: #0000ff;"></span>td <span style="color: #800000;"></span>algi<span style="color: #0000ff;"></span>="right"<span style="color: #008080;"></span>><span style="color: #0000ff;">パーソナライズされた署名: </span></<span style="color: #800000;"></span>td<span style="color: #ff0000;"></span>><span style="color: #0000ff;">
</span>73<span style="color: #0000ff;"> </span><<span style="color: #0000ff;"><span style="color: #800000;">td</span><span style="color: #0000ff;">><</span><span style="color: #800000;">textarea </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="qianming"</span><span style="color: #ff0000;">cols</span><span style="color: #0000ff;">="40"</span><span style="color: #ff0000;">行</span><span style="color: #0000ff;">="10"</span><span style="color: #ff0000;">スタイル</span><span style="color: #0000ff;">="サイズ変更:なし" </span> <span style="color: #0000ff;">></</span><span style="color: #800000;">テキストエリア</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">74</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">75</span> <span style="color: #0000ff;"></span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">76</span> <span style="color: #0000ff;"><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">77</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">align</span><span style="color: #0000ff;">="right"</span><span style="color: #0000ff;">></span>上传头画像：<span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">78</span> <span style="color: #0000ff;"><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">79</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">入力</span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="ファイル"</span><span style="color: #ff0000;">名前</span><span style="color: #0000ff;">="touxiang"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">80</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">入力</span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="hidden"</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="uid"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="90"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">81</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">82</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">83</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">84</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">85</span> <span style="color: #0000ff;"><span style="color: #0000f"></span></span></span></span></span></span></span>
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：URLを入力してページの読み込みが完了し、ページが表示されるまでのプロセスはどうなるのでしょうか？次の記事：URLを入力してページの読み込みが完了し、ページが表示されるまでのプロセスはどうなるのでしょうか？

関連記事

続きを見る