Q2： HTML中的标签和元素的区别详解
比如
这就是一个标签；
这里是内容
这就是一个元素，也就是说元素由一个开始的标签和结束的标签组成，用来包含某些内容；
这里有一个值得注意的例外，即
本身既是开始标签也是结束标签，但不包含任何内容，所以这只是个标签。
1. 元素：
HTML网页实际上就是由许许多多各种各样的HTML元素构成的文本文件，并且任何网页浏览器都可以直接运行HTML文件。所以可以这样说，HTML元素就是构成HTML文件的基本对象，HTML元素可以说是一个统称而已。HTML元素就是通过使用HTML标签进行定义的。
2. 标签：
标签就是、<body>、
等被尖括号“<”和“>”包起来的对象，绝大部分的标签都是成对出现的，如、。当然还有少部分不是成对出现的，如
、
等。
标签就是用来标记HTML元素的。位于起始标签和结束标签之间的文本就是HTML元素的内容。
3.
属性：
为HTML元素提供各种附加信息的就是HTML属性，它总是以"属性名=属性值"这种名值对的形式出现，而且属性总是在HTML元素的开始标签中进行定义。
示例：
示例标题
<bodybgcolor="red">
这是示例页面
在这个示例中，
这是示例页面
就是HTML元素，其中“这是示例页面”就是元素的具体内容了。
<body>等就是HTML标签，这是标签构成了HTML元素。 <body <br />bgcolor="red">中的bgcolor="red"就是标签的属性，它定义了标签应该如何具体配置。 <br />总之，元素和标签的区别也不必太在意，实际工作中我们都直接以标签统称。而属性就很容易明白了， 它就是为HTML标签添加各种附加信息或者配置选项的参数。<br /></p>Www.JiZHUBA.c∴om</p> </div> </div> <div class="wendadetail_leftlist"> <div class="wendadetail_leftlist_r"> <p> <b><a href="#" name="3">Q3</a>： html行级元素和块级元素标签列表分别有哪些</b> </p> <p class="wendadetail_list_con"> <p>行内元素列表:<br /><a>标签可定义锚<br /><abbr>表示一个缩写形式<br /><acronym>定义只取首字母缩写<br /><b>字体加粗<br /><bdo>可覆盖默认的文本方向<br /><big>大号字体加粗<br /><br>换行<br /><cite>引用进行定义<br /><code>定义计算机代码文本<br /><dfn>定义一个定义项目<br /><em>定义为强调的内容<br /><i>斜体文本效果<br /><img>向网页中嵌入一幅图像<br /><input>输入框<br /><kbd>定义键盘文本<br /><label>标签为<br /><input> 元素定义标注（标记）<br /><q>定义短的引用<br /><samp>定义样本文本<br /><select>创建单选或多选菜单<br /><small>呈现小号字体效果<br /><span>组合文档中的行内元素<br /><strong>语气更强的强调的内容<br /><sub>定义下标文本<br /><sup>定义上标文本<br /><textarea>多行的文本输入控件<br /><tt>打字机或者等宽的文本效果<br /><var>定义变量<br />块级元素列表:<br /><address>定义地址<br /><caption>定义表格标题<br /><dd>定义列表中定义条目<br /><div>定义文档中的分区或节<br /><dl>定义列表<br /><dt>定义列表中的项目<br /><fieldset>定义一个框架集<br /><form>创建 HTML 表单<br /><h1>定义最大的标题<br /><h2>定义副标题<br /><h3>定义标题<br /><h4>定义标题<br /><h5>定义标题<br /><h6>定义最小的标题<br /><hr>创建一条水平线<br /><legend>元素为 <br /><fieldset>元素定义标题<br /><li>标签定义列表项目<br /><noframes>为那些不支持框架的浏览器显示文本，于 frameset 元素内部<br /><noscript>定义在脚本未被执行时的替代内容<br /><ol>定义有序列表<br /><ul>定义无序列表<br /><p>标签定义段落<br /><pre>定义预格式化的文本<br /><table>标签定义 HTML 表格<br /><tbody>标签表格主体（正文）<br /><td>表格中的标准单元格<br /><tfoot>定义表格的页脚（脚注或表注）<br /><th>定义表头单元格<br /><thead>标签定义表格的表头<br /><tr>定义表格中的行</p></p> </div> </div> <div class="wendadetail_leftlist"> <div class="wendadetail_leftlist_r"> <p> <b><a href="#" name="4">Q4</a>： html表单元素有哪些</b> </p> <p class="wendadetail_list_con"> <p>一、文本域<br /><input type="text" name="text" value="" /><br />二、密码域<br />密码跟文本框类似，但是在里面输入的内容显示为圆点。<br /><input type="password" name="text" value="" /><br />三、单选按钮<br />男人:<input type="radio" name="sex" value="http://cache.baiducontent.com/male" /> Male<br /><br /><br />女人：<input type="radio" name="sex" value="http://cache.baiducontent.com/female" /> Female<br />四、复选框<br /><input type="checkbox" name="check1" value="" /><br />五、按钮<br /><input type="button" value="http://cache.baiducontent.com/确认" /><br />六、重置按钮<br />当点击重置按钮时，重置按钮所在的表单将全部清空，而其他表单不受影响。<br /><input type="reset" value="http://cache.baiducontent.com/重置" /><br />七、提交按钮<br />当点击提交按钮时，浏览器将自动提交表单。<br /><input type="submit" value="http://cache.baiducontent.com/提交" /><br />八、隐藏域<br />隐藏域在浏览器中并不显示，仅仅为保存一些不太重要的资料而存在。<br /><input type="hidden" value="http://cache.baiducontent.com/我是一个隐藏域" /><br />九、上传域<br /><input type="file" value="" /><br />十、图片按钮<br /><input type="image" src="http://cache.baiducontent.com/123.gif" /><br />十一、下拉列表<br /><select><br /><option value="http://cache.baiducontent.com/0">0</option><br /><option value="http://cache.baiducontent.com/1">1</option><br /><option value="http://cache.baiducontent.com/2">2</option><br /></select><br /><br />属性可选值说明<br />disabled<br />disabled规定禁用该下拉列表。<br />multiplemultiple规定可选择多个选项。<br />namename规定下拉列表的名称。<br />sizenumber规定下拉列表中可见选项的数目。<br />十二、label<br />label 元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。例如，当将单选按钮放在label内。则点击label内的文字也会触发单选按钮，而不必只是点中小圆点。<br /><p><label><input type="radio" name="male" />男人</label></p><br /><p><label><input type="radio" name="male" />女人</label></p><br />男人女人<br />也可以写成这样<br /><form><br /><label for="male">Male</label><br /><input type="radio" name="sex" id="male" /><br /><br /><br /><label for="female">Female</label><br /><input type="radio" name="sex" id="female" /><br /></form><br />十三、disabled与readonly<br />禁用和只读属性。readonly只针对input(text / password)和textarea有效，而disabled对于所有的表单元素都有效，包括select, radio, checkbox, button等。但是表单元素在使用了disabled后，当我们将表单以POST或GET的方式提交的话，这个元素的值不会被传递出去，而readonly会将该值传递出去。<br />可以在用户按了提交按钮后，利用javascript将提交按钮disabled掉，这样可以防止网络条件比较差的环境下，用户反复点提交按钮导致数据冗余地存入数据库。<br /><form id="form1" action="/home/index" method="post"><br />禁用文本框：<input type="text" disabled="disabled" /><br />只读文本框: <input type="text" readonly="readonly" /><br /></form><br /> 十四、TextArea<br />属性<br />值<br />描述<br />DTD<br />colsnumber规定文本区内的可见宽度。STF<br />rowsnumber规定文本区内的可见行数。STF<br /><form id="form1" action="/home/index" method="post"><br /><textarea cols="10" rows="10">我是一个兵，来自老百姓。</textarea><br /></form><br />十五、fieldset定义域<br />fieldset用于给表单元素分组，legend用于设置分组标题</p></p> </div> </div> <div class="wendadetail_leftlist"> <div class="wendadetail_leftlist_r"> <p> <b><a href="#" name="5">Q5</a>： html常用的表单控件类型有哪些</b> </p> <p class="wendadetail_list_con"> <p>文本字段 text<br />密码 password<br />隐藏域 hidden<br />文本区域 textarea<br />复选框 checkbox<br />单选按钮 radio<br />选择列表 select<br />图像域 image<br />文件域 file<br />按钮 button <br />提交按钮 submit<br /> <br />大致就是这些。</p></p> </div> </div> </div>
</div>
</div>
<div class="rich_media_tool" id="js_toobar3">
<p class="m10"><b>小提示：</b>内容仅供参考，如果您需解决具体问题(尤其法律、医学等领域)，建议您详细咨询相关领域专业人士。</p>
</div>
</div>
<div class="tit02"><h2>相关文章</h2></div>
<div class="ralatenews">
<ul class="catepic_left">
<li class="paddtp">
</li>
</ul>
</div>
<mip-tuijian-baidu site-id="56ad151eca42ee56480e2874cc4349a2" plan-id="122476"></mip-tuijian-baidu>
<div id="hm_t_122476"></div>
</div>
<div>
<div class="mobile_sub_header row">
<div class="mobile_sub_header_buttons">
<ul>
<li class="mobile_sub_header_button br5 inbox">
<a href="/shishangmeirong/" rel="nofollow">时尚·美容</a>
</li>
<li class="mobile_sub_header_button br5 inbox">
<a href="/kejiyouxi/" rel="nofollow">科技·游戏</a>
</li>
<li class="mobile_sub_header_button br5 inbox">
<a href="/jiankangyangsheng/" rel="nofollow">健康·养生</a>
</li>
<li class="mobile_sub_header_button br5 inbox">
<a href="/yundonghuwai/" rel="nofollow">运动·户外</a>
</li>
<li class="mobile_sub_header_button br5 inbox">
<a href="/shenghuojiaju/" rel="nofollow">生活·家居</a>
</li>
<li class="mobile_sub_header_button br5 inbox">
<a href="/muyingjiaoyu/" rel="nofollow">母婴·教育</a>
</li>
<li class="mobile_sub_header_button br5 inbox">
<a href="/qingganjiaoji/" rel="nofollow">情感·交际</a>
</li>
<li class="mobile_sub_header_button br5 inbox">
<a href="/zhichanglicai/" rel="nofollow">职场·理财</a>
</li>
<li class="mobile_sub_header_button br5 inbox">
<a href="/meishiyingyang/" rel="nofollow">美食·营养</a>
</li>
<li class="mobile_sub_header_button br5 inbox">
<a href="/shougongaihao/" rel="nofollow">手工·爱好</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="mobile_footer" id="footer">
<ul class="mobile_footer_options">
<li>
<a href="http://jl.cnr.cn/lvy/20190702/t20190702_524676535.html" rel="nofollow">亚博</a>
</li>
<li><a href="/">首页</a></li>
<li><a href="/benmingnian/">本命年</a></li>
<li class="full_site"><a href="#top" target="_self">返回顶部</a></li>
</ul>
</div>
</div>
<mip-fixed type="gototop">
<mip-gototop></mip-gototop>
</mip-fixed>
<mip-stats-baidu>
<script type="application/json">
{
"token": "868fa19c39e9d50162f0b50d0b3052d3",
"_setCustomVar": [1, "login", "1", 2],
"_setAutoPageview": [true]
}
</script>
</mip-stats-baidu>
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?868fa19c39e9d50162f0b50d0b3052d3";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
<script src="https://mipcache.bdstatic.com/static/v1/mip.js"></script>
<script src="https://mipcache.bdstatic.com/static/v1/mip-stats-baidu/mip-stats-baidu.js"></script>
<script src="https://mipcache.bdstatic.com/static/v1/mip-gototop/mip-gototop.js"></script>
<script src="https://c.mipcdn.com/extensions/platform/v1/mip-cambrian/mip-cambrian.js"></script>
<script src="https://mipcache.bdstatic.com/static/v1/mip-ad/mip-ad.js"></script>
<script src="https://c.mipcdn.com/static/v1/mip-showmore/mip-showmore.js"></script>
<p>声明：本文由网友整理有关html元素类型,web页面html元素类型的内容，如因分享而侵犯到您的合法权益，请联系我们删除。</p>
</body>
</html>