起因:在做项目时发现原本在DW中无误的代码到了MyEclipse6.0里面却提示N多错误,甚是诧异。于是究其原因,发现块级元素P内是不能嵌套DIV的。

深究:我们先来认识in-line内联元素和block-line块元素,因为HTML里几乎所有元素都属于内联元素或者块元素中的一种。

in-line这个词有很多种解释:内嵌、内联、行内、线级等,但是,它们都是表示相同的意思,在这里我们选择习惯的叫法–内联。

先看下面的例子你就能明白两者的差别:

测试一下块元素与内联元素的差别

测试一下

块元素

与内联元素的差别

效果如下图:

在上面的例子中,

会自己产生一个新的行,而 并没有换行,这是在没有CSS渲染的情况下才这样,同样,我们 也可以通过CSS把div定义成内联元素,把span定义成块元素,但是,我们却不能在HTML里任意转化它们,块元素可以包含内联元素或某些块元素(上 面的例子其实是错误的使用—>我把

放在

里面了) ,但内联元素却不能包含块元素,它只能包含其他的内联元素,再看看这个:

我喜欢在WEB开发讨论Web标准的原因。

其中

是属于块元素,而是属于内联元 素,

包含

下面html标签元素中不属于块元素的是,HTML中为何P标签内不可包含块元素?相关推荐

  1. p标签内不能包含块级元素

    发现一个不常用的冷知识 学html的时候,以为块级元素可以包含任意的块级元素 事实并非如此,p标签是不可以包含任何跨级元素的 有些块元素不可以包含另一些块元素  ,DTD中规定了块级元素是不能放在P里 ...

  2. 你真的了解CSS包含块么?

    我所了解的CSS包含块 包含块有什么作用呢?下文接下来带你知晓 ↓↓↓↓↓↓↓ 文章目录 我所了解的CSS包含块 指出错误观念 什么是包含块? 根元素包含块 其他元素的包含块 如何确定元素的包含块? ...

  3. html中怎样选择第几个,CSS选取第几个标签元素:first-child、last-child、nth-child

    1.first-child first-child表示选择列表中的第一个标签.代码如下: li:first-child{background:#090} 上面的意思是,li 列表中的 第一个li模块的 ...

  4. CSS3与页面布局学习笔记(二)——盒子模型(Box Model)、边距折叠、内联与块标签、CSSReset

    一.盒子模型(Box Model) 盒子模型也有人称为框模型,HTML中的多数元素都会在浏览器中生成一个矩形的区域,每个区域包含四个组成部分,从外向内依次是:外边距(Margin).边框(Border ...

  5. html语言中标记h1代表什么,HTML5中的标题标记(H1内部的P)中是否有段落元素是否有效?...

    实际上,没有.根据W3C,此标记不正确.你应该避免使用它. It is stated,标题元素的正确内容是"短语内容",它是与正常字符数据混合的phrasing elements. ...

  6. a标签去掉下划线_html常用标签、包含关系、常用术语,以及网页设计中的字体分类

    字体的分类: serif (衬线字体){在笔画上面有些特殊的修饰效果} sans-serif (非衬线字体){横平竖直.横就是横,点就是点} monospace ( 等宽字体) cursive ( 草 ...

  7. Box Model,边距折叠,内联和块标签,CSSReset

    一.盒子模型(Box Model) 1.1.宽度测试 1.2.溢出测试 1.3.box-sizing属性 1.4.利用CSS画图 二.边距折叠 2.1.概要 2.2.垂直方向外边距合并计算 三.内联与 ...

  8. CSS3与页面布局——Box Model、边距折叠、内联与块标签、CSSReset

    一.盒子模型(Box Model) 盒子模型也有人称为框模型,HTML中的多数元素都会在浏览器中生成一个矩形的区域,每个区域包含四个组成部分,从外向内依次是:外边距(Margin).边框(Border ...

  9. CSS3与页面布局学习总结(二)——Box Model、边距折叠、内联与块标签、CSSReset...

    CSS3与页面布局学习总结(二)--Box Model.边距折叠.内联与块标签.CSSReset 目录 一.盒子模型(Box Model) 1.1.宽度测试 1.2.溢出测试 1.3.box-sizi ...

最新文章

  1. [安卓基础] 006.打开另一个Activity
  2. PHP json_encode不转义中文
  3. Android应用Activity、Dialog、PopWindow、Toast窗体加入机制及源代码分析
  4. 『设计模式』写代码偷懒小技巧,程序开发大智慧--享元模式
  5. 统信uos系统考试题_148款!富士通及旗下晟拓品牌系列打印机适配统信UOS
  6. DSP定点与浮点计算
  7. WordPress实践:上传文件时提示“缺少临时文件夹”
  8. scala 基础 —— 函数(柯里化)
  9. python网页爬虫菜鸟教程_Python爬虫实践(7)-抓取菜鸟教程python学习路线-工具-站长头条...
  10. 基于python实现微信公众号爬虫_基于Python实现微信公众号爬虫进行数据分析
  11. 大话西游手游网易版最新服务器,大话西游手游网易版
  12. Google退出中国的影响分析
  13. PLC也能制作小游戏----Codesys编写猜数字小游戏
  14. 我的前端故事----疯狂倒计时(requestAnimationFrame)
  15. 2021-08-04 jQuery基础整理 17-30 代码复制即可运行
  16. 视频号将成为大众的生活方式
  17. WOS(五)——字段标识
  18. 计算机基础课程听课记录,听课记录-计算机应用基础
  19. Vertica资源池
  20. 135编辑器图片裁切功能

热门文章

  1. 教你怎么0基础学编程
  2. Python判断奇偶数
  3. C语言(四):程序流程结构
  4. 蚂蚁金服原副总裁漆远加盟复旦大学,任人工智能院长
  5. 2022OUC软件工程第二次作业-08组
  6. 阿里云HPC助力新制造 | 上汽仿真计算云SSCC
  7. Notepad++ 下载地址
  8. java解析文件_Java读取文件方法大全
  9. 如何设计好软硬结合板的小技巧来啦~ 22021/11/22
  10. windows python keylogger