css知识点汇总
CSS媒体查询知识点
CSS媒体查询知识点CSS媒体查询是一种在网页设计中常用的技术，通过媒体查询可以根据设备的特性来适配网页的样式和布局。
本文将介绍CSS媒体查询的基本概念、语法和常见应用，帮助读者更好地理解和运用这一技术。
一、基本概念CSS媒体查询是一种CSS3新增的特性，用于根据设备的特性或特定的媒体类型来应用不同的CSS样式。
媒体查询提供了一种响应式布局的解决方案，使得网页可以在不同的设备上展现出最佳的视觉效果。
二、语法媒体查询的语法如下所示：@media mediatype and (condition) {CSS rules;}其中，mediatype表示媒体类型，condition表示条件，CSS rules表示需要应用的CSS样式。
常用的媒体类型包括：1. all：所有设备2. screen：屏幕设备，如计算机、平板电脑3. print：打印机和打印预览4. speech：屏幕阅读器等语音合成器常用的条件包括：1. width：设备的宽度2. height：设备的高度3. orientation：设备的方向（横向或纵向）4. device-aspect-ratio：设备的宽高比5. resolution：设备的分辨率三、常见应用媒体查询在网页设计中有着广泛的应用，以下是几个常见的应用示例：1. 自适应布局媒体查询可以根据设备的宽度来调整网页的布局。
通过设置不同的CSS样式，可以实现在不同设备上展示不同的版面结构和元素排列方式，从而达到适应不同屏幕大小的效果。
2. 响应式图片在响应式网页设计中，媒体查询可以根据设备的分辨率来动态加载适应当前设备的不同大小的图片。
通过设置不同分辨率的图片资源，可以提升网页的加载速度和用户体验。
3. 打印样式通过媒体查询，可以为打印设备单独定义样式，使打印的页面排版更加合适。
例如，可以设置打印时隐藏导航栏和广告等不必要的元素，并调整字体大小和行间距等，以保证打印输出的质量。
CSS滤镜知识点
CSS滤镜知识点CSS滤镜是一种应用于HTML元素的视觉效果工具，通过改变元素的颜色、亮度、对比度等属性，能够实现各种各样的效果。
在本文中，我们将深入探讨CSS滤镜的相关知识点。
一、CSS滤镜简介CSS滤镜是一系列用于改变HTML元素的呈现方式的特效。
通过对图像或元素应用一系列滤镜效果，我们可以改变其外观和视觉效果，从而创造出更加丰富多样的界面效果。
二、常用的CSS滤镜属性1. filter属性filter属性是应用滤镜效果的关键属性，通过给元素添加filter属性来应用滤镜效果。
具体的滤镜效果是通过filter函数来定义的。
2. blur滤镜blur滤镜用于给元素添加模糊效果。
可以通过设置模糊半径来控制模糊程度，半径越大，模糊程度越高。
3. brightness滤镜brightness滤镜用于调整元素的亮度。
可以通过设置亮度的百分比来控制亮度的变化，例如brightness(150%)表示将元素的亮度增加50%。
4. contrast滤镜contrast滤镜用于调整元素的对比度。
可以通过设置对比度的百分比来控制对比度的变化，例如contrast(200%)表示将元素的对比度增加100%。
5. grayscale滤镜grayscale滤镜用于将元素转换为灰度图像。
可以通过设置灰度的百分比来控制灰度的变化，例如grayscale(50%)表示将元素的灰度程度设置为50%。
6. sepia滤镜sepia滤镜用于将元素转换为复古风格的棕色色调。
可以通过设置棕色的百分比来控制棕色的变化，例如sepia(80%)表示将元素的棕色程度设置为80%。
7. saturate滤镜saturate滤镜用于调整元素的饱和度。
可以通过设置饱和度的百分比来控制饱和度的变化，例如saturate(200%)表示将元素的饱和度增加100%。
8. hue-rotate滤镜hue-rotate滤镜用于旋转元素的色相。
可以通过设置旋转角度来控制色相的变化，例如hue-rotate(90deg)表示将元素的色相顺时针旋转90度。
CSS超全笔记（适合新手入门）
CSS超全笔记（适合新⼿⼊门）CSSCSS初识CSS(Cascading Style Sheets) 美化样式CSS通常称为CSS样式表或层叠样式表（级联样式表），主要⽤于设置HTML页⾯中的⽂本内容（字体、⼤⼩、对齐⽅式等）、图⽚的外形（宽⾼、边框样式、边距等）以及版⾯的布局等外观显⽰样式。
CSS以HTML为基础，提供了丰富的功能，如字体、颜⾊、背景的控制及整体排版等，⽽且还可以针对不同的浏览器设置不同的样式。
引⼊CSS样式表（书写位置）CSS可以写到那个位置？是不是⼀定写到html⽂件⾥⾯呢？内部样式表内嵌式是将CSS代码集中写在HTML⽂档的head头部标签中，并且⽤style标签定义，其基本语法格式如下：<head><style type="text/CSS">选择器 {属性1:属性值1; 属性2:属性值2; 属性3:属性值3;}</style></head>语法中，style标签⼀般位于head标签中title标签之后，也可以把他放在HTML⽂档的任何地⽅。
type="text/CSS" 在html5中可以省略，写上也⽐较符合规范，所以这个地⽅可以写也可以省略。
⾏内式（内联样式）内联样式，⼜有⼈称⾏内样式、⾏间样式、内嵌样式。
是通过标签的style属性来设置元素的样式，其基本语法格式如下：<标签名 style="属性1:属性值1; 属性2:属性值2; 属性3:属性值3;"> 内容 </标签名>语法中style是标签的属性，实际上任何HTML标签都拥有style属性，⽤来设置⾏内式。
其中属性和值的书写规范与CSS样式规则相同，⾏内式只对其所在的标签及嵌套在其中的⼦标签起作⽤。
外部样式表（外链式）链⼊式是将所有的样式放在⼀个或多个以.CSS为扩展名的外部样式表⽂件中，通过link标签将外部样式表⽂件链接到HTML⽂档中，其基本语法格式如下：<head><link href="CSS⽂件的路径" rel="stylesheet" /></head>注意： link 是个单标签哦该语法中，link标签需要放在的三个属性head头部标签中，并且必须指定link标签，具体如下：href：定义所链接外部样式表⽂件的URL，可以是相对路径，也可以是绝对路径。
css基础题目
css基础题目含解答共20道1. 什么是CSS？答案：CSS（层叠样式表）是一种用于描述文档样式（如字体、颜色、间距等）的样式表语言。
2. 解释一下CSS 盒模型。
答案：CSS 盒模型由内容区域、内边距、边框和外边距组成。
这些部分共同形成一个盒子，影响元素在页面上的布局和样式。
3. CSS 中的选择器有哪些？答案：常见的选择器有类选择器（.class）、ID选择器（#id）、元素选择器（element）、后代选择器（ancestor descendant）、子元素选择器（parent > child）、伪类选择器（:hover、:nth-child() 等）等。
4. 如何居中一个元素？答案：-水平居中：使用`margin: 0 auto;` 或`text-align: center;`。
-垂直居中：使用`display: flex; align-items: center;` 或`position: absolute; top: 50%; transform: translateY(-50%);`。
5. 什么是BFC（块级格式化上下文）？答案：BFC 是一个独立的渲染区域，规定了内部的块级盒子如何布局，并与外部毫不相干。
它可以解决一些布局问题，如清除浮动、防止边距折叠等。
6. CSS 中`em` 和`rem` 的区别是什么？答案：`em` 是相对于父元素的字体大小，而`rem` 是相对于根元素（html 元素）的字体大小。
7. 如何隐藏一个元素？答案：使用`display: none;` 或`visibility: hidden;` 来隐藏元素。
8. CSS 中的`position` 属性有哪些值，它们分别是什么意思？答案：常见的`position` 值有static、relative、absolute、fixed 和sticky。
它们分别表示元素的定位方式，例如static 表示静态定位，元素出现在正常的文档流中。
css常用语法
1、页面中，所有的CSS代码，需要写入到<style></style>标签中。
style标签的type属性应该选择text/css2、CSS 注释CSS修改页面中的所有标签，必须借助选择器选中。
选择器中，可以写多对CSS属性，用{}包裹：每个属性名与属性值之间用:分隔，多对属性之间，必须用;分隔。
3、【CSS常用选择器】①标签选择器写法：HTML标签名{}作用：可以选中页面中，所有与选择器同名的HTML标签。
②类选择器(class选择器)写法：.class名{}调用：在需要调用选择器样式的标签上，使用class="class 名"调用选择器优先级：>标签选择器③ID 选择器写法：#ID名{}调用：需要调用样式的标签，起一个id="ID名"优先级：ID选择器>class选择器注意：一个页面中，不能出现同名ID【Class选择器与ID选择器的区别】写法不同:class选择器用.声明，ID选择器用#声明；优先级不同：ID选择器>class选择器作用范围不同：class选择器可以多次调用，ID选择器只能使用一次。
【选择器的命名规范】只能有字母、数字、下划线、减号组成；开头不能是数字。
也不能是只有一个减号。
一般，起名要求有语义，使用英文单词与数字的组合。
④通用选择器写法：*{}作用：可以选中页面中所有的HTML标签。
优先级：最低！！！⑤并集选择器写法：选择器1,选择器2,……,选择器n{}生效规则：多个选择器取并集，只要标签满足其中任意一个选择器，样式即可生效。
⑥交集选择器写法：选择器1选择器2……选择器n{} 所有选择器紧挨着，没有分隔生效规则：多个选择器取交集，则必须满足所有选择器的要求，才能生效⑦后代选择器写法：选择器1 选择器2 ……选择器n{} 选择器之间空格分隔生效规则：只要满足，后一选择器是前一个选择器的后代，即可成效。
css教程菜鸟
css教程菜鸟CSS（层叠样式表）是一种用于描述网页上的元素布局和样式的语言，它能够使网页更加美观和易于阅读。
本文将介绍一些CSS的基础知识和常用属性，以帮助菜鸟入门。
首先，让我们了解一下CSS的基本语法。
CSS由选择器和声明块组成。
选择器指定了要应用样式的HTML元素，而声明块则包含了一系列属性-值对，用于描述要应用到元素上的样式。
下面是一个简单的示例：```p {color: red;font-size: 20px;}```上述代码中，选择器“p”表示要应用样式的HTML段落元素。
声明块中的属性-值对指定了段落的文本颜色为红色，字体大小为20像素。
接下来，我们将介绍一些常用的CSS属性。
1. 字体属性：用于设置文本的字体样式，如字体大小、字体族等。
例如：```p {font-size: 16px;font-family: Arial, sans-serif;}```上述代码将段落的字体大小设置为16像素，字体族为Arial或者sans-serif。
2. 背景属性：用于设置元素的背景样式，如背景颜色、背景图片等。
例如：```body {background-color: lightblue;background-image: url("bg.jpg");}```上述代码将页面的背景颜色设置为浅蓝色，背景图片为名为“bg.jpg”的图片。
3. 边框属性：用于设置元素的边框样式，如边框宽度、边框颜色等。
例如：```div {border: 1px solid black;}```上述代码将`<div>`元素的边框宽度设置为1像素，边框颜色为黑色。
4. 盒模型属性：用于调整元素的尺寸和定位，如元素的宽度、高度、外边距等。
例如：```img {width: 200px;height: 150px;margin-top: 10px;}```上述代码将图片的宽度设置为200像素，高度设置为150像素，并且向上外边距10像素。
CSS知识点总结
CSS知识点总结⼀．Css分类1.替代replaced elements:img input(radio button, checkbox, text)不可替代nonreplaces elements:html,xhtml,span,a,div,body,form,p,em,strong,2.block-level and inline-level:(block可以包含inline 元素，反过来是不可以的！) block-level:p div li ulinline-level: a span strong em b i u⼆．选择器2.元素选择器：P{}3. Grouping Selectors(分组)eg:h2, p {color: gray;}4.The universal selector（通配选择器）eg:* {color: red;}5. Grouping Declarationseg:h1 {font: 18px Helvetica; color: purple; background: aqua;}6.类选择器：.ddd7.ID选择器：#ddd8.属性选择器简单属性选择h1[class] {color: silver;}根据具体属性值p[class="warning"] {font-weight: bold;}根据部分属性值选择p[class~="warning"] {font-weight: bold;}⼦串匹配属性选择器[foo^="bar"][foo$="bar"][foo*="bar"]特定属性选择类型*[lang|="en"] {color: white;}9.使⽤⽂档结构后代选择器blockquote b, p b {color: gray;}选择⼦元素h1 > strong {color: red;}选择相邻兄弟元素h1 + p {margin-top: 0;}10.伪类选择器静态伪类：a:visited{}a:link{}(好像⽤不了)动态伪类：a:focus{}(常⽤于input元素)a:hover{}a:active{}选择第⼀个⼦元素：Li:first-child{}根据语⾔选择（）*:lang(fr){}结合伪类：link:hover:active {color: orange;}伪元素选择器：设置⾸字母样式li:first-letter{ color:Red;设置第⼀⾏的样式：.aa:first-line{ color:Purple;}设置之前和之后元素的样式：a:before{ content:"{}"; color:Silver;}a:after{ content:"end"; color:Aqua;}三．结构和层叠1.特殊性：重要性：!Important (最强悍！) eg: p.dark {color: #333 !important; background: white;}内联样式特殊性：1000 ID选择器：0100 li#answer {color: navy;} /* 0,1,0,1 (winner) */类属性值，属性选择或伪类：0010 h2.grape{color: purple;}/* 0,0,1,1 (winner)*元素和伪元素：0001 h1 {color: red;} /* 0,0,0,1 */通配选择器：0000结合符:⽆继承：⽆（0特殊性⽐⽆特殊性的更强）Eg: * {color: gray;} (（当h1中有其他元素时win）h1#page-title {color: black;}2.继承a)Border：没有继承b)Body:可以向上继承到html,其他的都是向下继承3.层叠：具有相同特殊性的靠后的权重⼤按权重和来源排序：（p79）读者的重要声明>创作⼈员的重要声明>创作⼈员的正常声明>读者正常>⽤户代理声明按特殊性排序按顺序排序Lvha顺序⽐较重要：即live visited hover active四．值和单位1.数字2.百分数3.颜⾊命名颜⾊：blue green white red black maroon ...⽤GRB指定颜⾊函数式RGB颜⾊(百分数法：0%-100%，数字法：0-255)Eg:rgb(100%,100%,100%)rgb(0%,0%,0%)rgb(255,255,255)rgb(0,0,0)灰度表：p.one {color: rgb(0%,0%,0%);}p.two {color: rgb(20%,20%,20%);}p.three {color: rgb(40%,40%,40%);}p.four {color: rgb(60%,60%,60%);}p.five {color: rgb(80%,80%,80%);}p.six {color: rgb(0,0,0);}p.seven {color: rgb(51,51,51);}p.eight {color: rgb(102,102,102);}p.nine {color: rgb(153,153,153);}p.ten {color: rgb(204,204,204);}25%*255=63.75=64⼗六进制RGB颜⾊Web颜⾊：rgb值20%和52和33（⼗六进制）整除4.长度单位a)绝对长度单位：in,cm,mm,pt(点),pc（派卡）1in=2.54cm 1cm=0.3394in1 in=72pt 1 in=6pcB) 相对长度单位Em和ex:Px:1em=14px 1em=2exEm最好的度量单位5.URL绝对URL相对URL注意：url和开始括号之间不能有空格6.关键字None:不同于0，Inherit:它的属性值和⽗元素相同7.css2单位：p(110)a)⾓度值：deg, grad 和 radb)时间值：s,ms 1000ms=1sc)频率值：hz,mhz五．字体1.字体系列制定字体系列：p {font-family: TimesNR,serif;}p {font-family: Times,TimesNR,'New Century Schoolbook',Georgia,'New York',serif;} 有空格、包括“#”和”$”的时候加“单引号”Cursive必须加“双引号”2.字体加粗a)Font-weight:bold bolder mormal 100 --900 lighterb)相对⼤⼩关键字:Bolder 是相对于⽗级字体粗细⽽⾔3.字体⼤⼩a)Font-size:xx-small x-small small medium large x-large xx-large smaller larger inheritb)相对⼤⼩关键字：larger smallerc)绝对⼤⼩：xx-small x-small small medium large x-large xx-larged)百分数：根据⽗元素继承的⼤⼩来计算strong {font-weight: lighter; font-size:larger;}strong b {font-weight:lighter; font-size:200%;}4.风格和变形a)字体风格：Font-style:italic oblique normal inheritb)字体变形：font-variant:small-caps normal inherit（只对英⽂有⽤，对汉语没有影响）c)转换⼤⼩写：p{ text-transform:uppercase;}5.拉伸和调整字体a)字体拉伸：font-stretch:normal| wider | narrower | ultra-condensed | exTRa-condensed| condensed| semi-condensed| semi-expanded| expanded| exTRa-expanded| ultra-expanded | inheritb)我的浏览器不⽀持（可以忽略）6.Font属性a)等价：h1{ font-style:inherit; font-weight:bold; font-variant:small-caps; font-size：20px; font-family:Candara,Corbel;}h1{ font:inherit bold small-caps20px Candara,Corbel; }b)注意;前两个可以互换，后两个不可以，normal 可以省略c)增加⾏⾼：line-height,Eg：body {font-size: 12px;}h1 {font: bold italic200%/1.2Verdana,Helvetica,Arial,sans-serif;}7.字体匹配六．⽂本属性1.缩进和⽔平对齐a)缩进⽂本：(只能⽤于块级元素！)text-indent:3em 10%b)⽔平对齐：(只能⽤于块级元素！)text-align:left center right justify(两端对齐⽂本) inherit2.垂直对齐：元素中⽂本基线之间的最⼩距离a)Line-height:”line-height”减去“font-size”等于⾏间距i.Line-height:18px,0.33in,150%,1.5emii.适⽤于所有元素iii.⾏⾼和继承：Line-height值从⽗元素继承时，要从⽗元素计算，⽽不是⼦元素上计算。
css总结笔记
css总结笔记
CSS 是层叠样式表的缩写，是一种用于设计和布局网页的编程语言。
以下是CSS 总结笔记的全文:
一、CSS 的概述
CSS 用于设计和布局网页，可以让网页变得更加生动、美观和易读。
CSS 可以用于网页的头部、主体和底部，以及用于网页的各个部分。
二、CSS 的语法
CSS 的语法包括选择器、属性和值等。
选择器用于选择网页中的元素，属性和值用于设置元素的样式。
三、CSS 的样式
CSS 的样式包括颜色、字体、大小、边框、背景等。
通过设置这些样式，可以让网页变得更加美观。
四、CSS 的应用场景
CSS 的应用场景包括网页的布局、元素的样式设置和网页的颜色搭配等。
通过使用 CSS，可以让网页变得更加生动、美观和易读。
五、CSS 的兼容性
CSS 在不同的浏览器中有不同的兼容性问题。
为了解决这个问题，可以使用CSS 的媒体查询和伪元素等方法。
六、CSS 的优化
CSS 的优化可以提高网页的加载速度和用户体验。
可以通过减少重排、减少重写和压缩 CSS 等方式进行优化。
七、CSS 的拓展
CSS 还有很多拓展功能，如响应式设计、动画效果、Web 组件等。
通过使用CSS，可以让网页变得更加生动、美观和易读。
八、CSS 的总结
CSS 是网页设计中不可或缺的一部分。
通过使用 CSS，可以让网页变得更加生动、美观和易读。
在学习 CSS 时，需要熟练掌握语法、样式和应用场景，并了解 CSS 的兼容性和拓展功能。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
CSS学习知识点1、css是什么？CSS（Cascading Style Sheet）可译为“层叠样式表”或“级联样式表”，它定义如何显示 HTML元素，用于控制网页的外观。
2、为什么使用css，优点是什么？1：【内容】和【表现】相分离HTML文件中只存放文本信息，将样式部分放在一个独立样式文件中。
页面对搜索引擎更加友好。
2：提高页面浏览速度采用CSS布局的页面容量要比TABLE布局的页面文件容量小得多，前者一般只有后者的1/2大小。
3：易于维护和改版只要简单的修改对应CSS文件，就可以重新设计整个网站的页面。
4: 使用CSS布局更符合现在的W3C标准W3C组织是对网络标准制定的一个非赢利组织，像HTML、CSS、XML的标准就是由它来定制。
3、CSS样式表的调用方式哪几种？1、内部样式：把CSS样式表放到<head>文档中：格式如下：<style type=“text/css”> …… </style>2、内联式：把CSS样式表写在HTML对应的标记内。
格式如下：<p style="font-size:14pt;color:blue">蓝色14号文字</p>3、外部样式：把编辑好的CSS文档保存成“.CSS”文件，然后在<head>中定义。
格式如下：<head> <link rel=stylesheet href="css的文件地址">.....</head>4、导入样式：与链入外部样式的功能基本相同，只是语法和实现方式上有差别。
格式如下：<style> @import url(css.css);</style>4、几种调用方式的优先级？从高到低：内联样式--------外部样式---------内部样式-----------导入样式5、CSS的语法:CSS的定义是由三部分构成: 选择器，属性和属性值。
语法: selector {property: value;} --------------------- 选择符{属性:值}举例：body {color:#006666;font-size: 18px;} 属性和属性值之间是冒号，多个属性值之间用分号隔开。
6、css选择器分类1、类选择器定义：类选择器根据类名来选择，前面以”.”来命名，如.demo{color:#FF0000;}使用方法：在HTML中，标记可以定义一个class的属性来调用。
如<p class="demo"> ....</p>2、id选择器定义：根据元素ID来选择元素，具有唯一性。
前面以”#”号来标志，如：#demo{color:#FF0000; }使用方法：在HTML中，标记可以定义一个id的属性来调用。
如<p id="demo"> ....</p>3、标签选择器定义：HTML页面是有很多不同的标签组成，标签选择器，则是决定对应标签采用相应的CSS样式。
使用方法：p{ font-size:12px; background:#900; color:090; } ，页面里对应的p标记全部应用此样式。
4、伪类选择器(针对超链接)一般伪类都只会被应用在链接的样式上，格式如下：a:link{color: #000099;} --------------------------带有超链接的文字显示的样式。
a:visited{color: #000099; } ---------------------访问过的超链接显示的样式。
a:hover{color: #000099; } ----------------------鼠标放在超链接上显示的样式。
a:active {color: #000099;}-----------------------鼠标按下去是超链接显示样式。
a {color: #000099;}-------------------------------标签选择器,链接的颜色。
5、后代选择器（派生选择器）通过依据元素在其位置的上下文关系来定义样式，可以使标记更加简洁。
#demo p {color:#ff0000; size:14px;}6、通用选择器通用选择器用*来表示。
例如：*{font-size: 12px;} 表示所有的元素的字体大小都是12px。
7、并集选择器（群组选择器）当几个元素样式属性一样时，可以共同调用一个声明，元素之间用逗号分隔。
比如：p, td, li {line-height:20px; color:#ff0000;}7、常用CSS缩写语法在网页设计中使用css缩写可以帮助减少你CSS文件的大小，更加容易阅读。
css缩写的主要规则如下：一、颜色16进制的色彩值，如果每两位的值相同，可以缩写一半，例如：#000000可以缩写为#000;#336699可以缩写为#369;二、盒尺寸通常有下面四种书写方法:property:value1; 表示所有边都是一个值value1；property:value1 value2; 表示top和bottom的值是value1,right和left的值是value2property:value1 value2 value3; 表示top的值是value1，right和left的值是value2，bottom的值是value3 property:value1 value2 value3 value4; 四个值依次表示top,right,bottom,left方便的记忆方法是顺时针：上、右、下、左。
具体应用在margin和padding的例子如下：margin:1px 0 2px 5px;三、边框(border)边框的属性如下：border-width:1px; -------------------------边框宽度border-style:solid; -------------------------边框样式（实线，虚线等）border-color:#000; -------------------------边框颜色可以缩写为一句：border:1px solid #000;（属性值没有顺序。
）四、背景(Backgrounds)背景的属性如下：background-color:#f00; --------------------------------------背景颜色background-image:url(background.gif); -------------------背景图片background-repeat:no-repeat;---------------------------------背景图片是否重复background-attachment:fixed;--------------------------------背景图片是否固定background-position:0 0;--------------------------------------背景图片位置可以缩写为一句：background:#f00 url(background.gif) no-repeat fixed 0 0;语法是：background:color image repeat attachment position;你可以省略其中一个或多个属性值，如果省略，该属性值将用浏览器默认值默认值为：color: transparent，image: none，repeat: repeat，attachment: scroll，position: 0% 0%五、字体(fonts)字体的属性如下：font-style:italic;------------------------------------字体风格（斜体，正常体等）font-variant:small-caps;--------------------------字体的小型大写字母的字体显示font-weight:bold;----------------------------------字体的粗细font-size:1em;-------------------------------------字体的大小line-height:140%;---------------------------------字体的行距font-family:"Lucida Grande",sans-serif; ------------字体系列（宋体，楷体等）可以缩写为一句：font:italic small-caps bold 1em/140% "Lucida Grande",sans-serif;注意，如果你缩写字体定义，至少要定义font-size和font-family两个值。
六、列表(lists)list的属性如下:list-style-type:square; (none代表什么都没有)list-style-position:inside;list-style-image:url(image.gif);可以缩写为一句：list-style:square inside url(image.gif);取消默认的圆点和序号可以这样写list-style:none;,CSS注意事项：1、如果属性值是若干单词，则要给值加上引号；比如：p{font-family:Georgia,"sans serif",Palatino;}2、CSS语法里不分大小写，但是元素在调用id和class是区分大小写的。
比如：#divid{color:#FFFF00; size:20px;}，调用时应写成id="divid"，不能写id="DIVID"。
class也一样。
3、养成写完每个属性值后加上“;”号的好习惯。
比如：body { color:#006666; font-size:18px;}4、ID选择器只能在html文档中出现一次。
在现代布局中，id选择器常常用于建立派生选择器。
5、在一个div里，如何让内容垂直居中？方式是设置line-height属性，属性值为div的高度。
6、在ul无序列表里，让内容居左对齐。
设置ul的margin:0px;padding:0px7、Div如何居中？设置margin:0 auto;。