行内元素和区块元素
来源:互联网 发布:手机淘宝复原聊天记录 编辑:程序博客网 时间:2024/05/29 02:23
1 常见的行内元素
a - 锚点
b - 粗体(不推荐)
br - 换行
em - 强调
font - 字体设定(不推荐)
i - 斜体
img - 图片
input - 输入框
label - 表格标签
select - 项目选择
small - 小字体文本
span - 常用内联容器,定义文本内区块
strike - 中划线
strong - 粗体强调
sub - 下标
sup - 上标
textarea - 多行文本输入框
tt - 电传文本
u - 下划线
2 常见的区块元素
- 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 - 定义变量
块元素(block element)
* address - 地址
* blockquote - 块引用
* center - 举中对齐块
* dir - 目录列表
* div - 常用块级容易,也是css layout的主要标签
* dl - 定义列表
* fieldset - form控制组
* form - 交互表单
* h1 - 大标题
* h2 - 副标题
* h3 - 3级标题
* h4 - 4级标题
* h5 - 5级标题
* h6 - 6级标题
* hr - 水平分隔线
* isindex - input prompt
* menu - 菜单列表
* noframes - frames可选内容,(对于不支持frame的浏览器显示此区块内容
* noscript - )可选脚本内容(对于不支持script的浏览器显示此内容)
* ol - 排序表单
* p - 段落
* pre - 格式化文本
* table - 表格
* ul - 非排序列表
区别
1)块级元素会独占一行,其宽度自动填满其父元素宽度
行内元素不会独占一行,相邻的行内元素会排列在同一行里,知道一行排不下,才会换行,其宽度随元素的内容 而变化
2) 块级元素可以设置 width, height属性,行内元素设置width, height无效
【注意:块级元素即使设置了宽度,仍然是独占一行的】
3) 块级元素可以设置margin 和 padding. 行内元素的水平方向的padding-left,padding-right,margin-left,margin-right 都产生边距效果,但是竖直方向的padding-top,padding-bottom,margin-top,margin-bottom都不会产生边距效果。(水平方向有效,竖直方向无效)
行内元素变成区块元素:display:block
区块元素变成行内元素:display:inline
display:inline 对应不显示为 display:none
display:block 对应不显示为 hidden
说通俗点 样式为none的元素不占位置,而样式为hidden的元素虽然不显示但还是占地方
- 行内元素和区块元素
- 块状元素行内元素和行内替换元素
- 行内元素 和 块状元素
- 行内元素 和 块状元素
- 行内元素和块状元素一览表
- 行内元素和块元素
- 行内元素和块级元素
- 行内元素和块集元素
- 块级元素和行内元素
- css_day7---块元素和行内元素
- 行内元素和块级元素
- 行内元素和块级元素
- 3---块元素和行内元素:
- 行内元素和块级元素
- html块状元素和行内元素
- HTML 行内元素和块元素
- 块级元素和行内元素
- 行内元素和块级元素
- First Bad Version 第一个坏版本
- Android源码--程序的分享、卸载、启动及详细信息
- 调用函数动态添加标签
- pdfjs使用方法
- ios 模糊效果
- 行内元素和区块元素
- 替换字符串中第几个字符
- Web开发敏捷之道学习(三)
- 面向对象,掌握windows应用程序的创建过程:为应用程序添加消息及响应
- C++11之Lambda表达式使用
- 字符串最后一个单词的长度
- 关于maven本地仓库的设置和添加jar包
- Linux文件权限
- tomcat优化(一)tomcat集群Cluster实现原理剖析