css第三节(1)

作者: 下页luck | 来源:发表于2017-02-25 00:52 被阅读5次

1、css盒模型

把html页面中的元素看作是一个矩形的盒子,也就是一个盛装内容的容器,每个矩形由内容(有width和height)、内边距(padding)、边框(border)和外边距(margin)组成。

一个盒子占用的空间:边宽+内边距+内容区域

2、魔盒的边框

border-top-width:20px;

border-top-color:red;

border-top-style:solid;

合写:

border-top:宽度 样式 颜色;

border-left:5px solid blue;

一行css设置上下左右的边宽样式

border:10px solid blue;

;3、css边框的妙用

border:0 none  去掉默认的边框,兼容所以浏览器

4、内边距padding的使用

padding:20px;设置四周的内边距

padding-top:20px;上内边距

padding:20px 5x 10px 20px;分别设置上  右  下  左的内边距

内边距享有背景色

相关文章

  • css第三节(1)

    1、css盒模型 把html页面中的元素看作是一个矩形的盒子,也就是一个盛装内容的容器,每个矩形由内容(有widt...

  • 3.CSS 学习笔记第三节/字体属性和文本属性

    CSS 学习笔记第三节/字体属性和文本属性 1.字体 下面开始详细的属性介绍,Let's rock and rol...

  • CSS第三节:CSS进阶

    盒子模型的概念 盒子模型就是把HTML页面中的元素看作是一个矩形的盒子,也就是一个盛装内容的容器。每个矩形都由元素...

  • CSS第三节:CSS进阶

    1. 去掉图片的边框(有的老的浏览器里图片是有边框的)为了兼容我们经常去掉边框如下 2. div.box$*3 ...

  • CSS第三节

    CSS第三节 CSS盒模型 网页中所有的元素都是矩形的,所以可以看出一个个盒子。 网页由多个盒子组成。 盒子:边框...

  • css第三节

    CSS装修学习在css的div里写text-align可以调整文本框内容显示方法,center是居中显示。在文本显...

  • css第三节

    盒子模型 padding 内边距 margin:外边距 border:盒子 width:元素宽 height:元素...

  • 网页编程day-39:CSS

    一、引入CSS样式与CSS选择器 1.css入门: (1)什么CSS? 1)CSS 指层叠样式表 (Cascadi...

  • CSS选择器的ie浏览器兼容性

    1.CSS1 2.CSS2 3.CSS3

  • CSS学习笔记(1)

    CSS版本 CSS Level1 CSS Level 2(CSS 2.1规范) CSS Level 3 CSS规则...

网友评论

    本文标题:css第三节(1)

    本文链接:https://www.haomeiwen.com/subject/zirgwttx.html