Jadual Kandungan
一、主体结构
三、HTML 5元素通用属性和事件句柄
四、HTML5元素标记释义
Rumah hujung hadapan web Tutorial H5 html5 常用标签汇总详情

html5 常用标签汇总详情

Mar 20, 2017 pm 04:13 PM

一、主体结构

header 页面头部,不同与
aside 边栏
nav 外部链接集合
section 章节或段落
article 类似文章、摘要或留言POST等形式的记录(一般搭配内嵌头部、尾部、底部结构使用)
hggroup 类似子标题,标题信息、可选标题、TAG标签这样的数据,还是英文更好理解一些,heading of a section
address 联系信息,一般用在article或body锚元素周围
footer 页脚

二、HTML 5元素标记汇总表

文档类型宣告
根元素元素 html
META元素 head、 title、base、link、meta、style
部件元素 body、section、nav、article、aside、h1、 h2、 h3、h4、 h5、 h6、hgroup、header、footer、address
分组内容元素 p、hr、br、pre、blockquote、ol、ul、li、dl、dt、dd、figure、figcaption、p
文本层次语义元素 a、em、strong、small、cite、q、dfn、abbr、time、code、var、samp、kbd、sub、sups、i、b、mark、ruby、rt、rp、bdo、span
编辑元素 ins、del
嵌入内容元素 img、iframe、embed、object、param、video、audio、source、canvasmap、area
表格元素 table、caption、colgroup、col、tbody、thread、tfoot、tr、td、th
表单元素 form、fieldset、legend、label、button、select、datalist、optgroup、option、textarea、keygen、output、progress、meter
互动元素 details、summary、command、menu
脚本元素 script、noscript

三、HTML 5元素通用属性和事件句柄

HTML5元素通用属性表 accesskey、class、contenteditable、contextmenu、dir、 draggable、hidden、id、lang、spellcheck、style、tabindex、title
HTML5元素事件句柄属性 onabort、onblur*、oncanplay、oncanplaythrough、onchange、 onclick、 oncontextmenu、ondblclick、ondrag、ondragend、ondragenter、ondragleave、 ondragover、ondragstart、ondrop、ondurationchange、onemptied、onended、 onerror*、onfocus*、onformchange、onforminput、oninput、oninvalid、onkeydown、 onkeypress、onkeyup、onload*、onloadeddata、onloadedmetadata、onloadstart、 onmousedown、onmousemove、onmouseout、onmouseover、onmouseup、onmousewheel、 onpause、onplay、onplaying、onprogress、onratechange、onreadystatechange、 onscroll、onseeked、onseeking、onselect、onshow、onstalled、onsubmit、 onsuspend、ontimeupdate、onvolumechange、onwaiting。

四、HTML5元素标记释义

