标签：浏览器 序列表 W3School 无序 列表 HTML HTML5
无序列表：
把W3School这个网站有关HTML 5的介绍，做成一个无序列表：
代码如下：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>我的光荣与梦想</title> 5 <meta http-equiv="Content-Type" content = 6 "text/html;charset = utf-8"/> 7 </head> 8 <body> 9 <h2>HTML 5</h2> 10 <ul> 11 <li><font size = "4">HTML 5是下一代的HTML。</font></li> 12 <li><font size = "4">HTML 5仍处于完善之中。然而，大部分现代浏览器已经具备了某些 HTML5 支持。</font></li> 13 <li><font size = "4">在 W3School 的 HTML 5 教程中，您将了解 HTML5 中的新特性。</font></li> 14 <li><font size = "4" color = "red"><u>现在就开始学习HTML 5!</u></font></li> 15 <!-- <u></u>表示给字体添加下划线 --> 16 </ul> 17 </body> 18 </html>
在以上代码中：做成无序列表的效果，需要用到标签<ul></ul>，然后在里面用<li></li>表示列表项。其余就很简单了。
效果：
除此之外，无序列表列表项前面的那个小点也是可以更改的，通过type属性来更改，来看代码：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>我的光荣与梦想</title> 5 <meta http-equiv="Content-Type" content = 6 "text/html;charset = utf-8"/> 7 </head> 8 <body> 9 <h2>HTML 5</h2> 10 <ul type = "disc"> 11 <li><font size = "4">HTML 5是下一代的HTML。</font></li> 12 <li><font size = "4">HTML 5仍处于完善之中。然而，大部分现代浏览器已经具备了某些 HTML5 支持。</font></li> 13 <li><font size = "4">在 W3School 的 HTML 5 教程中，您将了解 HTML5 中的新特性。</font></li> 14 <li><font size = "4" color = "red"><u>现在就开始学习HTML 5!</u></font></li> 15 </ul> 16 <hr/> 17 <!-- <u></u>表示给字体添加下划线 --> 18 <ul type = "circle"> 19 <li><font size = "4">HTML 5是下一代的HTML。</font></li> 20 <li><font size = "4">HTML 5仍处于完善之中。然而，大部分现代浏览器已经具备了某些 HTML5 支持。</font></li> 21 <li><font size = "4">在 W3School 的 HTML 5 教程中，您将了解 HTML5 中的新特性。</font></li> 22 <li><font size = "4" color = "red"><u>现在就开始学习HTML 5!</u></font></li> 23 </ul> 24 <hr/> 25 <ul type = "square"> 26 <li><font size = "4">HTML 5是下一代的HTML。</font></li> 27 <li><font size = "4">HTML 5仍处于完善之中。然而，大部分现代浏览器已经具备了某些 HTML5 支持。</font></li> 28 <li><font size = "4">在 W3School 的 HTML 5 教程中，您将了解 HTML5 中的新特性。</font></li> 29 <li><font size = "4" color = "red"><u>现在就开始学习HTML 5!</u></font></li> 30 </ul> 31 </body> 32 </html>
设置type="disc","circle","square"来改变，效果如下图：
标签：浏览器,序列表,W3School,无序,列表,HTML,HTML5 来源： https://www.cnblogs.com/EvanTheGreat/p/14358950.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。