2021-05-22 于晓雯

目录

一、学习总结

1、CSS层叠(级联)样式表:用于设置HTML元素的样式;它由选择器和一条或多条声明组成

selector {declaraction 1;declaraction 2;.......eclaraction N}

2、声明由属性和值组成

selector {property:value;}

3、CSS常用的四种用法:

​ 1)内联样式:通过当前元素style属性指定样式(又称行内样式);

​ 2)内部样式:通过style属性嵌入CSS样式,范围当前页面;

​ 3)外部样式表:是一个CSS文件,用link引用,rel的值为stylesheet,href的值为外部CSS文件位置;

​ 4)等级:内联样式 > 内部样式和外部样式表(如有! important提高样式等级,则有! important的样式等级最高);内部样式与外部样式的优先级,取决于就近原则或用! important提高样式等级。

4、选择器

​ 1)标签选择器:不区分大小写;选择器与标签一致;一般是同一元素。

​ 2)class选择器:以"."开头,class属性的值自定义;严格区分大小写;多个值之间用空格隔开;可选中网页中不同元素;包含。

​ 3)属性选择器:[属性]{....};必须是显示声明了的;根据 HTML 元素的属性来选择相应的元素;

​ 4)ID选择器:以#开头;# id名称;区分大小写;必须等于指定元素;

​ 5)伪类:网页元素的状态:a.link:表示未访问;a.visited:表示访问过;a.hover:表示鼠标悬停时,其它html元素也有此状态;a.active:表示激活时;a.last-child:表示最后一个元素;a.first-chlid:第一个元素;a.nth-child(1):表示第一个子元素;a.before:表示在元素渲染之前;a.after:表示在元素渲染之后。

​ 6)后代选择器:又称包含选择器,空格代表后代;

​ 7)子元素选择器:直接子标签适用;

​ 8)通配选择器:*,所有的元素都遵循此格式。

5、常用CSS属性

​ 1)width:value:宽,单位可以是px(像素)/%(百分比);

​ 2)height:value:高,单位同上;

​ 注:shift+10:一次加10;ctrl+10:一次加100.

​ 3)border-width:边框粗细;border-style:边框样式(solid为默认;none为禁用);border-color:边框颜色;border:width style color:四周边框;border-bottom:下边框;border-top:上边框;border-radius:圆角边框。

​ 4)margin:设置元素外边距;margin:0px auto:居中对齐显示,必须 为块元素;

​ 设置一个值:四周外边距;分别设置外边距:上、右、下、左须与四个值对应;若设置两个值:则第一个数为上下边距,第二个值为左右边距;如若缺省其中一个值:则与其对应边距一致;

​ 5)外边距折叠

二、心得体会

通过今天的学习,对CSS有了大致认识,就是看的时候会,做的时候就卡壳了,还是觉得理解的不够到位,总结下来问题还是挺多的,知识点太多的话容易混,也记住不,就抽时间好好练练。

三、疑难问题

1、用CSS来编辑形成各种图案时的参数变化不清楚。

标签

© 2021 成都云创动力科技有限公司 蜀ICP备20006351号-1