如果介绍HTML网页基本标签的嵌套规则,首先要说的就是元素的分类。元素可以划分为块级元素和行级元素,块级元素是什么?它可以独占一行,可以设置宽高度,默认是100%;行级元素与之相反,它的内容决定它的宽高度,至于特殊字符就当成是文字来看

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> HTML块级、行级元素,特殊字符,嵌套规则</title>
</head>
<body>
<!-- 块元素:独占一行,可以设置宽高、默认宽度100% -->
块元素分为文字类和容器类
文字类块元素:p、h1——h6
容器类块元素:div、table、tr、td、frame、ul>li、ol、dl、dt、dd(序列)
<!-- 行元素:不独占一行,宽高度取决于内容 -->
行元素:a img input strong em del span
特殊字符:文字 br &nbsp hr
</body>
</html>

嵌套规则总结如下几点:

1.块元素可以嵌套行元素2.行元素可以嵌套行元素3.行元素不可以嵌套块元素4.文字类块元素不可以嵌套块元素5.容器类块元素可以嵌套块元素

以下html网页基本概念、html网页基本结构、HTML基础标签图片文本超链接列表表格介绍、html基本标签表单实现交互原理,单选框,复选框,下拉框介绍、网页DIV+CSS布局与ifame传统布局对比的相关博文就是HTML的全部部分了,HTML的学习主要是了解它的语义化嵌套规则来构建页面,至于页面的CSS与交互逻辑JS则是下面要练习的内容!

HTML块级、行级元素,特殊字符,嵌套规则的更多相关文章

  1. 5.html基础标签:块级+行级元素+特殊字符+嵌套规则

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. css position 和 块级/行内元素解释

    一.position 属性: static:元素框正常生成.块级元素生成一个矩形框,作为文档流的一部分,行内元素则会创建一个或多个行框,置于其父元素中. relative:元素框偏移某个距离.元素仍保 ...

  3. 块级&行内元素总结

    一.块级元素与行内元素的区别 块级元素与行内元素有几个关键区别: 格式 默认情况下: 块级元素会新起一行: 行内元素不会以新行开始. 内容模型 一般块级元素可以包含行内元素和其他块级元素.这种结构上的 ...

  4. HTML中块级行级元素小分类

    行内元素列表: <a>标签可定义锚 <abbr>表示一个缩写形式 <acronym>定义只取首字母缩写 <b>字体加粗 <bdo>可覆盖默认 ...

  5. HTML标签部分(块级/行级)

    一.基本块级标签 1.HTML标签的分类:      a.块级标签:显示为块状,独占一行,自动换行.      b.行级标签:在一行中,从左往右依次排列,不会自动换行. 2.h标签(标题标签) h标签 ...

  6. [HTML5]块和内联元素的嵌套

    块元素可以包含块或内联元素,但是内联元素只能包含其他内联元素. <!-- 无效代码! :-( --> <strong> <p>你不应该把p元素放在 "st ...

  7. CSS 各类 块级元素 行级元素 水平 垂直 居中问题

    元素的居中问题是每个初学者碰到的第一个大问题,在此我总结了下各种块级 行级 水平 垂直 的居中方法,并尽量给出代码实例. 首先请先明白块级元素和行级元素的区别 行级元素 一块级元素 1 水平居中: ( ...

  8. CSS居中问题:块级元素和行级元素在水平方向以及垂直方向的居中问题

    元素的居中问题是每个初学者碰到的第一个大问题,在此我总结了下各种块级 行级 水平 垂直 的居中方法,并尽量给出代码实例. 首先请先明白块级元素和行级元素的区别 块级元素 块级元素水平居中 1:marg ...

  9. CSS块元素、行内元素、行内块元素的转换

    一.块元素转行内元素:display:inline 二.行内元素转块元素:display:block div{ display: inline; /*无效 width: 500px; height: ...

随机推荐

  1. C语言—期末小黄衫获奖感言

    小黄衫获奖感言 一,感谢环节 非常感谢邹欣,周筠老师给提供的小黄衫,我非常荣幸的能够获得这个奖项,我感到无比自豪.感谢两位老师对教学事业的大力支持,对我们学生的亲切关怀.同时感谢我的C语言老师彭琛(琛 ...

  2. Java 数据持久化系列之池化技术

    在上一篇文章<Java 数据持久化系列之JDBC>中,我们了解到使用 JDBC 创建 Connection 可以执行对应的SQL,但是创建 Connection 会消耗很多资源,所以 Ja ...

  3. reactNative-解决react native使用fetch函数 Network request failed 问题

    解决react native使用fetch函数Network request failed问题 最近公司新开发一个app, 用react native架构好后,用xcode模拟器打开app,对接登陆接 ...

  4. Linux 安装tomcat及tomcat自带远程部署项目与管理

    准备: 1.Linux系统 2.已经安装好jdk 开始: 选择要安装的tomcat版本:https://archive.apache.org/dist/tomcat/ 我这里使用的是tomcat 8. ...

  5. 再谈typedef(重点为函数指针)

    有种很方便的写法. typedef int *p: p pointer: 这时直接把pointer带入原式中,取代p然后去掉typedef,得到的结果就是int * pointer: 哈哈,这样直接替 ...

  6. LeetCode 547. Friend Circles 朋友圈(C++/Java)

    题目: https://leetcode.com/problems/friend-circles/ There are N students in a class. Some of them are ...

  7. Bayesian Non-Exhaustive Classification A case study:online name disambiguation using temporal record streams

    一 摘要: name entity disambiguation:将对应多个人的记录进行分组,使得每个组的记录对应一个人. 现有的方法多为批处理方式,需要将所有的记录输入给算法. 现实环境需要1:以o ...

  8. python 迭代器和生成器详解

    一.迭代器 说迭代器之前有两个相关的名词需要介绍:可迭代对象:只要定义了__iter__()方法,我们就说该对象是可迭代对象,并且可迭代对象能提供迭代器.迭代器:实现了__next__()或者next ...

  9. CCF_ 201403-3 _命令行选项

    不要怀疑,这题跟CCF_201604-3_路径解析一样恶心,很多中情况,要仔细读题,注意细节. 写的比较乱. #include<iostream> #include<cstdio&g ...

  10. CCF_201604-3_路径解析

    没有用stack来写,直接用了字符串和指针,过程有点复杂的.首先对读入的每一个路径,判断它是绝对路径或者相对路径,然后确定起始的路径,然后继续一位位的判断,"//","/ ...