根据元素本身特点来分类:

  1. 替换元素
    替换元素根据其标签和属性来决定元素的具体显示内容.有<img><input><textarea><select><object>。
    替换一般有内在尺寸即img默认的是其图片的宽高,input也有默认的尺寸。img和input的宽高可以设定。
  2. 不可替换元素。
    即将内容直接表现给用户端。

块级元素和行内元素

  1. 块级元素,独占一行。可设置宽高。
  2. 行内元素。左右可以有其他元素在同一行。
    几乎所有替换元素都是行内元素。
    行内元素的宽高大多是auto*auto。但其中包含的替换元素都可以直接设置宽高。如img input textarea等等
    要设置其宽高可以display:inline-block;再设置宽高。

html元素两种分类。替换元素和不可替换元素;块级元素和行内元素的更多相关文章

  1. 【CSS3】块级元素与行内元素的区别

    一.行内元素与块级函数的三个区别 行内元素的特点: 和其他元素都在一行上: 高,行高及外边距和内边距部分可改变: 宽度只与内容有关: 行内元素只能容纳文本或者其他行内元素. 行内元素设置width无效 ...

  2. 【HTML】行内元素与块级元素

    一.行内元素与块级元素的三个区别 1.行内元素与块级元素直观上的区别 行内元素会在一条直线上排列,都是同一行的,水平方向排列 块级元素各占据一行,垂直方向排列.块级元素从新行开始结束接着一个断行. 2 ...

  3. python 全栈开发,Day48(标准文档流,块级元素和行内元素,浮动,margin的用法,文本属性和字体属性)

    昨日内容回顾 高级选择器: 后代选择 : div p 子代选择器 : div>p 并集选择器: div,p 交集选择器: div.active 属性选择器: [属性~='属性值'] 伪类选择器 ...

  4. {03--CSS布局设置} 盒模型 二 padding bode margin 标准文档流 块级元素和行内元素 浮动 margin的用法 文本属性和字体属性 超链接导航栏 background 定位 z-index

    03--CSS布局设置 本节目录 一 盒模型 二 padding(内边距) 三 boder(边框) 四 简单认识一下margin(外边距) 五 标准文档流 六 块级元素和行内元素 七 浮动 八 mar ...

  5. padding(内边框), border(边框), margin, 标准文档流, 块级元素和行内元素, 浮动 ,margin的用法

    盒模型 在CSS中,"box model"这一术语是用来设计和布局时使用,然后在网页中基本上都会显示一些方方正正的盒子.我们称为这种盒子叫盒模型. 盒模型有两种:标准模型和IE模型 ...

  6. css块级元素和行内元素详细解析

    块级元素和行内元素是布局中常见的两种基本元素,但是未必有很多人深入的研究它们的细微差别. 常见块级元素:div  p  form ul ol li 等: 常见的行内元素:span stronh em; ...

  7. CSS标准文档流 块级元素和行内元素

    标准文档流 什么是标准文档流 宏观的将,我们的web页面和ps等设计软件有本质的区别,web 网页的制作,是个“流”,从上而下 ,像 “织毛衣”.而设计软件 ,想往哪里画东西,就去哪里画 空白折叠现象 ...

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

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

  9. 行内元素的padding和margin是否无效

    html中元素分为三种:块级元素.行内元素(也叫内联元素),内联块级元素. 常用块级元素:<div>.<p>.<h1>...<h6>.<ol> ...

随机推荐

  1. Nagios+InfluxDB+Grafana

    1. 概述 Nagios负责收集数据,是一款开源的免费网络监视工具. influxDB负责存储数据,是一个开源的时间序列数据库.比较适合存储监控或者部署记录这些时序数据. Grafana负责数据的图形 ...

  2. ORM之PetaPoco

    近端时间从推酷app上了解到C#轻微型的ORM框架--PetaPoco.从github Dapper 开源项目可以看到PetaPoco排第四 以下是网友根据官方介绍翻译,这里贴出来. PetaPoco ...

  3. WDF(Windows Driver Frameworks)驱动框架源码!!

    微软官方提供源码:https://github.com/Microsoft/Windows-Driver-Frameworks

  4. jQuery find()方法 eq()方法

    find() 使用: 返回 <ul> 后代中所有的 <span> 元素: $(document).ready(function(){$("ul").find ...

  5. fzu月赛(2015.11)(思维)

    Problem 2205 据说题目很水 Sunday最近对图论特别感兴趣,什么欧拉回路什么哈密顿回路,又是环又是树.在看完一本书后,他对自己特别有信心,便找到大牛牛犇犇,希望他出一题来考考自己. 在遥 ...

  6. request.getSession()、reqeust.getSession(false)和request.getSession(true)

    getSession()/getSession(true):当session存在时返回该session,否则新建一个session并返回该对象 getSession(false):当session存在 ...

  7. 做point data的切面的时候的注意事项

    正确的顺序应该是: 先导入cell data,再转换为point data,再做切面.结果如下: 如果这里导入cell data以后先做了切面再转换为point data,结果就是这样的: 很明显中间 ...

  8. Angular material mat-icon 资源参考_Maps

    ul,li>ol { margin-bottom: 0 } dt { font-weight: 700 } dd { margin: 0 1.5em 1.5em } img { height: ...

  9. BZOJ - 3166 可持久化Trie 维护次大区间

    题意:给出\(a[1...n]\),找出一个连续区间\(a[l...r],r>l\),令该区间的次大值为\(a_k\),使得\(a_k⊕a_i,l≤i≤r\)最大,输出全局最优解 (这题意有点别 ...

  10. vue源码-检查对象是否全相等

    /** * Check if two values are loosely equal - that is, * if they are plain objects, do they have the ...