标记 类型 意义 介绍
文件标记
根文件标记 让浏览器知道这是HTML 文件
META标记
开头 提供文件整体信息
</td> <td>●</td> <td>标题</td> <td>定义文件标题,显示于浏览器顶端</td> </tr> <tr> <td><base></td> <td>o</td> <td>基准标记</td> <td>可将相对URL转绝对及指定链接</td> </tr> <tr> <td><link></td> <td>o</td> <td>外部资源连接</td> <td>必须带rel属性描述</td> </tr> <tr> <td><meta></td> <td>o</td> <td> <a href="http://www.php.cn/html5/html5-3-mip-normal.html" target="_blank">其它</a>META数据</td> <td>不能被title, base, link, style, 和script元素描述的META数据</td> </tr> <tr> <td><style></td> <td>●</td> <td>嵌入文档风格信息</td> <td> </td> </tr> <tr><td colspan="4"><strong>部件标记</strong></td></tr> <tr> <td><body></td> <td>●</td> <td>文档主体开始</td> <td>文档内容容器</td> </tr> <tr> <td><section></td> <td>●</td> <td>代表通用文档或应用部件</td> <td> </td> </tr> <tr> <td><nav></td> <td>●</td> <td> <a href="http://www.php.cn/code/9303.html" target="_blank">导航</a>链接</td> <td>外部链接或文档内部链接</td> </tr> <tr> <td><article></td> <td>●</td> <td>页面模块</td> <td>类似文章、摘要或留言POST等形式的记录</td> </tr> <tr> <td><aside></td> <td>●</td> <td>孤立模块</td> <td>一般作为边栏广告、说明、<a href="http://www.php.cn/wiki/231.html" target="_blank">引用</a>、导航等,aside围堵部分一般与正文耦合较小</td> </tr> <tr> <td><h1></td> <td>●</td> <td>标题标记</td> <td>此外还有h2, h3, h4, h5, h6</td> </tr> <tr> <td><hgroup></td> <td>●</td> <td>群组标题</td> <td>用在一组h1-h6这样的元素集合时使用,用来区分主副标题??</td> </tr> <tr> <td><header></td> <td>●</td> <td>组说明或组导航</td> <td>也可叫页头标题</td> </tr> <tr> <td><footer></td> <td>●</td> <td>页脚标题</td> <td>作用范围跟最近部件元素有关</td> </tr> <tr> <td><address></td> <td>●</td> <td>地址或联系信息</td> <td> </td> </tr> <tr> <td><strong>分组内容标记</strong></td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td><p></td> <td>●</td> <td>段落标记</td> <td> </td> </tr> <tr> <td><hr></td> <td>o</td> <td>水平分割线</td> <td> </td> </tr> <tr> <td><br></td> <td>o</td> <td>换行</td> <td> </td> </tr> <tr> <td><pre class="brush:php;toolbar:false"></td> <td>●</td> <td>预格式化分本块</td> <td> </td> </tr> <tr> <td><blockquote></td> <td>●</td> <td>块引用</td> <td> </td> </tr> <tr> <td><ol></td> <td>●</td> <td>编号列表</td> <td> </td> </tr> <tr> <td><ul></td> <td>●</td> <td>项目列表</td> <td> </td> </tr> <tr> <td><li></td> <td>●</td> <td>列表项</td> <td> </td> </tr> <tr> <td><dl></td> <td>●</td> <td>定义列表</td> <td> </td> </tr> <tr> <td><dt></td> <td>●</td> <td>定义名称</td> <td> </td> </tr> <tr> <td><dd></td> <td>●</td> <td>定义说明</td> <td> </td> </tr> <tr> <td><figure></td> <td>●</td> <td>流内容区块说明</td> <td>多结合figcaption使用</td> </tr> <tr> <td><figcaption></td> <td>●</td> <td>figure内容属性</td> <td> </td> </tr> <tr> <td><p></td> <td>●</td> <td>定位标记</td> <td>无实际意义</td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr><td colspan="4"><strong>文本层次语义标记</strong></td></tr> <tr> <td><a></td> <td>●</td> <td>链接标记</td> <td> </td> </tr> <tr> <td><em></td> <td>●</td> <td>强调标记</td> <td> </td> </tr> <tr> <td><strong></td> <td>●</td> <td>加重标记</td> <td> </td> </tr> <tr> <td><small></td> <td>●</td> <td>字体缩小</td> <td> </td> </tr> <tr> <td><cite></td> <td>●</td> <td>斜体标记</td> <td> </td> </tr> <tr> <td><q></td> <td>●</td> <td>引用标记内容</td> <td>原文是phrasing content,暂不清楚如何翻译</td> </tr> <tr> <td><dfn></td> <td>●</td> <td>术语定义</td> <td> </td> </tr> <tr> <td><abbr></td> <td>●</td> <td>缩略语</td> <td> </td> </tr> <tr> <td><time></td> <td>●</td> <td>日期时间</td> <td> </td> </tr> <tr> <td><code></td> <td>●</td> <td>程序代码</td> <td> </td> </tr> <tr> <td><var></td> <td>●</td> <td><a href="http://www.php.cn/wiki/70.html" target="_blank">变量</a></td> <td> </td> </tr> <tr> <td><samp></td> <td>●</td> <td>范例</td> <td> </td> </tr> <tr> <td><kbd></td> <td>●</td> <td>键盘字</td> <td> </td> </tr> <tr> <td><sub><sups></td> <td>●</td> <td>上标字/下标字</td> <td> </td> </tr> <tr> <td><i></td> <td>●</td> <td>斜体标记</td> <td> </td> </tr> <tr> <td><b></td> <td>●</td> <td>粗体标记</td> <td> </td> </tr> <tr> <td><mark></td> <td>●</td> <td>标记或高亮</td> <td> </td> </tr> <tr> <td><ruby></td> <td>●</td> <td>注解标记</td> <td> </td> </tr> <tr> <td><rt></td> <td>●</td> <td>ruby子元素</td> <td>结合ruby使用,比如:<ruby>天<rt>Tian</rt>缘<rt>Yuan</rt></ruby></td> </tr> <tr> <td><rp></td> <td>●</td> <td>ruby子元素</td> <td>一般做rt元素<a href="http://www.php.cn/code/8105.html" target="_blank">注释</a>使用</td> </tr> <tr> <td><bdo></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><span></td> <td>●</td> <td>自定义标记</td> <td> </td> </tr> <tr><td colspan="4"><strong>编辑标记</strong></td></tr> <tr> <td><ins></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><del></td> <td>●</td> <td> </td> <td> </td> </tr> <tr><td colspan="4"><strong>嵌入内容标记</strong></td></tr> <tr> <td><img></td> <td>●</td> <td> <a href="http://www.php.cn/css/css-rwd-images.html" target="_blank">图片</a>标记</td> <td> </td> </tr> <tr> <td><iframe></td> <td>●</td> <td> <a href="http://www.php.cn/css/css-rwd-frameworks.html" target="_blank">框架</a>标记</td> <td> </td> </tr> <tr> <td><embed></td> <td>●</td> <td>嵌入标记</td> <td> </td> </tr> <tr> <td><object></td> <td>●</td> <td> <a href="http://www.php.cn/wiki/60.html" target="_blank">对象</a>标记</td> <td> </td> </tr> <tr> <td><param></td> <td>●</td> <td>参数标记</td> <td> </td> </tr> <tr> <td><video></td> <td>●</td> <td> <a href="http://www.php.cn/code/6707.html" target="_blank">视频</a>标记</td> <td> </td> </tr> <tr> <td><audio></td> <td>●</td> <td> <a href="http://www.php.cn/code/6093.html" target="_blank">音频</a>标记</td> <td> </td> </tr> <tr> <td><source></td> <td>●</td> <td>来源标记</td> <td> </td> </tr> <tr> <td><canvas></td> <td>●</td> <td>制图标记</td> <td> </td> </tr> <tr> <td><map></td> <td>●</td> <td> <a href="http://www.php.cn/code/7891.html" target="_blank">地图</a>标记</td> <td> </td> </tr> <tr> <td><area></td> <td>●</td> <td>区域标记</td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr><td colspan="4"><strong>表格标记</strong></td></tr> <tr> <td><table></td> <td>●</td> <td>表格标记</td> <td>设定该表格的各项参数</td> </tr> <tr> <td><caption></td> <td>●</td> <td>表格标题</td> <td>做成一打通列以填入表格标题</td> </tr> <tr> <td><colgroup></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><col></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><tbody></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><thread></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><tfoot></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><tr></td> <td>●</td> <td>表格列</td> <td>设定该表格的列</td> </tr> <tr> <td><td></td> <td>●</td> <td>表格栏</td> <td>设定该表格的栏</td> </tr> <tr> <td><th></td> <td>●</td> <td>表格标头</td> <td>相等于<TD>,但其内文字字体会变粗</td> </tr> <tr><td colspan="4"><strong>表单标记</strong></td></tr> <tr> <td><form></td> <td>●</td> <td>表单标记</td> <td>决定该表单的运作模式</td> </tr> <tr> <td><fieldset></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><legend></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><input></td> <td>●</td> <td>输入标记</td> <td> </td> </tr> <tr> <td><label></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><button></td> <td>●</td> <td><a href="http://www.php.cn/code/5991.html" target="_blank">按钮</a></td> <td> </td> </tr> <tr> <td><select></td> <td>●</td> <td>选择标记</td> <td> </td> </tr> <tr> <td><datalist></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><optgroup></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><option></td> <td>●</td> <td>选项</td> <td> </td> </tr> <tr> <td><textarea></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><keygen></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><output></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><progress></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><meter></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr><td colspan="4"><p><strong>互动元素</strong></p></td></tr> <tr> <td><details></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><summary></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><command></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><menu></td> <td>●</td> <td> </td> <td> </td> </tr> <tr><td colspan="4"><strong>其他标记</strong></td></tr> <tr> <td><script></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td><noscript></td> <td>●</td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> </tbody></table> <p><strong>备注: </strong></p> <p>1、● 表示该标记属于围堵标记,需要结束标记</标记>。</p> <p>2、o 表示该标记属空标记,不需要结束标记。</p><p>Atas ialah kandungan terperinci html5 常用标签汇总详情. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!</p> </div> </div> <div class="wzconShengming_sp"> <div class="bzsmdiv_sp">Kenyataan Laman Web ini</div> <div>Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn</div> </div> </div> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="2507867629"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <div class="AI_ToolDetails_main4sR"> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-5902227090019525" data-ad-slot="3653428331" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <!-- <div class="phpgenera_Details_mainR4"> <div class="phpmain1_4R_readrank"> <div class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hotarticle2.png" alt="" /> <h2>Artikel Panas</h2> </div> <div class="phpgenera_Details_mainR4_bottom"> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/1796793874.html" title="Bagaimana untuk memperbaiki KB5055523 gagal dipasang di Windows 11?" class="phpgenera_Details_mainR4_bottom_title">Bagaimana untuk memperbaiki KB5055523 gagal dipasang di Windows 11?</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <span>3 minggu yang lalu</span> <span>By DDD</span> </div> </div> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/1796793871.html" title="Bagaimana untuk memperbaiki KB5055518 gagal dipasang di Windows 10?" class="phpgenera_Details_mainR4_bottom_title">Bagaimana untuk memperbaiki KB5055518 gagal dipasang di Windows 10?</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <span>3 minggu yang lalu</span> <span>By DDD</span> </div> </div> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/1796791957.html" title="<🎜>: Rails Dead - Cara menjinakkan serigala" class="phpgenera_Details_mainR4_bottom_title"><🎜>: Rails Dead - Cara menjinakkan serigala</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <span>4 minggu yang lalu</span> <span>By DDD</span> </div> </div> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/1796792155.html" title="Tahap kekuatan untuk setiap musuh & raksasa di R.E.P.O." class="phpgenera_Details_mainR4_bottom_title">Tahap kekuatan untuk setiap musuh & raksasa di R.E.P.O.</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <span>4 minggu yang lalu</span> <span>By 尊渡假赌尊渡假赌尊渡假赌</span> </div> </div> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/1796797907.html" title="<🎜>: Tumbuh Taman - Panduan Mutasi Lengkap" class="phpgenera_Details_mainR4_bottom_title"><🎜>: Tumbuh Taman - Panduan Mutasi Lengkap</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <span>2 minggu yang lalu</span> <span>By DDD</span> </div> </div> </div> <div class="phpgenera_Details_mainR3_more"> <a href="https://www.php.cn/ms/article.html">Tunjukkan Lagi</a> </div> </div> </div> --> <div class="phpgenera_Details_mainR3"> <div class="phpmain1_4R_readrank"> <div class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hottools2.png" alt="" /> <h2>Alat AI Hot</h2> </div> <div class="phpgenera_Details_mainR3_bottom"> <div class="phpmain_tab2_mids_top"> <a href="https://www.php.cn/ms/ai/undresserai-undress" title="Undresser.AI Undress" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173411540686492.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Undresser.AI Undress" /> </a> <div class="phpmain_tab2_mids_info"> <a href="https://www.php.cn/ms/ai/undresserai-undress" title="Undresser.AI Undress" class="phpmain_tab2_mids_title"> <h3>Undresser.AI Undress</h3> </a> <p>Apl berkuasa AI untuk mencipta foto bogel yang realistik</p> </div> </div> <div class="phpmain_tab2_mids_top"> <a href="https://www.php.cn/ms/ai/ai-clothes-remover" title="AI Clothes Remover" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173411552797167.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="AI Clothes Remover" /> </a> <div class="phpmain_tab2_mids_info"> <a href="https://www.php.cn/ms/ai/ai-clothes-remover" title="AI Clothes Remover" class="phpmain_tab2_mids_title"> <h3>AI Clothes Remover</h3> </a> <p>Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.</p> </div> </div> <div class="phpmain_tab2_mids_top"> <a href="https://www.php.cn/ms/ai/undress-ai-tool" title="Undress AI Tool" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173410641626608.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Undress AI Tool" /> </a> <div class="phpmain_tab2_mids_info"> <a href="https://www.php.cn/ms/ai/undress-ai-tool" title="Undress AI Tool" class="phpmain_tab2_mids_title"> <h3>Undress AI Tool</h3> </a> <p>Gambar buka pakaian secara percuma</p> </div> </div> <div class="phpmain_tab2_mids_top"> <a href="https://www.php.cn/ms/ai/clothoffio" title="Clothoff.io" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173411529149311.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Clothoff.io" /> </a> <div class="phpmain_tab2_mids_info"> <a href="https://www.php.cn/ms/ai/clothoffio" title="Clothoff.io" class="phpmain_tab2_mids_title"> <h3>Clothoff.io</h3> </a> <p>Penyingkiran pakaian AI</p> </div> </div> <div class="phpmain_tab2_mids_top"> <a href="https://www.php.cn/ms/ai/video-swap" title="Video Face Swap" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173414504068133.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Video Face Swap" /> </a> <div class="phpmain_tab2_mids_info"> <a href="https://www.php.cn/ms/ai/video-swap" title="Video Face Swap" class="phpmain_tab2_mids_title"> <h3>Video Face Swap</h3> </a> <p>Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!</p> </div> </div> </div> <div class="phpgenera_Details_mainR3_more"> <a href="https://www.php.cn/ms/ai">Tunjukkan Lagi</a> </div> </div> </div> <script src="https://sw.php.cn/hezuo/cac1399ab368127f9b113b14eb3316d0.js" type="text/javascript"></script> <div class="phpgenera_Details_mainR4"> <div class="phpmain1_4R_readrank"> <div class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hotarticle2.png" alt="" /> <h2>Artikel Panas</h2> </div> <div class="phpgenera_Details_mainR4_bottom"> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/1796793874.html" title="Bagaimana untuk memperbaiki KB5055523 gagal dipasang di Windows 11?" class="phpgenera_Details_mainR4_bottom_title">Bagaimana untuk memperbaiki KB5055523 gagal dipasang di Windows 11?</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <span>3 minggu yang lalu</span> <span>By DDD</span> </div> </div> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/1796793871.html" title="Bagaimana untuk memperbaiki KB5055518 gagal dipasang di Windows 10?" class="phpgenera_Details_mainR4_bottom_title">Bagaimana untuk memperbaiki KB5055518 gagal dipasang di Windows 10?</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <span>3 minggu yang lalu</span> <span>By DDD</span> </div> </div> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/1796791957.html" title="<🎜>: Rails Dead - Cara menjinakkan serigala" class="phpgenera_Details_mainR4_bottom_title"><🎜>: Rails Dead - Cara menjinakkan serigala</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <span>4 minggu yang lalu</span> <span>By DDD</span> </div> </div> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/1796792155.html" title="Tahap kekuatan untuk setiap musuh & raksasa di R.E.P.O." class="phpgenera_Details_mainR4_bottom_title">Tahap kekuatan untuk setiap musuh & raksasa di R.E.P.O.</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <span>4 minggu yang lalu</span> <span>By 尊渡假赌尊渡假赌尊渡假赌</span> </div> </div> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/1796797907.html" title="<🎜>: Tumbuh Taman - Panduan Mutasi Lengkap" class="phpgenera_Details_mainR4_bottom_title"><🎜>: Tumbuh Taman - Panduan Mutasi Lengkap</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <span>2 minggu yang lalu</span> <span>By DDD</span> </div> </div> </div> <div class="phpgenera_Details_mainR3_more"> <a href="https://www.php.cn/ms/article.html">Tunjukkan Lagi</a> </div> </div> </div> <div class="phpgenera_Details_mainR3"> <div class="phpmain1_4R_readrank"> <div class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hottools2.png" alt="" /> <h2>Alat panas</h2> </div> <div class="phpgenera_Details_mainR3_bottom"> <div class="phpmain_tab2_mids_top"> <a href="https://www.php.cn/ms/toolset/development-tools/92" title="Notepad++7.3.1" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58ab96f0f39f7357.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="Notepad++7.3.1" /> </a> <div class="phpmain_tab2_mids_info"> <a href="https://www.php.cn/ms/toolset/development-tools/92" title="Notepad++7.3.1" class="phpmain_tab2_mids_title"> <h3>Notepad++7.3.1</h3> </a> <p>Editor kod yang mudah digunakan dan percuma</p> </div> </div> <div class="phpmain_tab2_mids_top"> <a href="https://www.php.cn/ms/toolset/development-tools/93" title="SublimeText3 versi Cina" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58ab97a3baad9677.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="SublimeText3 versi Cina" /> </a> <div class="phpmain_tab2_mids_info"> <a href="https://www.php.cn/ms/toolset/development-tools/93" title="SublimeText3 versi Cina" class="phpmain_tab2_mids_title"> <h3>SublimeText3 versi Cina</h3> </a> <p>Versi Cina, sangat mudah digunakan</p> </div> </div> <div class="phpmain_tab2_mids_top"> <a href="https://www.php.cn/ms/toolset/development-tools/121" title="Hantar Studio 13.0.1" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58ab97ecd1ab2670.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="Hantar Studio 13.0.1" /> </a> <div class="phpmain_tab2_mids_info"> <a href="https://www.php.cn/ms/toolset/development-tools/121" title="Hantar Studio 13.0.1" class="phpmain_tab2_mids_title"> <h3>Hantar Studio 13.0.1</h3> </a> <p>Persekitaran pembangunan bersepadu PHP yang berkuasa</p> </div> </div> <div class="phpmain_tab2_mids_top"> <a href="https://www.php.cn/ms/toolset/development-tools/469" title="Dreamweaver CS6" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58d0e0fc74683535.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="Dreamweaver CS6" /> </a> <div class="phpmain_tab2_mids_info"> <a href="https://www.php.cn/ms/toolset/development-tools/469" title="Dreamweaver CS6" class="phpmain_tab2_mids_title"> <h3>Dreamweaver CS6</h3> </a> <p>Alat pembangunan web visual</p> </div> </div> <div class="phpmain_tab2_mids_top"> <a href="https://www.php.cn/ms/toolset/development-tools/500" title="SublimeText3 versi Mac" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58d34035e2757995.png?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="SublimeText3 versi Mac" /> </a> <div class="phpmain_tab2_mids_info"> <a href="https://www.php.cn/ms/toolset/development-tools/500" title="SublimeText3 versi Mac" class="phpmain_tab2_mids_title"> <h3>SublimeText3 versi Mac</h3> </a> <p>Perisian penyuntingan kod peringkat Tuhan (SublimeText3)</p> </div> </div> </div> <div class="phpgenera_Details_mainR3_more"> <a href="https://www.php.cn/ms/ai">Tunjukkan Lagi</a> </div> </div> </div> <div class="phpgenera_Details_mainR4"> <div class="phpmain1_4R_readrank"> <div class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hotarticle2.png" alt="" /> <h2>Topik panas</h2> </div> <div class="phpgenera_Details_mainR4_bottom"> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/java-tutorial" title="Tutorial Java" class="phpgenera_Details_mainR4_bottom_title">Tutorial Java</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <div class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>1658</span> </div> <div class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>14</span> </div> </div> </div> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/cakephp-tutor" title="Tutorial CakePHP" class="phpgenera_Details_mainR4_bottom_title">Tutorial CakePHP</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <div class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>1415</span> </div> <div class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>52</span> </div> </div> </div> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/laravel-tutori" title="Tutorial Laravel" class="phpgenera_Details_mainR4_bottom_title">Tutorial Laravel</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <div class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>1309</span> </div> <div class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>25</span> </div> </div> </div> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/php-tutorial" title="Tutorial PHP" class="phpgenera_Details_mainR4_bottom_title">Tutorial PHP</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <div class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>1257</span> </div> <div class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>29</span> </div> </div> </div> <div class="phpgenera_Details_mainR4_bottoms"> <a href="https://www.php.cn/ms/faq/c-tutorial" title="Tutorial C#" class="phpgenera_Details_mainR4_bottom_title">Tutorial C#</a> <div class="phpgenera_Details_mainR4_bottoms_info"> <div class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>1231</span> </div> <div class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>24</span> </div> </div> </div> </div> <div class="phpgenera_Details_mainR3_more"> <a href="https://www.php.cn/ms/faq/zt">Tunjukkan Lagi</a> </div> </div> </div> </div> </div> <div class="Article_Details_main2"> <div class="phpgenera_Details_mainL4"> <div class="phpmain1_2_top"> <a href="javascript:void(0);" class="phpmain1_2_top_title">Related knowledge<img src="/static/imghw/index2_title2.png" alt="" /></a> </div> <div class="phpgenera_Details_mainL4_info"> <div class="phphistorical_Version2_mids"> <a href="https://www.php.cn/ms/faq/1796600245.html" title="Sempadan Jadual dalam HTML" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/202409/04/2024090416492486715.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Sempadan Jadual dalam HTML" /> </a> <a href="https://www.php.cn/ms/faq/1796600245.html" title="Sempadan Jadual dalam HTML" class="phphistorical_Version2_mids_title">Sempadan Jadual dalam HTML</a> <span class="Articlelist_txts_time">Sep 04, 2024 pm 04:49 PM</span> <p class="Articlelist_txts_p">Panduan untuk Sempadan Jadual dalam HTML. Di sini kita membincangkan pelbagai cara untuk menentukan sempadan jadual dengan contoh Sempadan Jadual dalam HTML.</p> </div> <div class="phphistorical_Version2_mids"> <a href="https://www.php.cn/ms/faq/1796600244.html" title="Jadual Bersarang dalam HTML" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/202409/04/2024090416491283996.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Jadual Bersarang dalam HTML" /> </a> <a href="https://www.php.cn/ms/faq/1796600244.html" title="Jadual Bersarang dalam HTML" class="phphistorical_Version2_mids_title">Jadual Bersarang dalam HTML</a> <span class="Articlelist_txts_time">Sep 04, 2024 pm 04:49 PM</span> <p class="Articlelist_txts_p">Ini ialah panduan untuk Nested Table dalam HTML. Di sini kita membincangkan cara membuat jadual dalam jadual bersama-sama dengan contoh masing-masing.</p> </div> <div class="phphistorical_Version2_mids"> <a href="https://www.php.cn/ms/faq/1796600238.html" title="HTML jidar-kiri" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/202409/04/2024090416482056439.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="HTML jidar-kiri" /> </a> <a href="https://www.php.cn/ms/faq/1796600238.html" title="HTML jidar-kiri" class="phphistorical_Version2_mids_title">HTML jidar-kiri</a> <span class="Articlelist_txts_time">Sep 04, 2024 pm 04:48 PM</span> <p class="Articlelist_txts_p">Panduan untuk HTML margin-kiri. Di sini kita membincangkan gambaran keseluruhan ringkas tentang HTML margin-left dan Contoh-contohnya bersama-sama dengan Pelaksanaan Kodnya.</p> </div> <div class="phphistorical_Version2_mids"> <a href="https://www.php.cn/ms/faq/1796600271.html" title="Susun Atur Jadual HTML" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/202409/04/2024090416543391948.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Susun Atur Jadual HTML" /> </a> <a href="https://www.php.cn/ms/faq/1796600271.html" title="Susun Atur Jadual HTML" class="phphistorical_Version2_mids_title">Susun Atur Jadual HTML</a> <span class="Articlelist_txts_time">Sep 04, 2024 pm 04:54 PM</span> <p class="Articlelist_txts_p">Panduan untuk Susun Atur Jadual HTML. Di sini kita membincangkan Nilai Susun Atur Jadual HTML bersama-sama dengan contoh dan output n perincian.</p> </div> <div class="phphistorical_Version2_mids"> <a href="https://www.php.cn/ms/faq/1796600269.html" title="Pemegang Tempat Input HTML" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/202409/04/2024090416542577781.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Pemegang Tempat Input HTML" /> </a> <a href="https://www.php.cn/ms/faq/1796600269.html" title="Pemegang Tempat Input HTML" class="phphistorical_Version2_mids_title">Pemegang Tempat Input HTML</a> <span class="Articlelist_txts_time">Sep 04, 2024 pm 04:54 PM</span> <p class="Articlelist_txts_p">Panduan untuk Pemegang Tempat Input HTML. Di sini kita membincangkan Contoh Pemegang Tempat Input HTML bersama-sama dengan kod dan output.</p> </div> <div class="phphistorical_Version2_mids"> <a href="https://www.php.cn/ms/faq/1796600210.html" title="Senarai Tertib HTML" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/202409/04/2024090416432927533.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Senarai Tertib HTML" /> </a> <a href="https://www.php.cn/ms/faq/1796600210.html" title="Senarai Tertib HTML" class="phphistorical_Version2_mids_title">Senarai Tertib HTML</a> <span class="Articlelist_txts_time">Sep 04, 2024 pm 04:43 PM</span> <p class="Articlelist_txts_p">Panduan kepada Senarai Tertib HTML. Di sini kami juga membincangkan pengenalan senarai dan jenis Tertib HTML bersama-sama dengan contoh mereka masing-masing</p> </div> <div class="phphistorical_Version2_mids"> <a href="https://www.php.cn/ms/faq/1796600246.html" title="Butang onclick HTML" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/202409/04/2024090416493797970.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Butang onclick HTML" /> </a> <a href="https://www.php.cn/ms/faq/1796600246.html" title="Butang onclick HTML" class="phphistorical_Version2_mids_title">Butang onclick HTML</a> <span class="Articlelist_txts_time">Sep 04, 2024 pm 04:49 PM</span> <p class="Articlelist_txts_p">Panduan untuk Butang onclick HTML. Di sini kita membincangkan pengenalan, kerja, contoh dan onclick Event masing-masing dalam pelbagai acara.</p> </div> <div class="phphistorical_Version2_mids"> <a href="https://www.php.cn/ms/faq/1796600227.html" title="Memindahkan Teks dalam HTML" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/202409/04/2024090416455153019.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Memindahkan Teks dalam HTML" /> </a> <a href="https://www.php.cn/ms/faq/1796600227.html" title="Memindahkan Teks dalam HTML" class="phphistorical_Version2_mids_title">Memindahkan Teks dalam HTML</a> <span class="Articlelist_txts_time">Sep 04, 2024 pm 04:45 PM</span> <p class="Articlelist_txts_p">Panduan untuk Memindahkan Teks dalam HTML. Di sini kita membincangkan pengenalan, cara teg marquee berfungsi dengan sintaks dan contoh untuk dilaksanakan.</p> </div> </div> <a href="https://www.php.cn/ms/web-designer.html" class="phpgenera_Details_mainL4_botton"> <span>See all articles</span> <img src="/static/imghw/down_right.png" alt="" /> </a> </div> </div> </div> </main> <footer> <div class="footer"> <div class="footertop"> <img src="/static/imghw/logo.png" alt=""> <p>Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!</p> </div> <div class="footermid"> <a href="https://www.php.cn/ms/about/us.html">Tentang kita</a> <a href="https://www.php.cn/ms/about/disclaimer.html">Penafian</a> <a href="https://www.php.cn/ms/update/article_0_1.html">Sitemap</a> </div> <div class="footerbottom"> <p> © php.cn All rights reserved </p> </div> </div> </footer> <input type="hidden" id="verifycode" value="/captcha.html"> <script>layui.use(['element', 'carousel'], function () {var element = layui.element;$ = layui.jquery;var carousel = layui.carousel;carousel.render({elem: '#test1', width: '100%', height: '330px', arrow: 'always'});$.getScript('/static/js/jquery.lazyload.min.js', function () {$("img").lazyload({placeholder: "/static/images/load.jpg", effect: "fadeIn", threshold: 200, skip_invisible: false});});});</script> <script src="/static/js/common_new.js"></script> <script type="text/javascript" src="/static/js/jquery.cookie.js?1746490350"></script> <script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script> <link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css?2' type='text/css' media='all' /> <script type='text/javascript' src='/static/js/viewer.min.js?1'></script> <script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script> <script type="text/javascript" src="/static/js/global.min.js?5.5.53"></script> <script> var _paq = window._paq = window._paq || []; /* tracker methods like "setCustomDimension" should be called before "trackPageView" */ _paq.push(['trackPageView']); _paq.push(['enableLinkTracking']); (function () { var u = "https://tongji.php.cn/"; _paq.push(['setTrackerUrl', u + 'matomo.php']); _paq.push(['setSiteId', '9']); var d = document, g = d.createElement('script'), s = d.getElementsByTagName('script')[0]; g.async = true; g.src = u + 'matomo.js'; s.parentNode.insertBefore(g, s); })(); </script> <script> // top layui.use(function () { var util = layui.util; util.fixbar({ on: { mouseenter: function (type) { layer.tips(type, this, { tips: 4, fixed: true, }); }, mouseleave: function (type) { layer.closeAll("tips"); }, }, }); }); document.addEventListener("DOMContentLoaded", (event) => { // 定义一个函数来处理滚动链接的点击事件 function setupScrollLink(scrollLinkId, targetElementId) { const scrollLink = document.getElementById(scrollLinkId); const targetElement = document.getElementById(targetElementId); if (scrollLink && targetElement) { scrollLink.addEventListener("click", (e) => { e.preventDefault(); // 阻止默认链接行为 targetElement.scrollIntoView({ behavior: "smooth" }); // 平滑滚动到目标元素 }); } else { console.warn( `Either scroll link with ID '${scrollLinkId}' or target element with ID '${targetElementId}' not found.` ); } } // 使用该函数设置多个滚动链接 setupScrollLink("Article_Details_main1L2s_1", "article_main_title1"); setupScrollLink("Article_Details_main1L2s_2", "article_main_title2"); setupScrollLink("Article_Details_main1L2s_3", "article_main_title3"); setupScrollLink("Article_Details_main1L2s_4", "article_main_title4"); setupScrollLink("Article_Details_main1L2s_5", "article_main_title5"); setupScrollLink("Article_Details_main1L2s_6", "article_main_title6"); // 可以继续添加更多的滚动链接设置 }); window.addEventListener("scroll", function () { var fixedElement = document.getElementById("Article_Details_main1Lmain"); var scrollTop = window.scrollY || document.documentElement.scrollTop; // 兼容不同浏览器 var clientHeight = window.innerHeight || document.documentElement.clientHeight; // 视口高度 var scrollHeight = document.documentElement.scrollHeight; // 页面总高度 // 计算距离底部的距离 var distanceToBottom = scrollHeight - scrollTop - clientHeight; // 当距离底部小于或等于300px时,取消固定定位 if (distanceToBottom <= 980) { fixedElement.classList.remove("Article_Details_main1Lmain"); fixedElement.classList.add("Article_Details_main1Lmain_relative"); } else { // 否则,保持固定定位 fixedElement.classList.remove("Article_Details_main1Lmain_relative"); fixedElement.classList.add("Article_Details_main1Lmain"); } }); </script> <script> document.addEventListener('DOMContentLoaded', function() { const mainNav = document.querySelector('.Article_Details_main1Lmain'); const header = document.querySelector('header'); if (mainNav) { window.addEventListener('scroll', function() { const scrollPosition = window.scrollY; if (scrollPosition > 84) { mainNav.classList.add('fixed'); } else { mainNav.classList.remove('fixed'); } }); } }); </script> </body> </html>