块级元素:div p h1 h2 h3 h4 form ul行内元素: a b br i span input selectCss盒模型:内容,border ,margin,padding css中的display属性(行内元素和块级元素) 我们常用的display属性值有: inline block inline-block none 把 display 设置成 none 不会保留元素本该显示的空间,但是 visibility: hidden 还会保留. 我们最关心的还是display:inl…

>原创文章,转载请注明来源! 二.对行内元素(文字.图片.兄弟元素).块级元素设置line-height后的表现 对块级元素无效,对行内元素有效.可继承给行内元素. 文字的line-height能使文字居中,即垂直居中性. 文字的line-heigh可以通过继承也可以使用内联得到(内联优先). 图片的line-height不能居中,放映出的特点是图片底部总是超过行高中垂线6px的距离. 图片的line-height只能通过继承得到,内联设置无效. 同一行的line-height,中垂线对齐(sp…

display:inline 的作用是设置对象做为行内元素显示,inline是内联对象的默认值(ps:内联对象就是不自动产生换行的元素,比如span) 而我们一般用的div是块级元素,默认display属性是block, 但将div的display设置为inline的话,则多个div可以像span一样显示在一行了. 它可以让行内显示为块的元素,变为行内显示,例如 <div> DIV1 </div> <div> DIV2 </div> 这里DIV1和DIV2分…

display:block;是让对象成为块级元素(比如a,span等) 转化后 可以对a或者span标签进行width和height设置,否则设置不了 display有很多对象,具体可以参考http://www.w3school.com.cn/css/pr_class_display.asp 一般都是用display:none和display:block来控制层的显示…

HTML 块级元素 大多数 HTML 元素被定义为块级元素或内联元素. 编者注:“块级元素”译为 block level element,“行内元素”译为 inline element. 块级元素在浏览器显示时,通常会以新行来开始(和结束). 例子:<h1>, <p>, <ul>, <table> HTML 行内元素 行内元素在显示时通常不会以新行开始. 例子:<b>, <td>, <a>, <img> 总之一…

block(块级元素)和 inline(内联元素) 的区别 (2009-01-05 10:32:07) 转载▼ 标签: 杂谈 分类: div+css div这样的块级元素,就会自动占据一定矩形空间,可以通过设置高度.宽度.内外边距等属性,来调整的这个矩形的样子: 与之相反, 像“span”这样的行内元素,则没有自己的独立空间,它是依附于其他块级元素存在的,因此,对行内元素设置高度.宽度.内外边距等属性,都是无效的. 其实你需要知道的行内元素就是 span 和 a ,其他的行内元素,比如 stro…

css中有3种基本的定位机制:普通流(相对定位实际上看做普通流定位模型的一部分)浮动(float)绝对定位(固定定位是绝对定位的一种)所以在学习浮动之前,我们先要了解块级元素与内联元素(行内元素).块级元素:块级元素一般当做容器使用,既可以容纳内联元素也可以容纳块级元素,例如div和p.常见的块级元素:(1)div:主要用来进行框架布局.(2)h1-h6:用来设置不同级别的标题.(3)p:创建段落,会自动在其前后创建一些空白.(4)hr:用来创建分隔先.(5)ol:创建有序列表.(6)ul:创建…

块元素 什么是块级元素?在html中<div><p><h1><form><ul>之类的就是块级元素.设置display:block是就将元素显示为块级元素.如下代码就是将内联元素a转换为块状元素,从而使a元素具有块状元素特点. 块级元素特点: 1.每个块级元素都从新的一行开始,并且其后的元素也另起一行. 2.元素的高度,宽度,行高以及顶和底边距都可设置. 3.元素宽度在不设置的情况下,是它本身你窗口的100%(和你元素的宽度一致),除非设定一个宽…

文档流 将窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素,即为文档流. 每个非浮动块级元素都独占一行, 浮动元素则按规定浮在行的一端. 若当前行容不下, 则另起新行再浮动. 内联元素也不会独占一行. 几乎所有元素(包括块级,内联和列表元素)均可生成子行, 用于摆放子元素. 有三种情况将使得元素脱离文档流而存在,分别是浮动,绝对定位, 固定定位. 但是在IE中浮动元素也存在于文档流中(还让我觉得这样很合理><). 浮动元素不占任何正常文档流空间,而浮动元素的定位还是基于正常的文档流…

请把下面二行代码放进body标签里:     <div style=”border: 1px solid red;”>div1</div>     <div style=”border: 1px solid red;”>div1</div>     浏览器的呈现效果:     div1     div1 这二个div占据了二行空间,叫做块级元素(block). 再把下面二行代码也放进body标签里:     <span style=”border: 1…

CSS文档流与块级元素(block).内联元素(inline),之前翻阅不少书籍,看过不少文章, 看到所多的是零碎的CSS布局基本知识,比较表面.看过O'Reilly的<CSS权威指南>,发现里面提到的文档流概念让我很敏感. 可恶的是书中并没有解释文档流是什么东西,或许作者觉得这个太简单了以至于不值一提.但我觉得,这个概念实在太重要了.理解了它,一堆css布局的理论都 变得易于理解,并且体会到CSS这套设计的合理性所在. 于是我根据猜测,再加实验,得出一下说法.如有错误,纯属正常. 文档流将窗…

Block element 块级元素 顾名思义就是以块显示的元素,高度宽度都是可以设置的.比如我们常用的<div>.<p>.<ul>默认状态下都是属于块级元素.块级元素比较霸道,默认状态下每次都占据一整个行,后面的内容也必须再新起一行显示.当然非块级元素也可以通过css的display:block;将其更改成块级元素.此外还有个特殊的,float也具有此功能. Inline element 内联元素 通俗点来说就是文本的显示方式,与块级元素相反,内联元素的高度宽度都是不…

CSS文档流与块级元素(block).内联元素(inline),之前翻阅不少书籍,看过不 少文章, 看到所多的是零碎的CSS布局基本知识,比较表面.看过O'Reilly的<CSS权威指 南>,发现里面提到的文档流概念让我很敏感. 可恶的是书中并没有解释文档流是什么东 西,或许作者觉得这个太简单了以至于不值一提.但我觉得,这个概念实在太重要了.理解了 它,一堆css布局的理论都变得易于理解,并且体会到CSS这套设计的合理性所在. 于是我 根据猜测,再加实验,得出一下说法.如有错误,纯属正常. 文…

CSS文档流与块级元素(block).内联元素(inline),之前翻阅不少书籍,看过不少文章, 看到所多的是零碎的CSS布局基本知识,比较表面.看过O'Reilly的<CSS权威指南>,发现里面提到的文档流概念让我很敏感. 可恶的是书中并没有解释文档流是什么东西,或许作者觉得这个太简单了以至于不值一提.但我觉得,这个概念实在太重要了.理解了它,一堆CSS布局的理论都变得易于理解,并且体会到CSS这套设计的合理性所在. 文档流 将窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素,即…

上一个礼拜,做crm项目,使用的大部分都是js,nodejs,ajax 的内容,但是今天我想写写关于html中的块级元素和内联元素 的东西. 首先,html 中的块级元素 内联元素 我们可以看到,这两个表格中有重复的元素,这些元素被称为可变元素 对于html中块级元素和行内元素,有什么区别呢? 块级元素会分行显示,行内元素是在同一行显示内容 具体区别如下:1.行内元素  在尺寸设置方面 设置它的宽,高,均无效 设置margin 值,左右的margin 值可以设置,上下的margin 值设置无效,…

在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 1,块状元素 常用的块状元素有: <div>.<p>.<h1>...<h6>.<ol>.<ul>.<dl>.<table>.<address>.<blockquote> .<form> 什么是块级元素?在html中<div>. <p>.<…

p.h1.或div等元素常常称为块级元素,这些元素显示为一块内容:Strong.span等元素称为行内元素,它们的内容显示在行中,即“行内框”.(可以使用display=block将行内元素转换成块元素,display=none表示生成的元素根本没有框,也既不显示元素,不占用文档中的空间). a.行内就是在一行内的元素,只能放在行内:块级元素,就是一个四方块,可以放在页面上任何地方. b.说白了,行内元素就好像一个单词:块级元素就好像一个段落,如果不另加定义的话,它将独立一行出现. c.一般的块…

CSS文档流与块级元素(block).内联元素(inline),之前翻阅不少书籍,看过不少文章, 看到所多的是零碎的CSS布局基本知识,比较表面.看过O'Reilly的<CSS权威指南>,发现里面提到的文档流概念让我很敏感. 可恶的是书中并没有解释文档流是什么东西,或许作者觉得这个太简单了以至于不值一提.但我觉得,这个概念实在太重要了.理解了它,一堆CSS布局的理论都变得易于理解,并且体会到CSS这套设计的合理性所在. 于是我根据猜测,再加实验,得出一下说法.如有错误,纯属正常. 文档流 将窗…

一.基本概念 1.块级元素(block element):一般都从新行开始占据一定的矩形空间,可以设置其宽.高属性来改变矩形的大小.一般情况下块级元素可以包含内联元素和其它块级元素,但也有特殊如form只能包含其它块级元素,p只能包含内联元素.常见块级元素如div.p.form等. 2.内联元素(inline element):也叫内嵌元素.行内元素.直进式元素.一般都是基于语义级(semantic)的基本元素,没有自己独立的空间,依附于其它块级元素存在的,因此一般情况下设置其宽.高属性是无效的…

CSS文档流与块级元素(block).内联元素(inline),之前翻阅不少书籍,看过不少文章, 看到所多的是零碎的CSS布局基本知识,比较表面.看过O'Reilly的<CSS权威指南>,发现里面提到的文档流概念让我很敏感. 可恶的是书中并没有解释文档流是什么东西,或许作者觉得这个太简单了以至于不值一提.但我觉得,这个概念实在太重要了.理解了它,一堆CSS布局的理论都变得易于理解,并且体会到CSS这套设计的合理性所在. 文档流 将窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素,即…

1.  块级元素(block element): 概念理解:如果不用css控制,块级元素在文档流中以一行显示,及它所占的宽度为其父级元素所占的宽度,若超过宽度会重新另起一行显示,高度会随着内容高度的增加而增加. 可以用display:inline属性将块级元素转换为内联元素形式显示,这样块级元素就不会重新起行显示,而是变成行内元素与其他元素在一行内显示. 常见的html元素是:<p>. 常见块级元素标签有: <address>:内容以斜体显示: <blockquote>…

在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素.在HTML和XHTML中,块级元素不能继承自行内元素(即不能嵌套在行内元素),<p>I like <em>it</em></p>是正确的写法,但是<em>I like<p>it</p></em>是不正确的. 常用的块状元素有: <div>.<p>.<h1>...<…

概述 HTML中存在许多元素,如<h1>,<p>,<a>,<block>,<image>,这些元素可分为三类,依次是块级元素,内联元素,块级内联元素. 每种元素都有着各自的特点: 块级元素特点 每个块级元素都从新的一行开始,并且其后的元素也另起一行.(一个块级元素独占一行) 元素的高度(height),宽度(width),行高(line-height)以及顶和底边距(margin,padding)都可设置. 元素宽度在不设置的情况下,是它本身父容…

1.下表列出了内联元素和块级元素的主要区别 html中内联元素和块级元素的区别 块级元素 行内元素 独占一行,默认情况下,其宽度自动填满其父元素宽度 相邻的行内元素会排列在同一行里,直到一行排不下,才会换行,其宽度随元素的内容而变化 可以设置width,height属性 行内元素设置width,height属性无效 可以设置margin和padding属性 行内元素起边距作用的只有margin-left.margin-right.padding-left.padding-right,其它属性不会…

CSS文档流与块级元素(block).内联元素(inline),文档流这个概念理解了它,一堆CSS布局的理论都 变得易于理解,并且体会到CSS这套设计的合理性所在. 文档流 将窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素,即为文档流. 每个非浮动块级元素都独占一行, 浮动元素则按规定浮在行的一端. 若当前行容不下, 则另起新行再浮动. 内联元素也不会独占一行. 几乎所有元素(包括块级,内联和列表元素)均可生成子行, 用于摆放子元素. 有三种情况将使得元素脱离文档流而存在,分别是浮…

今天终于对html中的块级元素和行内元素有了一个较为理性的认识.首先w3c对于block和inline的解释为:…

1,内联非替换元素设置宽高是无效的,设置margin时,左右有效,上下无效.设置padding时,左右有效,而上下padding比较奇葩,内联非替换元素的上下padding会在元素内容盒不动的情况下上下扩展(对比一下,块状元素设置margin或padding时,内容盒子会移动,内联元素设置左右margin和左右padding时,内容盒子也会移动),设置背景色会看到效果,但是此元素下面的块状元素在计算边距时并不考虑这个上下padding,仍然以这个内联非替换元素的内容盒子的下边作为起点.简单示例一…

1.块级元素 margin:跟标准一样,设置该块级元素边框与同级兄弟元素或者父元素的距离,俗称外边距. padding:先延伸边框(也就是优先改变元素尺寸而不动元素中内容的位置),当边框碰到父元素的边界时,才向相反方向延伸,这时会改变该元素中内容的位置 padding演示: 原样 html: <div>块级元素</div> css: div{ width:100px; border:1px solid #000; } 添加padding后: div{ width:100px; bo…

块级元素:div, p(段落), form(表单), ul(无序列表), li(列表项), ol(有序列表), dl(定义列表), hr(水平分割线), menu(菜单列表), table(表格)... 特点:1.块级元素会独占一行,其宽度自动填满其父元素宽度. 2.可以设置width,height属性.(即使设置了宽度,也是独占一行的,除非用float属性等特殊情况) 3.可以设置margin(外边距)和padding(内边距). 行内元素:span, strong, em, br, img,…

全栈工程师开发手册 (作者:栾鹏) 一个demo学会css css选择器全解 css操作语法全解 CSS样式设置语法全解: 样式优先级 1. !important标记的样式 > 内联样式(style属性) >id选择样式(#获取) > 属性选择 ([title="da"]) > 标签选择 div p > 通配符* 2. 同一等级优先级具有叠加性.div p的优先级大于p.相同优先级,越晚设置的样式优先级越大 3. 绝大部分样式会从父元素继承到子元素上,继承…