随笔分类 -  CSS自学笔记

摘要:CSS3中,也新增了一些关于用户界面的属性,这些属性可以重设元素或者盒子的尺寸、轮廓等等。 新增的部分属性的浏览器支持情况 属性 浏览器支持 resize IE Firefox Chrome Safari Opera box-sizing IE Firefox(-moz-) Chrome Safari Opera outline-offset IE Firefox Chrome Sa... 阅读全文
posted @ 2014-08-25 17:12 龍^o^少 阅读(1092) 评论(1) 推荐(0)
摘要:在CSS3中,也新增了一些关于文本布局的几个比较简单的属性。通过这些新增的属性,我们可以对文本进行简单的排版,就想报纸和杂志那样。新增的部分属性,以及浏览器支持情况:属性浏览器支持column-countIEFirefox(-moz-)Chrome(-webkit-)Safari(-webkit-)... 阅读全文
posted @ 2014-08-24 12:16 龍^o^少 阅读(888) 评论(2) 推荐(0)
摘要:在CSS3中也新增了一些能够对元素创建动画处理的属性。通过这些新增的属性,我们可以实现元素从一种样式变换成另一种样式时为元素添加动态效果,我们就可以取代网页中的动态图片、flash动画和JavaScript了。 CSS3中新增的动画效果的属性以及主流浏览器支持情况 属性浏览器支持 transition IE Firefox Chrome Safari(-webkit-) Opera @... 阅读全文
posted @ 2014-08-22 11:46 龍^o^少 阅读(825) 评论(0) 推荐(4)
摘要:CSS3中新增了对元素进行2D和3D的转换效果,这样可以是开发人员很方便的做出视觉效果更好的网页来。 通过CSS3中属性的定义,我们可以对元素进行移动、缩放、拉伸、旋转等等,可以通过定义transform属性来实现转换效果。 浏览器支持 属性浏览器支持 2D transform IE Firefox Chrome(-webkit-) Safari(-webkit-) Opera 3D ... 阅读全文
posted @ 2014-08-20 12:03 龍^o^少 阅读(1460) 评论(3) 推荐(4)
摘要:在CSS3中新增了多个文本属性,同样有了这些属性我们在进行问题特效处理时,就尽可能少的用到其他软件去制作特效文字了。 在以前使用CSS进行web开发的时候,必须使用计算机上安装好的字体,如果有些用户的计算机上未安装该字体,可能会达不到开发人员的预期效果。而通过CSS3,开发人员可以使用他们喜欢的任意字体,只要将需要的字体文件放到web服务器上就OK了。 注:现在的主流浏览器不支持部分新增属性。 最... 阅读全文
posted @ 2014-08-13 16:04 龍^o^少 阅读(424) 评论(0) 推荐(0)
摘要:CSS3 背景 在CSS3中新增了多个关于背景的属性,可以让我们对背景有了更多更好的操作,减少用第三方工具对背景图片进行修改美化。 CSS3中主要是通过定义backgrounp中的各个属性来控制背景(高宽,位置,透明度…………)。 关于背景的部分常用属性有(*为CSS3中新增属性): 值 描述 background-color 规定要使用的背景颜色。 background-positi... 阅读全文
posted @ 2014-08-05 17:33 龍^o^少 阅读(806) 评论(0) 推荐(0)
摘要:CSS3为CSS技术的升级版本、最新版本。就CSS而言,它是一个模块,是一个庞大而又复杂的模块,但是在CSS3中,将这一个庞大的模块分解为一个个容易理解的同时又很精简的小模块,同时CSS3中又添加了一些新的模块,所以CSS3朝着模块化的方向发展。CSS3中比较重要的模块有:选择器、盒子模型、背景和边... 阅读全文
posted @ 2014-08-04 18:11 龍^o^少 阅读(1155) 评论(0) 推荐(0)
摘要:CSS图片 当一个网页上有一张或多张图片,而且这些图片的尺寸比较大时,为了是网页布局更紧凑合理,我们可以将这些图片放到一个图片库里,可以有效的防止图片过大可能会对网页布局造成的不良影响。 通过CSS我们就可以实现这些操作,下面是一个简单的例子: 内马尔破门瞬间 街舞助兴 激情墨西哥 梅西的任意球来 源代码是: 1 2 3 4 5 34 35 36 37 38 ... 阅读全文
posted @ 2014-07-31 12:09 龍^o^少 阅读(559) 评论(3) 推荐(0)
摘要:CSS元素对齐可以使用margin属性类进行元素的水平对齐水平对齐块元素时,可以将块元素的margin属性定义为"auto",这里需要注意的是,应该要声明!DOCTYPE,否则在IE8以及以下版本的浏览器中是无效的。div{margin-left:auto;margin-right:auto;wid... 阅读全文
posted @ 2014-07-30 16:28 龍^o^少 阅读(722) 评论(0) 推荐(0)
摘要:很多时候,我们需要对一些元素进行自定义排序、布局等,这是就需要用到CSS的定位属性了,用这些属性对一些元素进行自定义排序、布局等操作,可以改变浏览器默认的死板的排序。 CSS定位的功能很容易理解,它允许你定义元素框相对于其正常位置应该出现的位置,或者相对于父元素、另一个元素甚至浏览器窗口本身的位置。 CSS的定位(position)属性有四种不同的定位类型,从而影响元素框的声称方式。 CSS 内... 阅读全文
posted @ 2014-07-29 16:49 龍^o^少 阅读(899) 评论(2) 推荐(0)
摘要:CSS 框模型 (Box Model) 规定了元素框处理元素内容、内边距、边框和外边距的方式。 图片来源:w3school.com.cn 元素(element)是一个html文档的实际内容区域,依次由内边距(padding)、边框(border)、外边距(margin)包围。 注: 背景应用于元素和内边距、边框组成的区域。 内边距、边框、外边距是可选,默认值为0。 内边距(paddin... 阅读全文
posted @ 2014-07-28 21:36 龍^o^少 阅读(262) 评论(0) 推荐(0)
摘要:CSS中拥有各种各样的样式表,而基本的样式有背景,文本,字体,链接,列表,表格,轮廓。 一.CSS-背景 CSS中允许用纯色背景,也允许用图片来创建复杂的个性背景。p {background-color: #000;}是用纯色作为背景。这时你可以定义其他属性,生成不同效果的背景。CSS中也可以用图片作为背景,这是就需要使用background-image属性了,如果属性值为一个URL值,并且图片... 阅读全文
posted @ 2014-07-28 17:22 龍^o^少 阅读(363) 评论(0) 推荐(1)
摘要:当浏览器读到一个样式表时,浏览器会根据这个样式表来格式化html文档,从而表现出各式各样的网页。想要浏览器读到样式表,有三种方法:1.外部样式表外部样式表可以理解为.CSS文件。当多个页面使用同一个样式的时候,外部样式表是一个很理想的选择。在使用外部样式表的情况下,可以通过改变一个文件来改变整个站点... 阅读全文
posted @ 2014-07-25 14:13 龍^o^少 阅读(820) 评论(0) 推荐(0)
摘要:CSS中提供了非常丰富的选择器,但是由于浏览器的支持情况,很多选择器很少用到。1.基础选择器选择器含义示例*通用元素选择器,匹配任何元素* { margin:0; padding:0; }E标签选择器,匹配所有使用E标签的元素p { font-size:2em; }.info和E.infoclass... 阅读全文
posted @ 2014-07-25 10:03 龍^o^少 阅读(435) 评论(0) 推荐(0)
摘要:CSS的语法规则主要有两个分构成选择器和声明(声明问一条或者多条)。selector {declaration1; declaration2; ... declarationN }选择器(selctor)是指你要改变样式的html元素。选择器有很多种,常用的id选择器和类选择器。声明(declaration)是一个属性和一个值组成(要注意书写)。属性(property)都有一个值,属性和其值用":... 阅读全文
posted @ 2014-07-24 16:28 龍^o^少 阅读(396) 评论(1) 推荐(0)
摘要:一.什么是CSSCSS(Cascading Style Sheet(级联样式表))是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。同时CSS也是一种设计语言,是将正真的网页表现和内容分离的设计语言。关于CSS的一些概述:样式定义如何显... 阅读全文
posted @ 2014-07-24 10:21 龍^o^少 阅读(379) 评论(0) 推荐(1)