首頁 > web前端 > html教學 > 1、HTML基础学习 第一天_html/css_WEB-ITnose

1、HTML基础学习 第一天_html/css_WEB-ITnose

WBOY
發布: 2016-06-24 11:24:11
原創
1126 人瀏覽過

1、基本标签属性

 1 <html> 2 <!--属性和属性值对大小写不敏感。 3 不过,万维网联盟在其 HTML 4 推荐标准中推荐小写的属性/属性值。 4 而新版本的 (X)HTML 要求使用小写属性。 5  --> 6  7 <body> 8  9 <!-- hello this is a comment-->10 11 <h1 align="left">This is heading 1</h1>12 <h2 align="center">This is heading 2</h2>13 <h3 align="right">This is heading 3</h3>14 <h4>This is heading 4</h4>15 <h5>This is heading 5</h5>16 <h6>This is heading 6</h6>17 18 <hr><!--绘制水平线-->19 20 <a href="http://www.baidu.com"> link_baidu </a>21 22 <br>23 <body bgcolor="#e6e6e6">24 25 26 <p> this is paragraph 1 </p>27 <p> this is paragraph 2 </p>28 <p> this is paragraph 3 </p>29 30 <img  src="/i/eg_w3school.gif"/ alt="1、HTML基础学习 第一天_html/css_WEB-ITnose" >31 <img  src="/i/eg_w3school.gif"    style="max-width:90%"  style="max-width:90%" / alt="1、HTML基础学习 第一天_html/css_WEB-ITnose" >32 <br/>33 <br/>34 <br/>35 36 37 normal38 <br/>39 <b> bold </b>40 <br/>41 <strong> strong </strong>42 <br/>43 <big> big font </big>44 <br/>45 <small> small font </small>46 <br/>47 <i> italic font </i>48 <br/>49 what's the  <sub> fuck </sub>50 <br/>51 what's the  <sup> fuck </sup>52 <br/>53 <i> what's the  <sup> fuck </sup> </i>54 55 <p>pre 标签很适合显示计算机代码:</p>56 57 <pre class="brush:php;toolbar:false">58 for i = 1 to 1059      print i60 next i61 
登入後複製
62 63 64

2、始终为属性值加引号

属性值应该始终被包括在引号内。双引号是最常用的,不过使用单引号也没有问题。

在某些个别的情况下,比如属性值本身就含有双引号,那么您必须使用单引号

3、h标签只用于标题

请确保将 HTML heading 标签只用于标题。不要仅仅是为了产生粗体或大号的文本而使用标题。

搜索引擎使用标题为您的网页的结构和内容编制索引。

4、HTML 折行

如果您希望在不产生一个新段落的情况下进行换行(新行),请使用
标签

5、
还是

您也许发现

很相似。

在 XHTML、XML 以及未来的 HTML 版本中,不允许使用没有结束标签(闭合标签)的 HTML 元素。

即使
在所有浏览器中的显示都没有问题,使用
也是更长远的保障

6、计算机输出标签

 1 <br /> 2 <code>Computer code </code> 3 <br /> 4 <kbd>Keyboard input </kbd> 5 <br /> 6 <tt>Teletype text </tt> 7 <br /> 8 <samp>Sample text</samp> 9 <br />10 <var>Computer variable</var>11 <br />
登入後複製

7、地址输入

1 <address>2 Written by <a href="mailto:webmaster@example.com">Donald Duck</a>.<br> 3 Visit us at:<br>4 Example.com<br>5 Box 564, Disneyland<br>6 USA7 </address>
登入後複製

8、文字方向

<p>如果您的浏览器支持 bi-directional override (bdo),下一行会从右向左输出 (rtl);</p><bdo dir="rtl">Here is some Hebrew text</bdo>
登入後複製

9、块引用

 1 这是长的引用: 2 <blockquote> 3 这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。 4 </blockquote> 5  6 这是短的引用: 7 <q> 8 这是短的引用。 9 </q>10 11 <p>12 使用 blockquote 元素的话,浏览器会插入换行和外边距,而 q 元素不会有任何特殊的呈现。13 </p>
登入後複製

 

10、格式化总结

 

文本格式化标签

标签

描述

定义粗体文本。

定义大号字。

