CSS란 무엇입니까?
02분46초CSS를 소개하는 세 가지 방법
05분52초CSS의 기본 구문
05분37초기본 CSS 선택기(요소, 카테고리, ID)
07분43초파생 선택자와 속성 선택자
09분26초CSS의 의사 클래스
10분00초CSS의 텍스트 컨트롤
12분28초CSS의 글꼴 제어
08분29초CSS의 배경 제어
09분28초CSS의 목록 컨트롤
07분24초CSS의 링크 제어
06분03초CSS의 테이블 제어
10분34초CSS의 일반적인 의사 요소
06분30초CSS의 상자 모델 이해
03분32초CSS 테두리
13분19초CSS 패딩
07분07초CSS의 여백
09분19초CSS 위치 지정 개요
04분46초CSS 상대 위치 지정
06분10초CSS 절대 위치 지정
05분38초CSS에서 부동
08분01초CSS 실용적인 레이아웃 (1)
17분41초CSS 실용적인 레이아웃 (2)
12분45초CSS 실용적인 레이아웃 (3)
17분53초후문
01분55초
老姨5年前
第一章：css快速入门 一，css的基本语法： 1，内联样式：只针对当前标签<标签 style="css属性：属性值："> <body style ="background:pink;"> 2，内部样式：只针对当前写法：在head元素内部 标签名{属性：属性值} p{color:pink} 3，外部样式：共享的css文件需要引用一个外部的css文件： 二，css的基础选择器（元素，类别，ID） /*选择器{声明} 选择器{属性：属性值；属性：属性值；}*/ p{color:red;} /*选择器的分组*/ h1,h2,h3,h4{font-size:40px;} 三，派生选择器与属性选择器 /*元素选择器*/ html{color：red;} p{text-align:center;} /*类别选择器*/ .list-1{color:green} p,.list-1{font-size:40px;} .list-1,.list-2{color:pink;} /*id选择器*/ #one{color:pink;font-size:30px;} 四，css中的伪类 /*派生选择器：（后代，子元素，相邻兄弟）*/ /*后代选择器*/ ul em{color:blue;} ul b{color:pink;} /*子元素选择器*/ ul>li{font-size:60px;} li>em{font-size:40px;} /*相邻兄弟选择器*/ ul+ol{text-align:center;} /*属性选择器*/ a[href]{color:blue;} a[href+定义的网址]{color:green;} 五，css中伪元素 语法：选择器：伪类型 {样式} 锚伪类：（未被访问状态，已被访问状态，鼠标悬停状态，活动状态） ：link 未被访问的链接添加样式 a：link{color:pink;} ：visited 向已被访问链接添加样式 a:visited{color:red;} ：hover向鼠标悬停时向元素添加样式 a:hover{background:blue;} ：active向被激活的元素添加样式 a:active{color:#fff} ：focus向拥有键盘输入焦点的元素添加样式 input：focus{background:blue;} ：first-child 向第一个子元素添加样式 p:first-child{font-size:50px;} p:first-child b{color：red；} 第二章：css中常见样式 一，css中的文本控制 color：设置文本颜色 h1{color：pink} direction：设置文本方向 h2{direction：rt1；} line-height：设置行高 p{line-height：40px；} letter-spacing：设置字符间距 p{line-height：40px；letter-spacing：2px；} word_spacing:设置字间距 text-indent：缩进首行文本 p{line-height：40px；letter-spacing：2px；text-indent：2em；} text-decoration：向文本添加修饰 h3{text-decoration：underline；}文本有下划线 h4{text-decoration：overline；}文本上面有横线 h4{text-decoration：line-through；}文本中有横线 a{text-decoration：none；}没有横线 text-align:对齐元素中的文本 h1{color：pink；text-align；right；} text-transform：控制元素中的字母 .one{text-transform:capitalize;}定义文本中首字母为大写 .one-1{text-transform:uppercase;}定义文本中字母全是大写 .one-2{text-transform:lowercase;}定义文本中字母全是小写 二，css中的字体控制 font-family:属性定义文本的字体系列（通用系列：serif,sans-serif,monospace,cursive,fantasy） /*通用系列*/ h1{font-family:monospace;} /*特定*/ h2{font-family:dosis;} font-style:属性规定斜体文本（normal，italic，oblique） font-weight:属性用来设置文本粗细的（normal，bold,100~900） font-size ：属性用来设置文本的大小（px\em\%） 三，css中的背景控制 background-color：属性设置元素的背景颜色（color-name\hex-name\rgb-name） background-image:属性为元素设置背景图形 例A .list-2{background-image(images/1.png)width:100px;height:100px;} background-repeat：属性设置是否或者重复背景图像（repeat\repeat-x\repeat-y\no-repeat） background-position:属性设置背景图像的起始位置（top，bottom，left，right，center\%\px） 四，css中的列表控制 list-style-type 属性设置列表标记的类型（disc/none/square/decimal/...） list-style-：属性使用图像来替换列表项的标记 list-style-position：属性设置在何处放置列表项标记 list-style：复合写法 四，css中的链接控制 a{color:#ccc;font-size:20px;} 五，css中的表格控制 border-style：属性用于设置元素边框的样式（dotted,solid,double,dashed/...） border-collapse:属性设置是否将表格边框折叠为单一边框(separate/collapse) border-spacing:属性设置相邻单元格的边框间的距离(length length) caption-size:属性设置表格标题的位置(top/bottom) 表格中的文本对齐方式： text-align：属性设置水平对齐方式(left/center/right) vertical-align:属性设置垂直对齐方式(top/center/bottom) 六，css中常见的伪元素 before：该元素定义在元素之前添加内容 h1:before{conntent:ur1(图片来源)；"哈喽！"} after：该伪元素定义在元素之后添加内容 first-line：该伪元素向文本的首行添加内容特殊样式 first-letter：该伪元素向文本的第一个字母添加特殊样式 第三章：css中的盒模型 *{margin：0px；padding：0px;}内外边距为零。 一，css的边框 border-style：属性用于设置元素所有边框样式 border-width：属性为元素的所有边框设置宽度（thin\nedium\thick\length） border-color:s属性设置四条边框的颜色 *border：简写属性，用于把针对四个边的属性设置在一个声明内 二，css的内边距 *{padding:0px;} padding：简写属性在一个声明中设置所有内边距属性（auto、length/%）通过使用下面四个单独属性可以分别设置上，下，左，右内边距： padding-top padding-right padding-bottom padding-left 三，css的外边距 *{padding：0px；margin：0px；} margin：是简写属性可以声明中设置所有外边距属性（auto/lenfht/%）该属性可以有1到4 个值 第四章：css的定位 一：css的相对定位 position：relative；设置为相对定位的元素框会偏移某个距离，语速仍然保持其未定位前的形状，它原本所占的空间仍保留；(positiion与top,bottom,right,left连用) 二，css中的绝对定位 position：absolute；设置了绝对定位的元素框从文档流完全删除并且元素原先在正常文档中所占的空间会关闭，就好像该元素原来不存在一样，位置是相对于已定位的父级元素或者是初始包含块定位 三，css中的浮动 float：属性定义元素在那个方向浮动（left/right） 浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止，由于浮动框不在文档的普通流中，所以文档的普通流中的块表现的就像浮动框不存在一样。 clear：属性规定元素的那一侧不允许其他浮动元素（left/right/both） 第五章，css实战案列 一，css实战布局 border：radius；属性控制圆角（与top，bottom.left,right连用）
0
