通俗的理解html子元素与后代元素的区别
时间:2016-06-25
在WEB网页中,我们经常听到子元素和后代元素这两个术语,那么这两个术语到底有什么却别?,什么是子元素,什么是后代元素,二者如何区别?本文章通过实例向大家介绍子元素与后代元素概念和区别。
首先我们来看一个简单的html代码:
<ul>
<li>
<a href="http://www.manongjc.com">码农教程</a>
</li>
<ul>
我们将从这个html代码中来了解什么子元素,什么是后代元素。
首先来看a元素,a元素是li标签的子元素,是ul标签的后代元素
再来看li元素,li元素是ul的子元素
从上面我们可以这样通俗的来理解子元素和后代元素:
子元素:子元素就是儿子,上面实例中,a元素是li的儿子,所以他是li元素的子元素。
后代元素:后代元素是指孙子、曾孙子、曾曾孙子等等。a元素是ul标签的孙子,所以a元素是ul标签的后代元素。
最后通过HTML来标注一下子元素与后代元素:
<ul>//我是爷爷 哈哈
<li>//我是爸爸,
<a href="http://www.manongjc.com">码农教程</a>//我是ul的后代元素,li的子元素
</li>
<ul>
相信大家应该可以理解。
- 更精准!英研究人员利用AI监测预防城市洪水
- 物联网平台的采用将成为2018年首要IT发展趋势
- python基础随笔
- Mysql+Keepalived双主热备高可用操作记录
- Mysql双主热备+LVS+Keepalived高可用操作记录
- 被曝大裁员!曲德君坚称万达网科没有倒下、目标决心不变
- Linux下smokeping网络监控环境部署记录
- Linux下的rsyslog系统日志梳理(用户操作记录审计)
- 数据结构之数组封装
- Centos下内网NDS主从环境部署记录
- 一搜解决,微信的这个功能厉害了!
- Saltstack自动化操作记录(2)-配置使用
- Saltstack自动化操作记录(1)-环境部署
- CentOS源码编译安装Nginx和tcp_proxy module
- HTML 教程
- HTML 简介
- html div 标签介绍
- html span 标签介绍
- html a 超链接标签
- HTML Br换行标签介绍
- HTML P段落标签介绍
- HTML br与p标签区别
- Html H 标题标签
- html px em pt长度单位
- HTML form 标签
- HTML radio 单选框
- HTML B 加粗标签
- HTML strong加粗粗体标签
- HTML em 强调标签
- HTML i 斜体标签
- HTML u下划线标签
- HTML s 删除线标签
- Html img 图片标签
- Html上标注sup与下标注sub标签
- HTML nobr 禁止换行标签
- HTML hr 水平线标签
- HTML label 标签
- HTML input 标签
- HTML textarea 标签
- HTML select下拉列表标签
- HTML checkbox 多选框
- HTML font color 标签
- HTML iframe 框架标签
- HTML Table 表格
- HTML dl dt dd 标签
- HTML ol li有序列表标签
- HTML ul li 无序列表标签
- HTML 注释
- CSS 教程
- CSS 简介
- CSS 语法
- CSS Id 和 Class选择器
- CSS 样式的创建
- CSS background 背景介绍
- CSS 文本样式
- CSS font 字体
- CSS A 链接
- CSS ul ol列表样式
- CSS TABLE 样式
- CSS 框模型
- CSS border 边框
- CSS Outlines 轮廓
- CSS 外边距 Margin
- CSS Padding 内边距
- CSS 分组和嵌套选择器
- CSS 尺寸 (Dimension)
- CSS Display 属性
- CSS Position 定位
- CSS Float 浮动
- CSS 水平对齐(Horizontal Align)
- CSS 组合选择符
- CSS 伪类
- CSS 伪元素
- CSS 导航栏
- CSS 下拉菜单
- CSS 图片廊
- CSS 图像透明/不透明
- CSS sprite 图像拼合技术
- CSS 媒体类型
- CSS 属性选择器
- CSS 实例
- buffalo-命令
- deepin下安装向日葵依赖问题
- 前端踩坑系列《二》
- Markdown语法
- 配置ssh免密登陆,并使用命令行与服务器交互
- 使用scp进行与服务器的文件交互(上传和下载)
- Python 技术篇-文件操作:本地文件重命名
- 3种方法加密Python文件
- 用两个栈实现队列
- Python+selenium 自动化-selenium自带的截图功能
- PyQt5 技巧篇-便于文字排版的等宽字体推荐,中文为英文两倍宽字体
- php List()函数及json_encode时无法转为数组的问题
- Python 技术篇-邮件发送并展示本地图片
- PHP变量传递值的方法
- Python 技术篇-邮件发送各种类型的附件