定义着重文字。

定义斜体字。

定义小号字。

定义加重语气。

定义下标字。

定义上标字。

定义插入字。

定义删除字。

不赞成使用。使用 代替。

不赞成使用。使用 代替。

不赞成使用。使用样式(style)代替。

“计算机输出”标签

标签

描述

定义计算机代码。

定义键盘码。

定义计算机代码样本。

定义打字机代码。

定义变量。

登入後複製

定义预格式文本。

不赞成使用。使用

 代替。
登入後複製
登入後複製
登入後複製

</plaintext></p></td> <td> <p>不赞成使用。使用 </p> <div class="code" style="position:relative; padding:0px; margin:0px;"><div class="code" style="position:relative; padding:0px; margin:0px;"><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"> 代替。</pre><div class="contentsignin">登入後複製</div></div><div class="contentsignin">登入後複製</div></div><div class="contentsignin">登入後複製</div></div> </td> </tr> <tr> <td> <p></p> <xmp></xmp> </td> <td> <p>不赞成使用。使用 </p> <div class="code" style="position:relative; padding:0px; margin:0px;"><div class="code" style="position:relative; padding:0px; margin:0px;"><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"> 代替。</pre><div class="contentsignin">登入後複製</div></div><div class="contentsignin">登入後複製</div></div><div class="contentsignin">登入後複製</div></div> </td> </tr> </table> <p>引用、引用和术语定义</p> <table> <tr> <td><p><strong>标签</strong></p></td> <td><p><strong>描述</strong></p></td> </tr> <tr> <td><p><abbr></abbr></p></td> <td><p>定义缩写。</p></td> </tr> <tr> <td><p><acronym></acronym></p></td> <td><p>定义首字母缩写。</p></td> </tr> <tr> <td> <p></p> <address></address> </td> <td><p>定义地址。</p></td> </tr> <tr> <td><p><bdo></bdo></p></td> <td><p>定义文字方向。</p></td> </tr> <tr> <td> <p></p> <blockquote></blockquote> </td> <td><p>定义长的引用。</p></td> </tr> <tr> <td><p><q></q></p></td> <td><p>定义短的引用语。</p></td> </tr> <tr> <td><p><cite></cite></p></td> <td><p>定义引用、引证。</p></td> </tr> <tr> <td><p><dfn></dfn></p></td> <td><p>定义一个定义项目。</p></td> </tr> </table> <p class="sycode"></p> <p class="sycode"></p> <p class="sycode"> </p> <p class="sycode"></p> <p class="sycode"></p> <p class="sycode"> </p> <p class="sycode"></p> <p class="sycode"></p> </div> </div> <div style="height: 25px;"> <div class="wzconBq" style="display: inline-flex;"> <span>相關標籤:</span> <div class="wzcbqd"> <a onclick="hits_log(2,'www',this);" href-data="https://www.php.cn/zh-tw/search?word=1、html基础学习第一天" target="_blank">1、HTML基础学习 第一天</a> </div> </div> <div style="display: inline-flex;float: right; color:#333333;">來源:php.cn</div> </div> <div class="wzconOtherwz"> <a href="https://www.php.cn/zh-tw/faq/269410.html" title="DIV+CSS 网页布局之:两列布局_html/css_WEB-ITnose"> <span>上一篇:DIV+CSS 网页布局之:两列布局_html/css_WEB-ITnose</span> </a> <a href="https://www.php.cn/zh-tw/faq/269412.html" title="DIV+CSS 网页布局之:三列布局_html/css_WEB-ITnose"> <span>下一篇:DIV+CSS 网页布局之:三列布局_html/css_WEB-ITnose</span> </a> </div> <div class="wzconShengming"> <div class="bzsmdiv">本網站聲明</div> <div>本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn</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="wzconZzwz"> <div class="wzconZzwztitle">作者最新文章</div> <ul> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh-tw/faq/1796639331.html">什麼是 NullPointerException,如何修復它?</a> </div> <div>2024-10-22 09:46:29</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh-tw/faq/1796629482.html">從新手到程式設計師:您的旅程從 C 基礎知識開始</a> </div> <div>2024-10-13 13:53:41</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh-tw/faq/1796628545.html">使用 PHP 解鎖 Web 開發:初學者指南</a> </div> <div>2024-10-12 12:15:51</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh-tw/faq/1796627928.html">揭秘 C:為新程式設計師提供一條清晰簡單的道路</a> </div> <div>2024-10-11 22:47:31</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh-tw/faq/1796627806.html">釋放您的編碼潛力:絕對初學者的 C 編程</a> </div> <div>2024-10-11 19:36:51</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh-tw/faq/1796627670.html">釋放你內心的程式設計師:C 絕對初學者</a> </div> <div>2024-10-11 15:50:41</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh-tw/faq/1796627643.html">使用 C 自動化您的生活:適合初學者的腳本和工具</a> </div> <div>2024-10-11 15:07:41</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh-tw/faq/1796627620.html">PHP 變得簡單:Web 開發的第一步</a> </div> <div>2024-10-11 14:21:21</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh-tw/faq/1796627574.html">使用 Python 建立任何東西:釋放創造力的初學者指南</a> </div> <div>2024-10-11 12:59:11</div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="https://www.php.cn/zh-tw/faq/1796627539.html">編碼的關鍵:為初學者釋放 Python 的力量</a> </div> <div>2024-10-11 12:17:31</div> </li> </ul> </div> <div class="wzconZzwz"> <div class="wzconZzwztitle">最新問題</div> <div class="wdsyContent"> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/zh-tw/wenda/175845.html" target="_blank" title="按鈕啟動導致懸停效果故障" class="wdcdcTitle">按鈕啟動導致懸停效果故障</a> <a href="https://www.php.cn/zh-tw/wenda/175845.html" class="wdcdcCons">我一直在努力學習網頁開發的基礎知識(HTML、CSS和JS),所以我一直在嘗試製作一個可用的蘋果計算器。一切都工作正常,直到我注意到一個小錯誤。一開始,操作按鈕上的懸停效果很好,當...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan"> 來自於 2024-04-01 21:51:26</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"><b class="wdcdcirpli"></b>1</div> <div class="wdcdcirwatch flexRow ira"><b class="wdcdcirwatchi"></b>396</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> </div> </div> <div class="wzconZt" > <div class="wzczt-title"> <div>相關專題</div> <a href="https://www.php.cn/zh-tw/faq/zt" target="_blank">更多> </a> </div> <div class="wzcttlist"> <ul> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh-tw/faq/esdssmwj"><img src="https://img.php.cn/upload/subject/202407/22/2024072214114576965.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="ESD是什麼文件" /> </a> <a target="_blank" href="https://www.php.cn/zh-tw/faq/esdssmwj" class="title-a-spanl" title="ESD是什麼文件"><span>ESD是什麼文件</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh-tw/faq/articlebqyldy"><img src="https://img.php.cn/upload/subject/202407/22/2024072213322159054.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="article標籤用來定義什麼" /> </a> <a target="_blank" href="https://www.php.cn/zh-tw/faq/articlebqyldy" class="title-a-spanl" title="article標籤用來定義什麼"><span>article標籤用來定義什麼</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh-tw/faq/parsererror"><img src="https://img.php.cn/upload/subject/202407/22/2024072213370949121.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="parsererror錯誤怎麼解決" /> </a> <a target="_blank" href="https://www.php.cn/zh-tw/faq/parsererror" class="title-a-spanl" title="parsererror錯誤怎麼解決"><span>parsererror錯誤怎麼解決</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh-tw/faq/dnkjhhpjrzm"><img src="https://img.php.cn/upload/subject/202407/22/2024072213325612805.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="電腦開機後黑屏進入不了桌面怎麼解決" /> </a> <a target="_blank" href="https://www.php.cn/zh-tw/faq/dnkjhhpjrzm" class="title-a-spanl" title="電腦開機後黑屏進入不了桌面怎麼解決"><span>電腦開機後黑屏進入不了桌面怎麼解決</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh-tw/faq/jspxnkjzmpz"><img src="https://img.php.cn/upload/subject/202407/22/2024072213493813349.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="jsp虛擬空間怎麼配置" /> </a> <a target="_blank" href="https://www.php.cn/zh-tw/faq/jspxnkjzmpz" class="title-a-spanl" title="jsp虛擬空間怎麼配置"><span>jsp虛擬空間怎麼配置</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh-tw/faq/sqlcxyjdq"><img src="https://img.php.cn/upload/subject/202407/22/2024072213461414126.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="SQL查詢語句大全" /> </a> <a target="_blank" href="https://www.php.cn/zh-tw/faq/sqlcxyjdq" class="title-a-spanl" title="SQL查詢語句大全"><span>SQL查詢語句大全</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh-tw/faq/smscss"><img src="https://img.php.cn/upload/subject/202407/22/2024072214211465937.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="什麼是css" /> </a> <a target="_blank" href="https://www.php.cn/zh-tw/faq/smscss" class="title-a-spanl" title="什麼是css"><span>什麼是css</span> </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/zh-tw/faq/afpssm"><img src="https://img.php.cn/upload/subject/202407/22/2024072214305473305.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="adobe flash player是什麼" /> </a> <a target="_blank" href="https://www.php.cn/zh-tw/faq/afpssm" class="title-a-spanl" title="adobe flash player是什麼"><span>adobe flash player是什麼</span> </a> </li> </ul> </div> </div> </div> </div> <div class="phpwzright"> <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="wzrOne"> <div class="wzroTitle">熱門推薦</div> <div class="wzroList"> <ul> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="url是什麼意思?" href="https://www.php.cn/zh-tw/faq/418772.html">url是什麼意思?</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="DOM是什麼意思" href="https://www.php.cn/zh-tw/faq/414303.html">DOM是什麼意思</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="如何改變圖片大小" href="https://www.php.cn/zh-tw/faq/414252.html">如何改變圖片大小</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="HTML中如何將字型加粗" href="https://www.php.cn/zh-tw/faq/414520.html">HTML中如何將字型加粗</a> </div> </li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="html圖片大小如何設定" href="https://www.php.cn/zh-tw/faq/475145.html">html圖片大小如何設定</a> </div> </li> </ul> </div> </div> <script src="https://sw.php.cn/hezuo/cac1399ab368127f9b113b14eb3316d0.js" type="text/javascript"></script> <div class="wzrThree"> <div class="wzrthree-title"> <div>熱門教學</div> <a target="_blank" href="https://www.php.cn/zh-tw/course.html">更多> </a> </div> <div class="wzrthreelist swiper2"> <div class="wzrthreeTab swiper-wrapper"> <div class="check tabdiv swiper-slide" data-id="one">相關教學 <div></div></div> <div class="tabdiv swiper-slide" data-id="two">熱門推薦<div></div></div> <div class="tabdiv swiper-slide" data-id="three">最新課程<div></div></div> </div> <ul class="one"> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/812.html" title="最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" alt="最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)"/> </a> <div class="wzrthree-right"> <a target="_blank" title="最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)" href="https://www.php.cn/zh-tw/course/812.html">最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)</a> <div class="wzrthreerb"> <div>1427222 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="812"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/74.html" title="php入門教程之一週學會PHP" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/6253d1e28ef5c345.png" alt="php入門教程之一週學會PHP"/> </a> <div class="wzrthree-right"> <a target="_blank" title="php入門教程之一週學會PHP" href="https://www.php.cn/zh-tw/course/74.html">php入門教程之一週學會PHP</a> <div class="wzrthreerb"> <div>4277042 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="74"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/286.html" title="JAVA 初級入門影片教學" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a2bacfd9379.png" alt="JAVA 初級入門影片教學"/> </a> <div class="wzrthree-right"> <a target="_blank" title="JAVA 初級入門影片教學" href="https://www.php.cn/zh-tw/course/286.html">JAVA 初級入門影片教學</a> <div class="wzrthreerb"> <div>2576403 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="286"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/504.html" title="小甲魚零基礎入門學習Python影片教學" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a67ce3a6655.png" alt="小甲魚零基礎入門學習Python影片教學"/> </a> <div class="wzrthree-right"> <a target="_blank" title="小甲魚零基礎入門學習Python影片教學" href="https://www.php.cn/zh-tw/course/504.html">小甲魚零基礎入門學習Python影片教學</a> <div class="wzrthreerb"> <div>509981 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="504"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/2.html" title="PHP 零基礎入門教學" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/6253de27bc161468.png" alt="PHP 零基礎入門教學"/> </a> <div class="wzrthree-right"> <a target="_blank" title="PHP 零基礎入門教學" href="https://www.php.cn/zh-tw/course/2.html">PHP 零基礎入門教學</a> <div class="wzrthreerb"> <div>867068 <b class="kclbcollectb"></b></div> <div class="courseICollection" data-id="2"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> </ul> <ul class="two" style="display: none;"> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/812.html" title="最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" alt="最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)"/> </a> <div class="wzrthree-right"> <a target="_blank" title="最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)" href="https://www.php.cn/zh-tw/course/812.html">最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)</a> <div class="wzrthreerb"> <div >1427222次學習</div> <div class="courseICollection" data-id="812"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/286.html" title="JAVA 初級入門影片教學" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a2bacfd9379.png" alt="JAVA 初級入門影片教學"/> </a> <div class="wzrthree-right"> <a target="_blank" title="JAVA 初級入門影片教學" href="https://www.php.cn/zh-tw/course/286.html">JAVA 初級入門影片教學</a> <div class="wzrthreerb"> <div >2576403次學習</div> <div class="courseICollection" data-id="286"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/504.html" title="小甲魚零基礎入門學習Python影片教學" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a67ce3a6655.png" alt="小甲魚零基礎入門學習Python影片教學"/> </a> <div class="wzrthree-right"> <a target="_blank" title="小甲魚零基礎入門學習Python影片教學" href="https://www.php.cn/zh-tw/course/504.html">小甲魚零基礎入門學習Python影片教學</a> <div class="wzrthreerb"> <div >509981次學習</div> <div class="courseICollection" data-id="504"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/901.html" title="Web前端開發極速入門" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/64be28a53a4f6310.png" alt="Web前端開發極速入門"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Web前端開發極速入門" href="https://www.php.cn/zh-tw/course/901.html">Web前端開發極速入門</a> <div class="wzrthreerb"> <div >216235次學習</div> <div class="courseICollection" data-id="901"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/234.html" title="零基礎精通 PS 影片教學" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62611f57ed0d4840.jpg" alt="零基礎精通 PS 影片教學"/> </a> <div class="wzrthree-right"> <a target="_blank" title="零基礎精通 PS 影片教學" href="https://www.php.cn/zh-tw/course/234.html">零基礎精通 PS 影片教學</a> <div class="wzrthreerb"> <div >898627次學習</div> <div class="courseICollection" data-id="234"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> </ul> <ul class="three" style="display: none;"> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/1648.html" title="【web前端】Node.js快速入門" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png" alt="【web前端】Node.js快速入門"/> </a> <div class="wzrthree-right"> <a target="_blank" title="【web前端】Node.js快速入門" href="https://www.php.cn/zh-tw/course/1648.html">【web前端】Node.js快速入門</a> <div class="wzrthreerb"> <div >8185次學習</div> <div class="courseICollection" data-id="1648"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/1647.html" title="國外Web開發全端課程全集" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/6628cc96e310c937.png" alt="國外Web開發全端課程全集"/> </a> <div class="wzrthree-right"> <a target="_blank" title="國外Web開發全端課程全集" href="https://www.php.cn/zh-tw/course/1647.html">國外Web開發全端課程全集</a> <div class="wzrthreerb"> <div >6501次學習</div> <div class="courseICollection" data-id="1647"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/1646.html" title="Go語言實戰之 GraphQL" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662221173504a436.png" alt="Go語言實戰之 GraphQL"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Go語言實戰之 GraphQL" href="https://www.php.cn/zh-tw/course/1646.html">Go語言實戰之 GraphQL</a> <div class="wzrthreerb"> <div >5391次學習</div> <div class="courseICollection" data-id="1646"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/1645.html" title="550W粉絲大佬手把手從零學JavaScript" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662077e163124646.png" alt="550W粉絲大佬手把手從零學JavaScript"/> </a> <div class="wzrthree-right"> <a target="_blank" title="550W粉絲大佬手把手從零學JavaScript" href="https://www.php.cn/zh-tw/course/1645.html">550W粉絲大佬手把手從零學JavaScript</a> <div class="wzrthreerb"> <div >739次學習</div> <div class="courseICollection" data-id="1645"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/zh-tw/course/1644.html" title="python大神Mosh,零基礎小白6小時完全入門" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/6616418ca80b8916.png" alt="python大神Mosh,零基礎小白6小時完全入門"/> </a> <div class="wzrthree-right"> <a target="_blank" title="python大神Mosh,零基礎小白6小時完全入門" href="https://www.php.cn/zh-tw/course/1644.html">python大神Mosh,零基礎小白6小時完全入門</a> <div class="wzrthreerb"> <div >27482次學習</div> <div class="courseICollection" data-id="1644"> <b class="nofollow small-nocollect"></b> </div> </div> </div> </li> </ul> </div> <script> var mySwiper = new Swiper('.swiper2', { autoplay: false,//可选选项,自动滑动 slidesPerView : 'auto', }) $('.wzrthreeTab>div').click(function(e){ $('.wzrthreeTab>div').removeClass('check') $(this).addClass('check') $('.wzrthreelist>ul').css('display','none') $('.'+e.currentTarget.dataset.id).show() }) </script> </div> <div class="wzrFour"> <div class="wzrfour-title"> <div>最新下載</div> <a href="https://www.php.cn/zh-tw/xiazai">更多> </a> </div> <script> $(document).ready(function(){ var sjyx_banSwiper = new Swiper(".sjyx_banSwiperwz",{ speed:1000, autoplay:{ delay:3500, disableOnInteraction: false, }, pagination:{ el:'.sjyx_banSwiperwz .swiper-pagination', clickable :false, }, loop:true }) }) </script> <div class="wzrfourList swiper3"> <div class="wzrfourlTab swiper-wrapper"> <div class="check swiper-slide" data-id="onef">網站特效 <div></div></div> <div class="swiper-slide" data-id="twof">網站源碼<div></div></div> <div class="swiper-slide" data-id="threef">網站素材<div></div></div> <div class="swiper-slide" data-id="fourf">前端模板<div></div></div> </div> <ul class="onef"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="jQuery企業留言表單聯絡程式碼" href="https://www.php.cn/zh-tw/toolset/js-special-effects/8071">[表單按鈕] jQuery企業留言表單聯絡程式碼</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="HTML5 MP3音樂盒播放特效" href="https://www.php.cn/zh-tw/toolset/js-special-effects/8070">[播放器特效] HTML5 MP3音樂盒播放特效</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="HTML5酷炫粒子動畫導覽選單特效" href="https://www.php.cn/zh-tw/toolset/js-special-effects/8069">[選單導航] HTML5酷炫粒子動畫導覽選單特效</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="jQuery可視化表單拖曳編輯程式碼" href="https://www.php.cn/zh-tw/toolset/js-special-effects/8068">[表單按鈕] jQuery可視化表單拖曳編輯程式碼</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="VUE.JS仿酷狗音樂播放器代碼" href="https://www.php.cn/zh-tw/toolset/js-special-effects/8067">[播放器特效] VUE.JS仿酷狗音樂播放器代碼</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="經典html5推箱子小遊戲" href="https://www.php.cn/zh-tw/toolset/js-special-effects/8066">[html5特效] 經典html5推箱子小遊戲</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="jQuery滾動添加或減少圖片特效" href="https://www.php.cn/zh-tw/toolset/js-special-effects/8065">[圖片特效] jQuery滾動添加或減少圖片特效</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="CSS3個人相簿封面懸停放大特效" href="https://www.php.cn/zh-tw/toolset/js-special-effects/8064">[相簿特效] CSS3個人相簿封面懸停放大特效</a> </div> </li> </ul> <ul class="twof" style="display:none"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8328" title="家居裝潢清潔維修服務公司網站模板" target="_blank">[前端模板] 家居裝潢清潔維修服務公司網站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8327" title="清新配色個人求職履歷引導頁模板" target="_blank">[前端模板] 清新配色個人求職履歷引導頁模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8326" title="設計師創意求職履歷網頁模板" target="_blank">[前端模板] 設計師創意求職履歷網頁模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8325" title="現代工程建築公司網站模板" target="_blank">[前端模板] 現代工程建築公司網站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8324" title="教育服務機構響應式HTML5模板" target="_blank">[前端模板] 教育服務機構響應式HTML5模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8323" title="網上電子書店商城網站模板" target="_blank">[前端模板] 網上電子書店商城網站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8322" title="IT技術解決互聯網公司網站模板" target="_blank">[前端模板] IT技術解決互聯網公司網站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8321" title="紫色風格外匯交易服務網站模板" target="_blank">[前端模板] 紫色風格外匯交易服務網站模板</a> </div> </li> </ul> <ul class="threef" style="display:none"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-materials/3078" target="_blank" title="可愛的夏天元素向量素材(EPS+PNG)">[PNG素材] 可愛的夏天元素向量素材(EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-materials/3077" target="_blank" title="四個紅色的 2023 畢業徽章的向量素材(AI+EPS+PNG)">[PNG素材] 四個紅色的 2023 畢業徽章的向量素材(AI+EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-materials/3076" target="_blank" title="唱歌的小鳥和裝滿花朵的推車設計春天banner向量素材(AI+EPS)">[banner圖] 唱歌的小鳥和裝滿花朵的推車設計春天banner向量素材(AI+EPS)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-materials/3075" target="_blank" title="金色的畢業帽向量素材(EPS+PNG)">[PNG素材] 金色的畢業帽向量素材(EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-materials/3074" target="_blank" title="黑白風格的山脈圖示向量素材(EPS+PNG)">[PNG素材] 黑白風格的山脈圖示向量素材(EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-materials/3073" target="_blank" title="不同顏色披風和不同姿勢的超級英雄剪影向量素材(EPS+PNG)">[PNG素材] 不同顏色披風和不同姿勢的超級英雄剪影向量素材(EPS+PNG)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-materials/3072" target="_blank" title="扁平風格的植樹節banner向量素材(AI+EPS)">[banner圖] 扁平風格的植樹節banner向量素材(AI+EPS)</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-materials/3071" target="_blank" title="九種漫畫風格的爆炸聊天氣泡向量素材(EPS+PNG)">[PNG素材] 九種漫畫風格的爆炸聊天氣泡向量素材(EPS+PNG)</a> </div> </li> </ul> <ul class="fourf" style="display:none"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8328" target="_blank" title="家居裝潢清潔維修服務公司網站模板">[前端模板] 家居裝潢清潔維修服務公司網站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8327" target="_blank" title="清新配色個人求職履歷引導頁模板">[前端模板] 清新配色個人求職履歷引導頁模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8326" target="_blank" title="設計師創意求職履歷網頁模板">[前端模板] 設計師創意求職履歷網頁模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8325" target="_blank" title="現代工程建築公司網站模板">[前端模板] 現代工程建築公司網站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8324" target="_blank" title="教育服務機構響應式HTML5模板">[前端模板] 教育服務機構響應式HTML5模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8323" target="_blank" title="網上電子書店商城網站模板">[前端模板] 網上電子書店商城網站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8322" target="_blank" title="IT技術解決互聯網公司網站模板">[前端模板] IT技術解決互聯網公司網站模板</a> </div> </li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="https://www.php.cn/zh-tw/toolset/website-source-code/8321" target="_blank" title="紫色風格外匯交易服務網站模板">[前端模板] 紫色風格外匯交易服務網站模板</a> </div> </li> </ul> </div> <script> var mySwiper = new Swiper('.swiper3', { autoplay: false,//可选选项,自动滑动 slidesPerView : 'auto', }) $('.wzrfourlTab>div').click(function(e){ $('.wzrfourlTab>div').removeClass('check') $(this).addClass('check') $('.wzrfourList>ul').css('display','none') $('.'+e.currentTarget.dataset.id).show() }) </script> </div> </div> </div> <footer> <div class="footer"> <div class="footertop"> <img src="/static/imghw/logo.png" alt=""> <p>公益線上PHP培訓,幫助PHP學習者快速成長!</p> </div> <div class="footermid"> <a href="https://www.php.cn/zh-tw/about/us.html">關於我們</a> <a href="https://www.php.cn/zh-tw/about/disclaimer.html">免責聲明</a> <a href="https://www.php.cn/zh-tw/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?1736512595"></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> <!-- Matomo --> <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> <!-- End Matomo Code --> </body> </html>