CSS & 框模型
1.页面元素边框的属性
属性 | 说明 |
boder | 设置边框样式的复合属性 |
border-color | 设置边框的颜色值 |
border-style | 设置边框的样式,包括none(无边框),dotted(点划线),dashed(虚线),solid(实线),double(双线),groove(槽状),ridge(脊状),inset(凹陷),outset(凸出) |
border-width | 设置边框宽度 |
border-top, border-right, border-bottom, border-left | 分别设置上、右、下和左边框的复合属性 |
border-top-color, border-right-color, border-bottom-color, border-left-color | 分别设置上、右、下和左边框的颜色 |
border-top-style, border-right-style, border-bottom-style, border-left-style | 分别设置上、右、下和左边框的样式 |
border-top-width, border-right-width, border-bottom-width, border-left-width | 分别设置上、右、下和左边框的宽度 |
2.元素定位属性
属性 | 说明 |
position | 定义元素在页面中的定位方式,有absolute,relative,static,fixed,默认为static |
left | 指定元素与最近一个具有定位设置的父对象左边的距离 |
right | 指定元素与最近一个具有定位设置的父对象右边的距离 |
top | 指定元素与最近一个具有定位设置的父对象上边的距离 |
bottom | 指定元素与最近一个具有定位设置的父对象下边的距离 |
z-index | 设置元素的层叠顺序,仅在position属性为relative或者absolute时有效 |
width | 设置元素框宽度 |
height | 设置元素框高度 |
overflow | 内容溢出控制 |
clip | 剪切 |
3.布局属性
属性 | 说明 |
clear | 指定元素中不允许有浮动对象的边,取值:none(默认),left,right和both |
float | 指定元素是否以及如何浮动,取值有none,left和right |
clip | 指定元素的可视区域,区域外的部分将隐藏 |
overflow | 指定在元素的内容超过指定宽度和高度时的处理方式,默认为visible |
overflow-x | 指定元素处理内容超过宽度时的方式 |
overflow-y | 指定元素处理内容超过高度时的方式 |
display | 指定元素是否以及如何显示,默认为inline(元素将以内联方式显示) |
visibility | 指定是否显示元素 |
相关推荐
单元二 CSS3样式表端基础前Web单元2-6 框模型(盒子模型)13内边距框模型概述42边框外边距文档结构与标准文档流span为inline元素,若干个inline元素是水平排列的body,ul,li为block元素,它们独占一整行,兄弟之间...
HTML元素的框架模型,理解它在网页中设计HTML元素的样式很简单,而且让你的元素在网页中的布局显示更容易上手
前端学习笔记-CSS(2)_css框模型 8.边框(盒子模型) margin,外边框,指当前标签的边框和其他标签或父标签的距离。 padding,内边框,指当前标签的边框和内部文本的距离。
CSS 框模型概述word文档,内边距、边框和外边距都是可选的,默认值是零。但是,许多元素将由用户代理样式表设置外边距和内边距。
.
CSS3样式表- 框模型之补充.pptx
1.1 CSS盒子模型概述 1.3 CSS 盒子模型边框 1.4 CSS盒子模型外边距 1.5CSS盒子模型的应用
CSS css盒子模型 又称框模型 (Box Model) ,包含了元素内容(content)、内边距(padding)、边框(border)、外边距(margin)几个要素。如图: 为了方便大家理解和尝试,我写了一个小Demo放上来方便大家尝试 <...
想深入理解CSS布局的可以看看这个了,详细讲解了网页新布局概念中的CSS架构-CSS盒子模型的行内框问题,希望大家多多讨论啊研究。
做过前台设置的都知道css存在两种盒模型,W3C标准的方框模型和IE浏览器的方框模型。除IE以外的大多数浏览器只支持W3C方框模型。IE浏览器能够根据页面的呈现模式的定义而是用对性的方框模式。已用哪中呈现的模式取决...
开元css框架 对css感兴趣的朋友可以下载看看
CSS 将所有的网页元素都看做是一个矩形框,这个框由元素的内容、填充(padding)、边框(border)和边界(margin)组成。
CSS3的工作草案,主要包括盒子模型、列表模块、超链接方式、语言模块、背景和边框、文字特效、多 栏布局等模块 [1] 。 CSS演进的一个主要变化就是W3C决定将CSS3分成一系列模块。浏览器厂商按CSS节奏快速创新, 因此...
box-sizing(控制盒模型的组成模式):指定两个boxes接壤 resize(元素缩放):指定一个div元素,允许用户调整大小 outline(外边框) background-origin(指定背景图片从哪里开始显示) background-clip(指定背景图片从...
本书将最有用的CSS技术汇总在一起,在介绍基本的CSS概念和最佳实践之后...2.1.1 IE/Win和框模型 2.1.2 空白边叠加 2.2 定位概述 2.2.1 视觉格式化模型 2.2.2 相对定位 2.2.3 绝对定位 2.2.4 浮动 2.3 小结 ……
网页布局(layout)是CSS的一个重点应用。布局的传统解决方案,基于盒状模型,依赖 display属性 + position属性 + float属性。它对于那些特殊布局非常不方便,比如,垂直居中就不容易实现。 2009年,W3C提出了一...
CSS 框模型概述 元素框的最内部分是实际的内容,直接包围内容的是内边距。内边距呈现了元素的背景。内边距的边缘是边框。边框以外是外边距,外边距默认是透明的,因此不会遮挡其后的任何元素。 内边距、边框和外边...
整个盒子模型在网页中所占的宽度:左边界+左边框+左填充+内容+右填充+右边框+右边界 CSS盒子模型的属性:内容属性:宽=width 高=height内填充属性(内容与边框之间的距离):padding外边距属性:margin(使用该...
本章将介绍CSS3中各种盒的知识点;主要包含以下内容: CSS3中各种各样盒的类型概念、浏览器支持情况; 当盒中内容超出容纳范围时,如何利用属性来让浏览器按照自己想要的方式对盒中内容进行显示; 掌握给盒添加阴影...
掌握CSS网页布局技术,网页边框效果的定义是基础内容,其中也涉及到CSS盒模型知识以及CSS属性简写知识。 相关文章阅读:CSS设计网页时的一些常用规范 实例一: CSS:p {padding: 15px; border: 1px solid black; } ...