块级元素

一、水平格式化

7个属性之和等于父级宽度

1.三个auto

外边距为0，width=auto。（同默认情况）

2.两个auto

两个外边距为auto，居中；注：纵向外边距设置为auto，实际上他们会被重置为0，起不到居中效果

一个外边距和width，设置为auto的外边距为0

3.一个auto

4.没有auto，全部设定为固定值

，若相加小于总宽度，margin-right被自动设为auto

二、垂直格式化

1.垂直外边距合并

垂直外边距都是负数，取绝对值最大的；一正一负，正数减去负数绝对值

负边距：下一个元素会按从左向右，从上向下挨着上一个元素的margin排列，负边距也会如此。见《css权威指南》p184

时间： 2024-08-10 15:26:38

块级元素的相关文章

微信小程序布局之行内元素和块级元素

元素按照显示方式主要可以分为块级元素和行内元素,元素的显示方式由display属性控制. 块级元素特点总结: 1.总是在新行上开始 2.宽度的默认为width+margin-left+margin-right+padding-left+padding-right刚好等于父级元素的内容区域宽度,即父元素的width.当设定新的宽度,如果宽度是100%,并且padding.margin不为零,导致块级元素宽度溢出父元素 3.盒子模型的高度默认由内容决定 4.盒子模型中高度.宽度和内外边距都是可控制

【前段开发】行内元素和块级元素总结（HTML CSS）

块级元素 <address> information on author <blockquote> long quotation <button> push button <caption> table caption <dd> definition description <del> deleted text <div> generic language/style container <dl> defini

行内元素与块级元素的区分

块级元素列表 <address> 定义地址 <caption> 定义表格标题 <dd> 定义列表中定义条目 <div> 定义文档中的分区或节 <dl> 定义列表 <dt> 定义列表中的项目 <fieldset> 定义一个框架集 <form> 创建 HTML 表单 <h1> 定义最大的标题 <h2> 定义副标题 <h3> 定义标题 <h4> 定义标题 <h5&

行内元素和块级元素

1 块级元素:div , p , form, ul, li , ol, dl, form, address, fieldset, hr, menu, table 行内元素:span, strong, em, br, img , input, label, select, textarea, cite, 内联元素(inline element) a - 锚点 b - 粗体(不推荐) br - 换行 em - 强调 font - 字体设定(不推荐)

CSS 中的内联元素、块级元素、display的各个属性的特点

CSS的内联元素和块级元素块级元素<h1>-<h6>.p.dt是不可以内联块级元素的 1.block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通常被现实为独立的一块,会单独换一行:inline元素则前后不会产生换行,一系列inline元素都在一行内显示,直到该行排满. 2.大体来说HTML元素各有其自身的布局级别(block元素还是inline元

行内元素和块级元素总结

块级元素<address> 定义地址<caption> 定义表格标题<dd> 定义列表中定义条目<div> 定义文档中的分区或节<dl> 定义列表<dt> 定义列表中的项目<fieldset> 定义一个框架集<form> 创建 HTML 表单<h1> 定义最大的标题<h2> 定义副标题<h3> 定义标题<h4> 定义标题<h5> 定义标题<h6&

行内元素和块级元素的区别

一.行内元素和块级元素的区别 1. 行内元素不会占据整行,在一条直线上排列,都是同一行,水平方向排列: 块级元素会占据一行,垂直方向排列. 2. 块级元素可以包含行内元素和块级元素:行内元素不能包含块级元素. 3. 行内元素与块级元素属性的不同,主要是盒模型属性上,行内元素设置width无效,height无效(可以设置line-height),margin上下无效,padding上下无效. 二.行内元素和块级元素的相互转换行内元素转化为块元素: display:block; 块元素转化为行内元

块级元素和行内元素的区别 (block vs. inline)

块级元素 (display: block) 独占一行,多个block元素会各自新起一行.默认情况下,block元素的宽度会填满父元素的宽度. 可以设置width, height属性.但是,即使设置了width属性,仍然独占一行. 可以设置margin, padding. 行内元素 (display: inline) HTML元素分为替换元素和非替换元素. 替换元素是指浏览器根据其标签的元素与属性来判断显示具体的内容.例如img,input等. HTML中大多数元素是不可替换元素,他们将内容直接告

web兼容学习分析笔记--块级、内联、内联块级元素

一.块级.内联.内联块级元素 (1)块级元素:block **独占一行 **可设置width,height,margin,padding **内部可包含块级或内联元素 (3)内联(行内)元素:inline **和其他inline元素同行显示 **可以设置margin-left,margin-righ,padding-left,padding-right, **无效设置widht,height,margin-top,margin-bottom,padding-top,padding-bottom

块级元素行级元素及其他元素

我们常说元素分为块级元素和行级元素,这只是一种简化了的约定. 1.元素的display属性定义了该元素在页面中渲染出来的盒模型. Every HTML element has a default display value depending on what type of element it is. The default display value for most elements is block or inline. 2.display属性的值如下: 2.1常见的值如下三个: blo