<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!--
块元素:独立成一行(相当于标签前后都设置了br),可以设置宽高,默认宽高100%
文字类块元素:hl~h6
容器类块元素:div table tr td th form ul li ol dl dt dd
行元素:不独立成一行,不可以设置宽高,宽高由内容决定
a img input strong em del span
特殊字符:文字br &nbsp;
--> 嵌套规则
1.块元素可以嵌套行元素
<div>这是div<a href="">这是a</a></div> 2.行元素可以嵌套行元素
<a href="">这是个<strong>a</strong></a> 3.行元素不可以嵌套块元素
<a href=""><div></div></a> 4.文字类块元素不可以嵌套块元素
<p>这是一这是一段这是一段这是一段段</p> 5.容器类块素可以嵌套块元素
<div><p></ps <p>k/p></div> </body>
</html>

5.html基础标签:块级+行级元素+特殊字符+嵌套规则的更多相关文章

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

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

  2. HTML常用的标签中,行内元素和块级元素

    块元素(block element) HTML标签分类明细 * address - 地址 * blockquote - 块引用 * center - 举中对齐块 * dir - 目录列表 * div ...

  3. img标签到底是行内元素还是块级元素

    面试官问你<img>是什么元素时你怎么回答 写这篇文章源自我之前的一次面试,题目便是问img标签属于块级元素还是行内元素,当时想都没想就说了是行内(inline)元素,面试官追问为什么能够 ...

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

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

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

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

  6. 块级&行内元素总结

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

  7. CSS 一些基础知识(优先级、行内元素的一些属性、font-size单位) 怎样不加载图片

    CSS大小写不敏感 选择器优先级如下所示: 在属性后面使用 !important 会覆盖页面内任何位置定义的元素样式. 作为style属性写在元素内的样式 id选择器 类选择器 标签选择器 通配符选择 ...

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

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

  9. python 全栈开发,Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)

    一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...

随机推荐

  1. RK3288 mipi屏参数配置文件

    RK3288     Android 5.1系统     Linux 3.10 mipi屏参数配置文件所在的路径:kernel/arch/arm/boot/dts/xxx_mipi.dtsi 屏参数配 ...

  2. lastIndexOf() 找出指定元素出现的所有位置(返回的是下标数组)---lastIndexOf() 这个方法是倒叙查找,正序的是indexOf()

    var indices = []; var array = ['a', 'b', 'a', 'c', 'a', 'd']; var element = 'a'; var idx = array.las ...

  3. jquery.validate和jquery.form配合实现验证表单后AJAX提交

    基础代码其实很简单,之后一点一点扩充.最终代码写在最后. 表单: <form action="@Url.Action("AddColumns","Cont ...

  4. mongodb-MYSQL

    #encoding:utf8 import pymongoimport MySQLdbimport randomdef GetMongoData(): MyQuery = Mongo_Tab.find ...

  5. 十四、ChainOfResponsibility 责任链模式

    设计: 代码清单: Trouble: public class Trouble { private int number; public Trouble(int number){ this.numbe ...

  6. 十二、Decorator 装饰器模式

    设计: 代码清单: Display public abstract class Display { public abstract int getColumns(); public abstract ...

  7. Django 的ORM 数据操作

    from teatcher.models import Student      导入app(teatcher)下的模型(Student) In [11]: res = Student.objects ...

  8. gcc 与 g++的区别

    原文: http://www.cnblogs.com/wb118115/p/5969775.html ------------------------------------------------- ...

  9. JDK、JRE、JVM的区别

    JDK: JDK(Java Development Kit)顾名思义它是给开发者提供的开发工具箱,是给程序开发者用的.它除了包括完整的JRE(Java Runtime Environment),Jav ...

  10. Python练习-高阶函数-2018.12.03

    1.函数式编程的概念 在计算机的层次上,CPU执行的是加减乘除的指令代码,以及各种条件判断和跳转指令,所以,汇编语言是最贴近计算机的语言. 而计算则指数学意义上的计算,越是抽象的计算,离计算机硬件越远 ...