html中内联元素（inline），块级元素（block）、inline-block的区别和理解。
⾸先，关于display的这三个属性，要先了解其作⽤的元素，如果元素本来就是块级元素，那么display加block没⽤，反之亦然。当块级元素想要在⾏内加⼊其它块级元素时，需要将两个元素设置为inline-block（⽅便设置长宽⾼，如果设置为inline，长宽是⽆法设置的）。下⾯是三者的区别。
display:block
1.block元素会独占⼀⾏，多个block元素会各⾃新起⼀⾏。默认情况下，block元素宽度⾃动填满其⽗元素宽度。
2.block元素可以设置width,height属性。块级元素即使设置了宽度，仍然是独占⼀⾏。
3.block元素可以设置margin和padding属性。
display:inline
1.inline元素不会独占⼀⾏，多个相邻的⾏内元素会排列在同⼀⾏⾥，直到⼀⾏排列不下，才会新换⼀⾏，其宽度随元素的内容⽽变化。
2.inline元素设置width,height属性⽆效。
3.inline元素的margin和padding属性，⽔平⽅向的padding-left, padding-right, margin-left, margin-right都产⽣边距效果；但竖直⽅向的padding-top, padding-bottom, margin-top, margin-bottom不会产⽣边距效果。
html ul标签display:inline-block
1.简单来说就是将对象呈现为inline对象，但是对象的内容作为block对象呈现。之后的内联对象会被排列在同⼀⾏内。⽐如我们可以给⼀个link（a元素）inline-block属性值，使其既具有block的宽度⾼度特性⼜具有inline的同⾏特性。
--------------------------------分割线-----------------------------
下⾯是常见的块级元素和内联元素：
* 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 - ⾮排序列表
内联元素(inline element) HTML标签分类明细
* 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 - 定义变量
可变元素 HTML标签分类明细
* applet - java applet 
* button - 按钮 
* del - 删除⽂本 
* iframe - inline frame 
* ins - 插⼊的⽂本 
* map - 图⽚区块(map) 
* object - object对象 
* script - 客户端脚本

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。