按照显示元素分类:

  • 行内元素(lnline-element):元素的高度,行高,顶底边距由元素所包含的图片或文字所决定,不可改变;其宽度为内容文字或图片的宽度所决定,而其左右边距可人为设置。 行内元素的水平方向的padding-left,padding-right,margin-left,margin-right 都产生边距效果,但是竖直方向的padding-top,padding-bottom,margin-top,margin-bottom都不会产生边距效果。(水平方向有效,竖直方向无效)(<a>、<span>、<strong>)
  • 块级元素(block-element):总是独占一行,元素占据的高度,顶底左右边距可以人为设置;其宽度缺省为所在容器的100%,可人为设置;(<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>)
  • 空元素(void-element):即没有内容的HTML元素,例如:br、meta、hr、link、input、img

按照元素是否可替换分类:

  • 替换元素:浏览器根据其标签的元素与属性来判断显示具体的内容。

    比如:<input   type="text" />,这是一个文本输入框,换一个其他的时候,浏览器显示就不一样

    (X)HTML中的<img>、<input>、<textarea>、<select>、<object>都是替换元素,这些元素都没有实际的内容。

  • 非替换元素: (X)HTML 的大多数元素是不可替换元素,他们将内容直接告诉浏览器,将其显示出来。

    比如<p>wanmei.com</p>

    浏览器将把这段内容直接显示出来。

  • 备注:行内替换元素的属性和行内块元素一致,竖直方向也能产生效果,几乎所有的可替换元素都是行内元素,例如<img>、<input>等等

最新文章

  1. vue-router(2.0)
  2. Online, Asynchronous Schema Change in F1
  3. Facebook Hacker Cup 2014 Qualification Round
  4. ehcache 的配置
  5. Thinkphp 验证码、文件上传
  6. Windows下Apache部署Django过程记录
  7. django模板系统基础
  8. C#三步实现标准事件处理程序
  9. 腾讯云主机 MySQL 远程访问配置方法
  10. (NO.00003)iOS游戏简单的机器人投射游戏成形记(十四)
  11. 学习python的几种模块
  12. Clustering[Spectral Clustering]
  13. 【转】Python之向日志输出中添加上下文信息
  14. macOS 下 PHPStorm + Xdebug 调试 Docker 环境中的代码
  15. 仿迅雷播放器教程 -- 提取exe资源(12)
  16. c# 制作弹窗
  17. Mac - 苹果电脑mac系统释放硬盘空间方法汇总
  18. 用Java编写银行存钱取钱
  19. 【翻译】介绍 ASP.NET Core 中的 Razor Pages
  20. jquery的基本api

热门文章

  1. Eclipse导出可运行的jar包并运行
  2. December 11th 2016 Week 51st Sunday
  3. ZT Android Debuggerd的分析及使用方法
  4. 使用信号进行同步 sem_post
  5. Linux常用软件安装
  6. java数组回顾---线性查找最大值最小值---二分查找
  7. OpenStack高可用方案及配置
  8. 好用的css库
  9. Angular2 Pipe
  10. spring mvc 多数据源切换,不支持事务控制[一]