块级，行内（内联）对比笔记

块级元素:

div, p, h1, h2, h3, h4, h5, h6, ul, li, ol, dl，pre，form, table等

行内元素:

span, td, tr, a, img, input, label, select，textarea等

对比如下:

1.块级元素独占一行，宽度充满其父元素

行内元素不会独占一行，相邻的行内元素会排列在一起，宽度随内容的变化而变化

2.块级元素可以设置width，height属性，而且即使设置宽度，依旧独占一行

行内元素设置width，height无效！

3.块级元素设置margin-top，margon-right，margin-bottom，margin-left均有效

一般情况下，行内元素设置margin-top，margin-bottom无效，margin-left, margin-right有效(上下无效，左右有效)

有些行内元素实际上属于inline-block，比如input，textarea，img，对于它们，margin四个方向均有用！！！！

详情: http://www.cnblogs.com/greenal/archive/2013/01/05/2845513.html

转载于:https://www.cnblogs.com/yanze/p/5988332.html

块级，行内（内联）对比笔记相关推荐

CSS之排列系列--块级元素、内联元素、内联块元素--区别/详解
原文网址:CSS之排列系列--块级元素.内联元素.内联块元素--区别/详解_IT利刃出鞘的博客-CSDN博客简介本文介绍CSS的块级元素(block).内联元素(inline)和内联块元素(inl ...
CSS的块级元素和内联元素，以及float
说明:之前有一点搞错了,就是float其实是浮动起来,其它元素会位于它的底层. 最近在系统地学习HTML5,感觉补上了好多缺失的知识. 例如: 锚点定位其实可以通过 id 来实现: CSS 使用 !i ...
了解一下块级元素和内联元素
块级元素是指单独撑满一行的元素,如div.ul.li.table.p.h1等元素.这些元素的display值默认是block.table.list-item等. 内联元素又叫行内元素,不占有独立的区域 ...
css 内联元素、块级元素、内联块级元素
对于display我想很多人都不陌生,然而在谈到内联元素,行内元素等词,还是会有人脑袋瓜子充满了疑问???我曾经自以为已经了解并懂得如何使用display,在学习vertical-align及替换元素 ...
html 图片是块元素吗,HTML+CSS：html元素分类之块级元素、内联元素、内联块级元素...
原标题:HTML+CSS:html元素分类之块级元素.内联元素.内联块级元素 html元素主要分为3类,块级元素.内联元素以及内联块级元素,本篇文章我们来就详细介绍一下各个分类的含义以及对应的特点. ...
CSS网页布局心得（样式优先级，块级元素，内联元素，display，position，float）
文章涉及的知识点:CSS,样式优先级,块级元素,内联元素,display,position,float 使用top;right; bottom;right时,要注意是对于哪个元素进行定位,要保证定位元 ...
canvas到底是块级元素还是内联元素？
canvas到底是块级元素还是内联元素? 前言 canvas 是块级元素? canvas 是内联元素? 问题总结参考前言 canvas 元素有默认的宽高,到底是块级元素还是内联元素,一直都很疑惑 ...
HTML中的块级元素和内联元素
1.特性块级元素(block level element)总是独占一行,表现为另起一行开始,而且其后的元素也必须另起一行显示宽度(width).高度(height).内边距(padding)和外边 ...
html内联元素和块元素的特性,HTML中块级元素和内联元素的特性详解
原标题:HTML中块级元素和内联元素的特性详解在网站布局中经常会遇到元素进行居中的时候,设置了text-align:center:margin:0 auto;有时候会起作用,但有时候对居中无效,刚接 ...
html块级元素转换内联,内联元素和块级元素相互转换
内联元素和块级元素相互转换属于前端实例代码,有关更多实例代码大家可以查看. 内联元素和块级元素之间可以相互转换,下面就简单介绍一下转换方法. 一.内联元素转换为块级元素: 让内联元素产生浮动或者将它的 ...

块级，行内（内联）对比笔记

块级，行内（内联）对比笔记相关推荐

最新文章

热门文章