您的位置：首页 > Web前端 > HTML5

讲给Android程序员看的前端教程(06)——HTML5标签(5)

2017-11-27 09:18 856 查看

版权声明

本文原创作者：谷哥的小弟

作者博客地址：http://blog.csdn.net/lfdfhl

本文视频教程：http://www.stay4it.com/my/course/37

课程安排

HTML不是程序设计语言，而是一种标记语言，它用一些标记、标签来说明文本的显示效果。要制作网页和建立网站，就必须对HTML语言有所了解。客观地讲：HTML标签没有多少逻辑性而言，为了大家更好的理解和记忆，我们对这些标签进行分门别类的讲解，主要分为：

HTML常用标签

HTML文本标签

HTML语义标签

HTML结构标签

HTML列表标签

HTML表格标签

HTML表单标签

HTML新增标签和API

嗯哼，来吧，我们继续HTML5标签的学习。咋了？你竟然有点担心学不会！？别逗了，这部分和我们常写的Java比起来简单多了，它的逻辑性也弱得多。所以，大胸弟你大可放心，就像看电影那样：一手拿着爆米花，一手拿着可乐，也完全可以看懂本教程。

之前，我们已经学习了HTML常用标签、HTML文本标签、HTML语义标签、HTML结构标签；现在我们来继续学习HTML列表标签。

HTML列表标签

在此学习HTML中常用的列表标签

ul标签

可能猛地一下看到ul不知道它是干嘛的。可是，如果我告诉你它源自于英语短句unordered list，你是否就反应过来了呢？对的，它用于表示无序列表。请看如下示例：

<ul>
<li>华为</li>
<li>三星</li>
<li>小米</li>
<li>锤子</li>
</ul>

ol标签

看到ol，调皮的同学一下子就想到了office lady，于是乎就开始莫名地兴奋了，白领，制服，丝袜。。。。。浮想联翩。嗯哼，不好意思，你想多了，此处的ol源自于英语短句ordered list，它用于表示有序列表。请看如下示例：

<ol>
<li>华为</li>
<li>三星</li>
<li>小米</li>
<li>锤子</li>
</ol>

dl标签

dl标签表示定义一个定义列表，它源于英语短句definition list。请看如下示例：

<dl>
<dt>Android四大组件</dt>
<dd>Activity</dd>
<dd>广播接收者</dd>
<dd>内容提供者</dd>
<dd>服务</dd>
<dt>Android常用布局</dt>
<dd>线性布局</dd>
<dd>相对布局</dd>
<dd>百分比布局</dd>
</dl>

源码和页面

在此，附上刚才所讲标签时涉及到的源码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML的列表标签</title>
</head>
<body>

<!-- ul标签用于无序列表 -->
<ul>
<li>华为</li>
<li>三星</li>
<li>小米</li>
<li>锤子</li>
</ul>
<br>

<!-- ol标签用于有序列表 -->
<ol>
<li>华为</li>
<li>三星</li>
<li>小米</li>
<li>锤子</li>
</ol>
<br>

<!-- dl标签用于定义术语列表-->
<dl>
<dt>Android四大组件</dt>
<dd>Activity</dd>
<dd>广播接收者</dd>
<dd>内容提供者</dd>
<dd>服务</dd>
<dt>Android常用布局</dt>
<dd>线性布局</dd>
<dd>相对布局</dd>
<dd>百分比布局</dd>
</dl>

</body>
</html>

页面在谷歌浏览器的显示效果如下图：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航