程序员的知识教程库

网站首页 > 教程分享 正文

前端学习之路--重学开始 (一)

henian88 2025-02-24 16:31:16 教程分享 12 ℃ 0 评论

今天是2022年第一天,站在2022年的开始回首整个2021年并没有发现自己有很大的进步。2022年一定要行动起来,丰富自己。

2022年给自己定几个目标:

  1. 重新学习前端之路
  2. 搭建一个自己的博客网站 ---每周发送一至两篇文章记录自己重新学习前端之路
  3. 培养自己一个爱好
  4. 减肥
  5. 带老婆出去旅游一趟
  6. 每月读一本书

重学之路从HTML开始

HTML简介

HTML的全称为超文本标记语言,是一种标记语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字,图形、动画、声音、表格、链接等 HTML历史上有如下版本: ①HTML 1.0:在1993年6月作为互联网工程工作小组(IETF)工作草案发布。 ②HTML 2.0:1995年1 1月作为RFC 1866发布,于2000年6月发布之后被宣布已经过时。 ③HTML 3.2:1997年1月14日,W3C推荐标准。 ④HTML 4.0:1997年12月18日,W3C推荐标准。 ⑤HTML 4.01(微小改进):1999年12月24日,W3C推荐标准。 ⑥HTML 5:HTML5是公认的下一代Web语言,极大地提升了Web在富媒体、富内容和富应用等方面的能力,被喻为终将改变移动互联网的重要推手。Internet Explorer 8及以前的版本不支持 `

HTML 标记标签通常被称为 HTML 标签 (HTML tag) <标签>内容

HTML 元素包含了开始标签与结束标签,元素的内容是开始标签与结束标签之间的内容,元素属性是 HTML 元素提供的附加信息。

HTML基础结构

文档声明头

 声明为 HTML5 文档

页面的根元素

 元素是 HTML 页面的根元素

头部标记

 元素包含了文档的元(meta)数据,如  定义网页编码格式为 utf-8。

浏览器标签名

 元素描述了文档的标题,浏览器标签名,通常放到head里面</code></pre><h1 class="pgc-h-arrow-right" data-track="23">页面主体</h1><pre class="prism-highlight prism-language-bash" class="syl-page-code"><code><body> 元素包含了可见的页面内容</code></pre><h1 class="pgc-h-arrow-right" data-track="25">常见的标签</h1><h1 class="pgc-h-arrow-right" data-track="26">块级元素</h1><p data-track="27"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">块级元素只能出现在 </span><span style="color: #A7A7A7; --tt-darkmode-color: #A3A3A3;"><body></span> 元素内。</p><p data-track="28"><strong><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">格式</span></strong></p><p data-track="29"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">默认情况下,块级元素会新起一行。</span></p><p data-track="30"><strong><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">内容模型</span></strong></p><p data-track="31"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">一般块级元素可以包含行内元素和其他块级元素。这种结构上的包含继承区别可以使块级元素创建比行内元素更”大型“的结构。 HTML 标准中块级元素和行内元素的区别至高出现在 4.01 标准中。在 HTML5,这种区别被一个更复杂的内容类别 (en-US)代替。”块级“类别大致相当于 HTML5 中的流内容 (en-US)类别,而”行内“类别相当于 HTML5 中的措辞内容 (en-US)类别,不过除了这两个还有其他类别。</span></p><p data-track="32"><strong><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">标签与描述</span></strong></p><div class="tableWrapper"><div class="syl-table-wrap"><table style="min-width: 112px;"><colgroup><col><col></colgroup><tbody><tr><td><p data-track="33"><strong><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">标签名</span></span></strong></p></td><td><p data-track="34"><strong><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">描述</span></span></strong></p></td></tr><tr><td><p data-track="35" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">address</span></p></td><td><p data-track="36"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">联系方式信息</span></p></td></tr><tr><td><p data-track="37" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">article (HTML5)</span></span></p></td><td><p data-track="38"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">文章内容</span></span></p></td></tr><tr><td><p data-track="39" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">aside (HTML5)</span></p></td><td><p data-track="40"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">伴随内容</span></p></td></tr><tr><td><p data-track="41" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">blockquote</span></span></p></td><td><p data-track="42"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">块引用</span></span></p></td></tr><tr><td><p data-track="43" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">dd</span></p></td><td><p data-track="44"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">定义列表中定义条目描述</span></p></td></tr><tr><td><p data-track="45" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">div</span></span></p></td><td><p data-track="46"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">定义列表中定义条目描述</span></span></p></td></tr><tr><td><p data-track="47" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">dl</span></p></td><td><p data-track="48"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">文章内容</span></p></td></tr><tr><td><p data-track="49" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">fieldset</span></span></p></td><td><p data-track="50"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">表单元素分组</span></span></p></td></tr><tr><td><p data-track="51" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">figcaption (HTML5)</span></p></td><td><p data-track="52"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">图文信息组标题</span></p></td></tr><tr><td><p data-track="53" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">figure (HTML5)</span></span></p></td><td><p data-track="54"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">可附标题内容元素</span></span></p></td></tr><tr><td><p data-track="55" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">footer (HTML5)</span></p></td><td><p data-track="56"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">区段尾或页尾</span></p></td></tr><tr><td><p data-track="57" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">form</span></span></p></td><td><p data-track="58"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">表单</span></span></p></td></tr><tr><td><p data-track="59" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">h1~h6</span></p></td><td><p data-track="60"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">标题</span></p></td></tr><tr><td><p data-track="61" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">header (HTML5)</span></span></p></td><td><p data-track="62"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">页头</span></span></p></td></tr><tr><td><p data-track="63" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">hgroup (HTML5)</span></p></td><td><p data-track="64"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">标题组</span></p></td></tr><tr><td><p data-track="65" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">hr</span></span></p></td><td><p data-track="66"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">分割线</span></span></p></td></tr><tr><td><p data-track="67" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">nav (HTML5)</span></p></td><td><p data-track="68"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">导航</span></p></td></tr><tr><td><p data-track="69" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">noframes</span></span></p></td><td><p data-track="70"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">针对不支持框架的用户的替代内容</span></span></p></td></tr><tr><td><p data-track="71" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">noscript</span></p></td><td><p data-track="72"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">针对不支持客户端脚本的用户的替代内容</span></p></td></tr><tr><td><p data-track="73" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">ol</span></span></p></td><td><p data-track="74"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">有序列表</span></span></p></td></tr><tr><td><p data-track="75" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">p</span></p></td><td><p data-track="76"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">段落</span></p></td></tr><tr><td><p data-track="77" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">section (HTML5)</span></span></p></td><td><p data-track="78"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">一个页面区段</span></span></p></td></tr><tr><td><p data-track="79" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">table</span></p></td><td><p data-track="80"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">表格</span></p></td></tr><tr><td><p data-track="81" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">tbody</span></span></p></td><td><p data-track="82"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">表格中的主体内容</span></span></p></td></tr><tr><td><p data-track="83" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">td</span></p></td><td><p data-track="84"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">表格中的单元</span></p></td></tr><tr><td><p data-track="85" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">tfoot</span></span></p></td><td><p data-track="86"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">表格中的表注内容(脚注)</span></span></p></td></tr><tr><td><p data-track="87" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">th</span></p></td><td><p data-track="88"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">表格中的表头单元格</span></p></td></tr><tr><td><p data-track="89" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">thead</span></span></p></td><td><p data-track="90"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">表格中的表头内容</span></span></p></td></tr><tr><td><p data-track="91" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">time</span></p></td><td><p data-track="92"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">日期/时间</span></p></td></tr><tr><td><p data-track="93" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">tr</span></span></p></td><td><p data-track="94"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">表格中的行</span></span></p></td></tr><tr><td><p data-track="95" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">ul</span></p></td><td><p data-track="96"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">无序列表</span></p></td></tr></tbody></table></div></div><p data-track="97"><br>行内元素</p><p data-track="98"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">一般情况下,行内元素只能包含数据和其他行内元素。</span></p><p data-track="99"><strong><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">格式</span></strong></p><p data-track="100"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">默认情况下,行内元素不会以新行开始,而块级元素会新起一行。</span></p><p data-track="101"><strong><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">标签与描述</span></strong></p><div class="tableWrapper"><div class="syl-table-wrap"><table style="min-width: 112px;"><colgroup><col><col></colgroup><tbody><tr><td><p data-track="102"><strong><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">标签名</span></span></strong></p></td><td><p data-track="103"><strong><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">描述</span></span></strong></p></td></tr><tr><td><p data-track="104" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">a</span></p></td><td><p data-track="105"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">锚</span></p></td></tr><tr><td><p data-track="106" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">abbr</span></span></p></td><td><p data-track="107"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">缩写</span></span></p></td></tr><tr><td><p data-track="108" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">acronym</span></p></td><td><p data-track="109"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">只取首字母的缩写</span></p></td></tr><tr><td><p data-track="110" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">b</span></span></p></td><td><p data-track="111"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">粗体</span></span></p></td></tr><tr><td><p data-track="112" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">bdo</span></p></td><td><p data-track="113"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">文字方向</span></p></td></tr><tr><td><p data-track="114" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">big</span></span></p></td><td><p data-track="115"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">大号文本</span></span></p></td></tr><tr><td><p data-track="116" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">br</span></p></td><td><p data-track="117"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">简单的折行</span></p></td></tr><tr><td><p data-track="118" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">button</span></span></p></td><td><p data-track="119"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">按钮 (push button)</span></span></p></td></tr><tr><td><p data-track="120" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">cite</span></p></td><td><p data-track="121"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">引用(citation)</span></p></td></tr><tr><td><p data-track="122" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">code</span></span></p></td><td><p data-track="123"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">计算机代码文本</span></span></p></td></tr><tr><td><p data-track="124" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">command</span></p></td><td><p data-track="125"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">命令按钮</span></p></td></tr><tr><td><p data-track="126" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">dfn</span></span></p></td><td><p data-track="127"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">项目</span></span></p></td></tr><tr><td><p data-track="128" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">del</span></p></td><td><p data-track="129"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">被删除文本</span></p></td></tr><tr><td><p data-track="130" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">em</span></span></p></td><td><p data-track="131"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">强调文本</span></span></p></td></tr><tr><td><p data-track="132" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">embed</span></p></td><td><p data-track="133"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">外部交互内容或插件</span></p></td></tr><tr><td><p data-track="134" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">i</span></span></p></td><td><p data-track="135"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">斜体字</span></span></p></td></tr><tr><td><p data-track="136" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">img</span></p></td><td><p data-track="137"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">图像</span></p></td></tr><tr><td><p data-track="138" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">input</span></span></p></td><td><p data-track="139"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">输入控件</span></span></p></td></tr><tr><td><p data-track="140" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">kbd</span></p></td><td><p data-track="141"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">键盘文本</span></p></td></tr><tr><td><p data-track="142" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">label</span></span></p></td><td><p data-track="143"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">input 元素的标注</span></span></p></td></tr><tr><td><p data-track="144" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">map</span></p></td><td><p data-track="145"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">图像映射</span></p></td></tr><tr><td><p data-track="146" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">mark</span></span></p></td><td><p data-track="147"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">有记号的文本</span></span></p></td></tr><tr><td><p data-track="148" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">objec</span></p></td><td><p data-track="149"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">内嵌对象</span></p></td></tr><tr><td><p data-track="150" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">progress</span></span></p></td><td><p data-track="151"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">任何类型的任务的进度</span></span></p></td></tr><tr><td><p data-track="152" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">q</span></p></td><td><p data-track="153"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">短的引用</span></p></td></tr><tr><td><p data-track="154" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">samp</span></span></p></td><td><p data-track="155"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">计算机代码样本</span></span></p></td></tr><tr><td><p data-track="156" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">select</span></p></td><td><p data-track="157"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">选择列表(下拉列表)</span></p></td></tr><tr><td><p data-track="158" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">small</span></span></p></td><td><p data-track="159"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">小号文本</span></span></p></td></tr><tr><td><p data-track="160" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">span</span></p></td><td><p data-track="161"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">文档中的节</span></p></td></tr><tr><td><p data-track="162" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">strong</span></span></p></td><td><p data-track="163"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">强调文本</span></span></p></td></tr><tr><td><p data-track="164" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">sub</span></p></td><td><p data-track="165"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">下标文本</span></p></td></tr><tr><td><p data-track="166" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">sup</span></span></p></td><td><p data-track="167"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">上标文本</span></span></p></td></tr><tr><td><p data-track="168" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">textarea</span></p></td><td><p data-track="169"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">多行的文本输入控件</span></p></td></tr><tr><td><p data-track="170" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">time</span></span></p></td><td><p data-track="171"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">日期/时间</span></span></p></td></tr><tr><td><p data-track="172" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">tt</span></p></td><td><p data-track="173"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">打字机文本</span></p></td></tr><tr><td><p data-track="174" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">var</span></span></p></td><td><p data-track="175"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">文本的变量部分</span></span></p></td></tr><tr><td><p data-track="176" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">video</span></p></td><td><p data-track="177"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">视频</span></p></td></tr><tr><td><p data-track="178" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">wbr</span></span></p></td><td><p data-track="179"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">可能的换行符</span></span></p></td></tr></tbody></table></div></div><h1 class="pgc-h-arrow-right" data-track="180">行内块元素</h1><p data-track="181"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">行内块状元素综合了行内元素和块状元素的特性,但是各有取舍。因此行内块状元素在日常的使用中,由于其特性,使用的次数也比较多。</span></p><p data-track="182"><strong><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">格式</span></strong><span style="color: #333333; --tt-darkmode-color: #A3A3A3;"> 默认情况下,行内元素不会以新行开始,能够识别宽高</span></p><p data-track="183"><strong><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">标签与描述</span></strong></p><div class="tableWrapper"><div class="syl-table-wrap"><table style="min-width: 112px;"><colgroup><col><col></colgroup><tbody><tr><td><p data-track="184"><strong><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">标签名</span></span></strong></p></td><td><p data-track="185"><strong><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">描述</span></span></strong></p></td></tr><tr><td><p data-track="186" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">img</span></p></td><td><p data-track="187"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">图片</span></p></td></tr><tr><td><p data-track="188" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">input</span></span></p></td><td><p data-track="189"><span style="color: #333333; --tt-darkmode-color: #B3B3B3;"><span style="background-color: #F8F8F8; --tt-darkmode-bgcolor: #191919;">输入框</span></span></p></td></tr><tr><td><p data-track="190" class="syl-line-pure-english"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">textarea</span></p></td><td><p data-track="191"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">多行文本</span></p></td></tr></tbody></table></div></div><h1 class="pgc-h-arrow-right" data-track="192">相互之间的转换</h1><ol start="1"><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">块级标签转换为行内标签:display:inline;</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">行内标签转换为块级标签:display:block;</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">转换为行内块标签:display:inline-block;</span></li></ol><h1 class="pgc-h-arrow-right" data-track="196">常?的meta标签</h1><p data-track="197"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">meta 标签由 name 和 content 属性定义,用来描述网页文档的属性,比如网页的作者,网页描述,关键词等,除了HTTP标准固定了一些name作为大家使用的共识,开发者还可以自定义name。</span></p><p data-track="198"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">常用的meta标签:</span></p><ol start="1"><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">charset,用来描述HTML文档的编码类型:</span></li></ol><pre class="prism-highlight prism-language-bash" class="syl-page-code"><code><meta charset="UTF-8" ></code></pre><ol start="2"><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">keywords,页面关键词:</span></li></ol><pre class="prism-highlight prism-language-bash" class="syl-page-code"><code><meta name="keywords" content="关键词" /></code></pre><ol start="3"><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">description,页面描述:</span></li></ol><pre class="prism-highlight prism-language-bash" class="syl-page-code"><code><meta name="description" content="页面描述内容" /></code></pre><ol start="4"><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">refresh,页面重定向和刷新:</span></li></ol><pre class="prism-highlight prism-language-bash" class="syl-page-code"><code><meta http-equiv="refresh" content="0;url=" /></code></pre><ol start="5"><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">viewport,适配移动端,可以控制视口的大小和比例:</span></li></ol><pre class="prism-highlight prism-language-bash" class="syl-page-code"><code><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"></code></pre><ol start="6"><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">搜索引擎索引方式:</span></li></ol><pre class="prism-highlight prism-language-bash" class="syl-page-code"><code><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"></code></pre><h1 class="pgc-h-arrow-right" data-track="211">相关面试题</h1><h1 class="pgc-h-arrow-right" data-track="212">HTML5有哪些更新</h1><ol start="1"><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">新增语义化标签:nav、header、footer、aside、section、article</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">音频、视频标签:audio、video</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">数据存储:localStorage、sessionStorage</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">canvas(画布)、Geolocation(地理定位)、websocket(通信协议)</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">input标签新增属性:placeholder、autocomplete、autofocus、required</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">history API:go、forward、back、pushstate</span></li></ol><p data-track="219"><strong><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">移除的元素有</span></strong></p><p data-track="220"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">纯表现的元素:basefont,big,center,font, s,strike,tt,u;</span></p><p data-track="221"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">对可用性产生负面影响的元素:frame,frameset,noframes;</span></p><h1 class="pgc-h-arrow-right" data-track="222">对HTML语义化的理解</h1><p data-track="223"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">语义化是指根据内容的结构化(内容语义化),选择合适的标签(代码语义化)。通俗来讲就是用正确的标签做正确的事情。 语义化的优点如下:</span></p><ol start="1"><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">有利于SEO,有利于搜索引擎爬虫;</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">增强了可读性,结构更加清晰,便于团队的开发与维护。</span></li></ol><h1 class="pgc-h-arrow-right" data-track="226">常?的meta标签有哪些</h1><p data-track="227"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">参考上文</span></p><h1 class="pgc-h-arrow-right" data-track="228">行内元素有哪些?块级元素有哪些?</h1><p data-track="229"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">参考上文</span></p><h1 class="pgc-h-arrow-right" data-track="230">head 标签有什么作用,其中什么标签必不可少?</h1><p data-track="231"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">head 标签用于定义文档的头部,它是所有头部元素的容器。 head 中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等。 文档的头部描述了文档的各种属性和信息,包括文档的标题、在 Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。 下面这些标签可用在 head 部分:base, link, meta, script, style, title 其中 title 定义文档的标题,它是 head 部分中唯一必需的元素。</span></p><h1 class="pgc-h-arrow-right" data-track="232">DOCTYPE(?档类型) 的作?</h1><p data-track="233"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">DOCTYPE是HTML5中一种标准通用标记语言的文档类型声明,它的目的是告诉浏览器(解析器)应该以什么样(html或xhtml)的文档类型定义来解析文档,不同的渲染模式会影响浏览器对 CSS 代码甚? JavaScript 脚本的解析。它必须声明在HTML?档的第??。 浏览器渲染页面的两种模式(可通过document.compatMode获取,比如,语雀官网的文档类型是CSS1Compat):</span></p><ol start="1"><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">CSS1Compat:标准模式(Strick mode),默认模式,浏览器使用W3C的标准解析渲染页面。在标准模式中,浏览器以其支持的最高标准呈现页面。</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">BackCompat:怪异模式(混杂模式)(Quick mode),浏览器使用自己的怪异模式解析渲染页面。在怪异模式中,页面以一种比较宽松的向后兼容的方式显示。</span></li></ol><h1 class="pgc-h-arrow-right" data-track="236">src和href的区别</h1><p data-track="237"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">src 用于替换当前元素,href 用于在当前文档和引用资源之间确立联系。</span></p><p data-track="238"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">src 是 source 的缩写,指向外部资源的位置,指向的内容将会嵌入到文档中当前标签所在位置;在请求 src 资源时会将其指向的资源下载并应用到文档内,例如 js 脚本,img 图片和 frame 等元素。 href 是 Hypertext Reference 的缩写,指向网络资源所在位置,建立和当前元素(锚点)或当前文档(链接)之间的链接,如果在文档中添加</span></p><h1 class="pgc-h-arrow-right" data-track="239">Canvas和SVG的区别</h1><ol start="1"><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">SVG: SVG可缩放矢量图形(Scalable Vector Graphics)是基于可扩展标记语言XML描述的2D图形的语言,SVG基于XML就意味着SVG DOM中的每个元素都是可用的,可以为某个元素附加Javascript事件处理器。在 SVG 中,每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化,那么浏览器能够自动重现图形。 其特点如下:</span></li></ol><ul><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">不依赖分辨率</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">支持事件处理器</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">最适合带有大型渲染区域的应用程序(比如谷歌地图)</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">复杂度高会减慢渲染速度(任何过度使用 DOM 的应用都不快)</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">不适合游戏应用</span></li></ul><ol start="2"><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">Canvas: Canvas是画布,通过Javascript来绘制2D图形,是逐像素进行渲染的。其位置发生改变,就会重新进行绘制。 其特点如下:</span></li></ol><ul><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">依赖分辨率</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">不支持事件处理器</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">弱的文本渲染能力</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">能够以 .png 或 .jpg 格式保存结果图像</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">最适合图像密集型的游戏,其中的许多对象会被频繁重绘 注:矢量图,也称为面向对象的图像或绘图图像,在数学上定义为一系列由线连接的点。矢量文件中的图形元素称为对象。每个对象都是一个自成一体的实体,它具有颜色、形状、轮廓、大小和屏幕位置等属性。</span></li></ul><h1 class="pgc-h-arrow-right" data-track="252">渐进增强和优雅降级之间的区别</h1><ol start="1"><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">渐进增强(progressive enhancement): 主要是针对低版本的浏览器进行页面重构,保证基本的功能情况下,再针对高级浏览器进行效果、交互等方面的改进和追加功能,以达到更好的用户体验。</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">优雅降级 (graceful degradation): 一开始就构建完整的功能,然后再针对低版本的浏览器进行兼容。</span></li></ol><p data-track="255"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">两者区别:</span></p><ul><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">优雅降级是从复杂的现状开始的,并试图减少用户体验的供给;而渐进增强是从一个非常基础的,能够起作用的版本开始的,并在此基础上不断扩充,以适应未来环境的需要;</span></li><li><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">降级(功能衰竭)意味着往回看,而渐进增强则意味着往前看,同时保证其根基处于安全地带。</span></li></ul><p data-track="258"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">“优雅降级”观点认为应该针对那些最高级、最完善的浏览器来设计网站。而将那些被认为“过时”或有功能缺失的浏览器下的测试工作安排在开发周期的最后阶段,并把测试对象限定为主流浏览器(如 IE、Mozilla 等)的前一个版本。 在这种设计范例下,旧版的浏览器被认为仅能提供“简陋却无妨 (poor, but passable)” 的浏览体验。可以做一些小的调整来适应某个特定的浏览器。但由于它们并非我们所关注的焦点,因此除了修复较大的错误之外,其它的差异将被直接忽略。</span></p><p data-track="259"><span style="color: #333333; --tt-darkmode-color: #A3A3A3;">“渐进增强”观点则认为应关注于内容本身。内容是建立网站的诱因,有的网站展示它,有的则收集它,有的寻求,有的操作,还有的网站甚至会包含以上的种种,但相同点是它们全都涉及到内容。这使得“渐进增强”成为一种更为合理的设计范例。这也是它立即被 Yahoo 所采纳并用以构建其“分级式浏览器支持 (Graded Browser Support)”策略的原因所在。</span></p>
    <div class="info-share-box clearfix">
        <div class="fl">
                        <p class="tags"><strong>Tags:</strong><a href="http://www.henian88.com/tags-628.html" title="查看更多有关于“fieldset”的内容" rel="tag" target="_blank">fieldset</a></p>
                    </div>
                <div class="fr">
                        <div class="info-share">
                <div class="social-share" data-initialized="true">
                    <a href="#" class="social-share-icon iconfont icon-weibo"></a>
                    <a href="#" class="social-share-icon iconfont icon-qq"></a>
                    <a href="#" class="social-share-icon iconfont icon-wechat"></a>
                    <a href="#" class="social-share-icon iconfont icon-qzone"></a>
                </div>
            </div>
            <script src="http://www.henian88.com/zb_users/theme/txcms2/script/social-share.min.js"></script>
                    </div>
            </div>
</div>
<div class="sx mb15">
    <ul>
        <li class="fl">上一篇:            <a href="http://www.henian88.com/post/16208.html" title="Python 爬虫库 urllib 使用详解">Python 爬虫库 urllib 使用详解</a>
                    </li>
        <li class="fr ziyou">下一篇:            <a href="http://www.henian88.com/post/16210.html" title="零基础学习HTML背景表单单选按钮复选框上传文件下拉列表">零基础学习HTML背景表单单选按钮复选框上传文件下拉列表</a>
                    </li>
        <div class="clear"></div>
    </ul>
</div>


<div class="xg">
    <h2 class="ybbt">猜你喜欢</h2>
        <ul>
                <li><span class="">2025-02-24</span><i class="fa fa-caret-right"></i> <a href="http://www.henian88.com/post/16214.html" title="名校内卷新趋势:简历都穿在身上了,985、211真的拼到这一步?">名校内卷新趋势:简历都穿在身上了,985、211真的拼到这一步?</a></li>
                <li><span class="">2025-02-24</span><i class="fa fa-caret-right"></i> <a href="http://www.henian88.com/post/16213.html" title="AOP知识点解析">AOP知识点解析</a></li>
                <li><span class="">2025-02-24</span><i class="fa fa-caret-right"></i> <a href="http://www.henian88.com/post/16212.html" title="破解mdb密码的java程序">破解mdb密码的java程序</a></li>
                <li><span class="">2025-02-24</span><i class="fa fa-caret-right"></i> <a href="http://www.henian88.com/post/16211.html" title="巧用工厂与模板方法模式,优化业务代码">巧用工厂与模板方法模式,优化业务代码</a></li>
                <li><span class="">2025-02-24</span><i class="fa fa-caret-right"></i> <a href="http://www.henian88.com/post/16210.html" title="零基础学习HTML背景表单单选按钮复选框上传文件下拉列表">零基础学习HTML背景表单单选按钮复选框上传文件下拉列表</a></li>
                <li><span class="">2025-02-24</span><i class="fa fa-caret-right"></i> <a href="http://www.henian88.com/post/16208.html" title="Python 爬虫库 urllib 使用详解">Python 爬虫库 urllib 使用详解</a></li>
                <li><span class="">2025-02-24</span><i class="fa fa-caret-right"></i> <a href="http://www.henian88.com/post/16207.html" title="社交软件开发6-客户端开发-ios端开发验证登陆部分">社交软件开发6-客户端开发-ios端开发验证登陆部分</a></li>
                <li><span class="">2025-02-24</span><i class="fa fa-caret-right"></i> <a href="http://www.henian88.com/post/16206.html" title="通义灵码体验">通义灵码体验</a></li>
                <li><span class="">2025-02-24</span><i class="fa fa-caret-right"></i> <a href="http://www.henian88.com/post/16205.html" title="一篇文章带你掌握性能测试工具——Jmeter">一篇文章带你掌握性能测试工具——Jmeter</a></li>
                <li><span class="">2025-02-24</span><i class="fa fa-caret-right"></i> <a href="http://www.henian88.com/post/16204.html" title="一文带你玩转 Spring Batch:超详细使用教程">一文带你玩转 Spring Batch:超详细使用教程</a></li>
            </ul>
</div>
</div>

<div id="comment" class="bgb pd15">

<div class="tx-comments">
        <h4>本文暂时没有评论,来添加一个吧(●'◡'●)</h4>
    

    <label id="AjaxCommentBegin"></label>
    <!--评论输出-->
        
        <label id="AjaxCommentEnd"></label>
</div>
<!--评论框-->

<div class="post tx-comment" id="divCommentPost">
    <h3><a href="javascript:;" id="cancel-reply" style="display:none;float:right;"><small>取消回复</small></a>欢迎 <span class="tx-red">你</span> 发表评论:</h3>
    <form id="frmSumbit" target="_self" method="post" action="http://www.henian88.com/zb_system/cmd.php?act=cmt&postid=16209&key=4ae410d5f86735fd220eb75f362a0a2f" class="clearfix">
        <input type="hidden" name="inpId" id="inpId" value="16209">
        <input type="hidden" name="inpRevID" id="inpRevID" value="0">
                <div class="tx-comment-box tx-comment-ul3"><input type="text" name="inpName" id="inpName" class="text" value="访客" tabindex="1" placeholder="名称(*)"> </div>
                        
                <div class="tx-comment-box tx-comment-textarea">
            <textarea name="txaArticle" id="txaArticle" class="text" cols="50" rows="4" tabindex="5"  placeholder="欢迎在这里交流评论,但是垃圾评论不受欢迎!"></textarea>
            <input name="sumbit" type="submit" tabindex="6" value="提交" onclick="return zbp.comment.post()" class="button">
        </div>
    </form>
</div>
</div>                    
    </div>
    
        <div class="right fr sjwu">
                
<dl class="wupd"> 
    <div class="notice"> 
        <div class="tab-hd"> 
            <ul class="tab-nav"> 
                <li class="on"><a href="javascript:;">最新文章</a></li> 
                <li><a href="javascript:;">热门文章</a></li> 
                <li><a href="javascript:;" class="wux">推荐文章</a></li>
            </ul> 
        </div> 
        <div class="tab-bd"> 
            <div class="tab-pal" style="display:block">
                <ul>
                                        
<li><span class="fr zuo10 f-red">05-14</span><a href="http://www.henian88.com/post/17731.html" title="C#开发串口通信实例及串口基础" target="_blank">C#开发串口通信实例及串口基础</a></li>
<li><span class="fr zuo10 f-red">05-14</span><a href="http://www.henian88.com/post/17730.html" title="C#窗体多线程启动,暂停,继续,取消" target="_blank">C#窗体多线程启动,暂停,继续,取消</a></li>
<li><span class="fr zuo10 f-red">05-14</span><a href="http://www.henian88.com/post/17729.html" title="DotNet 入门:(一)环境安装" target="_blank">DotNet 入门:(一)环境安装</a></li>
<li><span class="fr zuo10 f-red">05-14</span><a href="http://www.henian88.com/post/17728.html" title="C#中使用命名管道进行进程通信的实例" target="_blank">C#中使用命名管道进行进程通信的实例</a></li>
<li><span class="fr zuo10 f-red">05-14</span><a href="http://www.henian88.com/post/17727.html" title="使用C#编程判断某一年是否为闰年" target="_blank">使用C#编程判断某一年是否为闰年</a></li>
<li><span class="fr zuo10 f-red">05-14</span><a href="http://www.henian88.com/post/17726.html" title="C#学习随笔—自定义控件(线,箭头等图形)" target="_blank">C#学习随笔—自定义控件(线,箭头等图形)</a></li>
<li><span class="fr zuo10 f-red">05-14</span><a href="http://www.henian88.com/post/17725.html" title="UE4基础知识总结(三)" target="_blank">UE4基础知识总结(三)</a></li>
<li><span class="fr zuo10 f-red">05-14</span><a href="http://www.henian88.com/post/17724.html" title="C#使用 WinForms 实现打印基础操作" target="_blank">C#使用 WinForms 实现打印基础操作</a></li>
                                    </ul>
            </div>
            <div class="tab-pal">
                <ul>
                                        
<li><span class="fr zuo10">299℃</span><a href="http://www.henian88.com/post/11493.html" title="接口自动化测试TestNG框架环境搭建" target="_blank">接口自动化测试TestNG框架环境搭建</a></li>
<li><span class="fr zuo10">247℃</span><a href="http://www.henian88.com/post/102.html" title="一篇文章带你快速入门createjs(createjs教程)" target="_blank">一篇文章带你快速入门createjs(createjs教程)</a></li>
<li><span class="fr zuo10">244℃</span><a href="http://www.henian88.com/post/11582.html" title="自动化运维开发日志: 升级到DC域控制器" target="_blank">自动化运维开发日志: 升级到DC域控制器</a></li>
<li><span class="fr zuo10">240℃</span><a href="http://www.henian88.com/post/11533.html" title="HTML5+Java全栈开发培训从入门到精通需要多久?" target="_blank">HTML5+Java全栈开发培训从入门到精通需要多久?</a></li>
<li><span class="fr zuo10">239℃</span><a href="http://www.henian88.com/post/11525.html" title="如何入门HTML5?看完这篇从小白变大牛!" target="_blank">如何入门HTML5?看完这篇从小白变大牛!</a></li>
<li><span class="fr zuo10">235℃</span><a href="http://www.henian88.com/post/11556.html" title="网络编程零基础如何入门?10年老司机经验分享" target="_blank">网络编程零基础如何入门?10年老司机经验分享</a></li>
<li><span class="fr zuo10">230℃</span><a href="http://www.henian88.com/post/11527.html" title="怎样才能自学好HTML5?(内附教程&amp;书单)" target="_blank">怎样才能自学好HTML5?(内附教程&amp;书单)</a></li>
<li><span class="fr zuo10">227℃</span><a href="http://www.henian88.com/post/11526.html" title="HTML5教程从入门到精通,随堂笔记(一)HTML5框架结构" target="_blank">HTML5教程从入门到精通,随堂笔记(一)HTML5框架结构</a></li>
                                    </ul>
            </div>
            <div class="tab-pal">
                <ul>
                                        
                                    </ul>
            </div>
        </div> 
    </div>
</dl>
                

<dl class="function" id="divPrevious">
<dt class="function_t">最近发表</dt><dd class="function_c">


<ul><li><a title="C#开发串口通信实例及串口基础" href="http://www.henian88.com/post/17731.html">C#开发串口通信实例及串口基础</a></li>
<li><a title="C#窗体多线程启动,暂停,继续,取消" href="http://www.henian88.com/post/17730.html">C#窗体多线程启动,暂停,继续,取消</a></li>
<li><a title="DotNet 入门:(一)环境安装" href="http://www.henian88.com/post/17729.html">DotNet 入门:(一)环境安装</a></li>
<li><a title="C#中使用命名管道进行进程通信的实例" href="http://www.henian88.com/post/17728.html">C#中使用命名管道进行进程通信的实例</a></li>
<li><a title="使用C#编程判断某一年是否为闰年" href="http://www.henian88.com/post/17727.html">使用C#编程判断某一年是否为闰年</a></li>
<li><a title="C#学习随笔—自定义控件(线,箭头等图形)" href="http://www.henian88.com/post/17726.html">C#学习随笔—自定义控件(线,箭头等图形)</a></li>
<li><a title="UE4基础知识总结(三)" href="http://www.henian88.com/post/17725.html">UE4基础知识总结(三)</a></li>
<li><a title="C#使用 WinForms 实现打印基础操作" href="http://www.henian88.com/post/17724.html">C#使用 WinForms 实现打印基础操作</a></li>
<li><a title="鸿蒙开发:实现popup弹窗" href="http://www.henian88.com/post/17723.html">鸿蒙开发:实现popup弹窗</a></li>
<li><a title="Python+Flet 实现简单的“扫码功能”,举一反三即可更实用" href="http://www.henian88.com/post/17722.html">Python+Flet 实现简单的“扫码功能”,举一反三即可更实用</a></li>
</ul>

</dd>
</dl>
<dl class="function" id="divTags">
<dt class="function_t">标签列表</dt><dd class="function_c">


<ul><li><a title="css导航条" href="http://www.henian88.com/tags-24.html">css导航条<span class="tag-count"> (66)</span></a></li>
<li><a title="sqlinsert" href="http://www.henian88.com/tags-36.html">sqlinsert<span class="tag-count"> (63)</span></a></li>
<li><a title="js提交表单" href="http://www.henian88.com/tags-43.html">js提交表单<span class="tag-count"> (60)</span></a></li>
<li><a title="param" href="http://www.henian88.com/tags-169.html">param<span class="tag-count"> (62)</span></a></li>
<li><a title="parentelement" href="http://www.henian88.com/tags-203.html">parentelement<span class="tag-count"> (65)</span></a></li>
<li><a title="jquery分享" href="http://www.henian88.com/tags-205.html">jquery分享<span class="tag-count"> (62)</span></a></li>
<li><a title="check约束" href="http://www.henian88.com/tags-206.html">check约束<span class="tag-count"> (64)</span></a></li>
<li><a title="curl_init" href="http://www.henian88.com/tags-209.html">curl_init<span class="tag-count"> (68)</span></a></li>
<li><a title="sql if语句" href="http://www.henian88.com/tags-214.html">sql if语句<span class="tag-count"> (69)</span></a></li>
<li><a title="import" href="http://www.henian88.com/tags-215.html">import<span class="tag-count"> (66)</span></a></li>
<li><a title="chmod文件夹" href="http://www.henian88.com/tags-216.html">chmod文件夹<span class="tag-count"> (71)</span></a></li>
<li><a title="clearinterval" href="http://www.henian88.com/tags-217.html">clearinterval<span class="tag-count"> (71)</span></a></li>
<li><a title="pythonrange" href="http://www.henian88.com/tags-224.html">pythonrange<span class="tag-count"> (62)</span></a></li>
<li><a title="数组长度" href="http://www.henian88.com/tags-255.html">数组长度<span class="tag-count"> (61)</span></a></li>
<li><a title="javafx" href="http://www.henian88.com/tags-319.html">javafx<span class="tag-count"> (59)</span></a></li>
<li><a title="全局消息钩子" href="http://www.henian88.com/tags-390.html">全局消息钩子<span class="tag-count"> (64)</span></a></li>
<li><a title="sort排序" href="http://www.henian88.com/tags-392.html">sort排序<span class="tag-count"> (62)</span></a></li>
<li><a title="jdbc" href="http://www.henian88.com/tags-408.html">jdbc<span class="tag-count"> (69)</span></a></li>
<li><a title="php网页源码" href="http://www.henian88.com/tags-413.html">php网页源码<span class="tag-count"> (59)</span></a></li>
<li><a title="assert h" href="http://www.henian88.com/tags-423.html">assert h<span class="tag-count"> (69)</span></a></li>
<li><a title="httpclientjar" href="http://www.henian88.com/tags-434.html">httpclientjar<span class="tag-count"> (60)</span></a></li>
<li><a title="postgresql conf" href="http://www.henian88.com/tags-444.html">postgresql conf<span class="tag-count"> (59)</span></a></li>
<li><a title="winform开发" href="http://www.henian88.com/tags-447.html">winform开发<span class="tag-count"> (59)</span></a></li>
<li><a title="mysql数字类型" href="http://www.henian88.com/tags-450.html">mysql数字类型<span class="tag-count"> (71)</span></a></li>
<li><a title="drawimage" href="http://www.henian88.com/tags-462.html">drawimage<span class="tag-count"> (61)</span></a></li>
</ul>

</dd>
</dl>    </div>
    
    <div class="clear"></div>

            </div>

<div class="footer">
    <div class="zh">
                    </div>
</div>

<div class="fixed-right">
        <a href="javascript:;" class="gotop bgb" title="回到顶部"><i class="fa fa-chevron-up"></i></a>
</div>

<script src="http://www.henian88.com/zb_users/theme/txcms2/script/txcstx.min.js?v=2024-09-18"></script>
</body>

</html><!--173.37 ms , 16 queries , 3635kb memory , 0 error-->