码迷,mamicode.com
首页 > Web开发 > 详细

【HTML】行内-块级-行块级

时间:2019-03-17 10:21:54      阅读:455      评论:0      收藏:0      [点我收藏+]

标签:引用   put   自动换行   无效   锚点   table   sam   map   label   

  • 行内元素
  1. 相邻元素可以在一行显示直到一行排不下才进行换行。
  2. 不可设置宽高,宽度随内容变化。
  3. padding和margin的设置中,水平方向(padding-left...)有效果,垂直方向无效果。
  • 块级元素
  1. 占一行或多行。
  2. 可设置宽高。
  3. 排列从上至下。
  4. 可设置padding和margin。
  5. 宽度没设置,默认100%
  • 行内块元素
  1. 不自动换行。
  2. 可设置宽高。
  3. 排列从左到右。
  • 行内元素,块级元素,行内块元素之间的转换
  1. display:inline;转换为行内元素
  2. display:block;转换为块状元素
  3. display:inline-block;转换为行内块状元素

行内元素

       * a - 锚点

  * abbr - 缩写
  * acronym - 首字
  * b - 粗体(不推荐)
  * bdo - bidi override
  * big - 大字体
  * br - 换行
  * cite - 引用
  * code - 计算机代码(在引用源码的时候需要)
  * dfn - 定义字段
  * em - 强调
  * font - 字体设定(不推荐)
  * i - 斜体
  * img - 图片
  * input - 输入框
  * kbd - 定义键盘文本
  * label - 表格标签
  * q - 短引用
  * s - 中划线(不推荐)
  * samp - 定义范例计算机代码
  * select - 项目选择
  * small - 小字体文本
  * span - 常用内联容器,定义文本内区块
  * strike - 中划线
  * strong - 粗体强调
  * sub - 下标
  * sup - 上标
  * textarea - 多行文本输入框
  * tt - 电传文本
  * u - 下划线
  * var - 定义变量

块级元素

  * address - 地址
  * blockquote - 块引用
  * center - 举中对齐块
  * dir - 目录列表
  * div - 常用块级容易,也是css layout的主要标签
  * dl - 定义列表
  * fieldset - form控制组
  * form - 交互表单
  * h1 -h6 标题
  * hr - 水平分隔线
  * isindex - input prompt
  * menu - 菜单列表
  * noframes - frames可选内容,(对于不支持frame的浏览器显示此区块内容
  * noscript - 可选脚本内容(对于不支持script的浏览器显示此内容)
  * ol - 排序表单
  * p - 段落
  * pre - 格式化文本
  * table - 表格
  * ul - 非排序列表

可变元素

  可变元素为根据上下文语境决定该元素为块元素或者内联元素。
  * applet - java applet
  * button - 按钮
  * del - 删除文本
  * iframe - inline frame
  * ins - 插入的文本
  * map - 图片区块(map)
  * object - object对象
  * script - 客户端脚本

 

【HTML】行内-块级-行块级

标签:引用   put   自动换行   无效   锚点   table   sam   map   label   

原文地址:https://www.cnblogs.com/WX1211/p/10545754.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!