苏伟雄个人博客

CSS核心基础知识 一，CSS简介 层叠样式表，使HTML搭建好的框架更加美化 二，CSS简单语法 建议写在head标签中 三，CSS选择器 概念：引导指向需要修饰的标签或者元素 a.ID选择器 概念：ID选择器可以为标有特定ID的HTML元素指定特定的样式。HTML元素以ID属性来设置ID选择器,CSS中ID选择器以 “#” 来定义。 格式： #ID的名称{ 属性名称：属性值； 属性名称：属性...

选择器详解（一） 一，属性选择器 CSS3中追加三个属性选择器，这样的选择器具有通配符的概念 1，[att*=val] 选择属性值包含有val字符串的所有标签 2，[att^=val] 选择属性值以val字符串开头的所有标签 3，[att$=val] 选择属性值以val字符串结尾的所有标签 att指选择器，val指选择器后对应的属性值 API权威解释 示例： 二，结构性伪类选择器 1...

选择器详解（二） 一，“-child”类型伪类选择器 1，:first-child 针对父元素的第一个子元素 2，:last-child 针对父元素的最后一个子元素 3，:nth-child（n） 1，针对顺序指定序号的子元素 2，针对奇偶性指定的子元素，odd奇数，even偶数 拓展： ：nth-child(n) 括号中的n 可依据 " αn + β "定律书写 "α"指每次循环中所包含...

CSS3 一，样式表组成 CSS3组成层次图 样式表 –>规则 –>选择器 + 声明块 –>声明 –>css属性 + css属性值 二，浏览器读取编译CSS顺序 在多个选择器中，针对渲染的复杂化度来分析，CSS选择器读取方向为从右往左 ...

文字与字体相关样式 一，文字阴影效果 实现方式： text-shadow:横向距离 纵向距离 模糊程度 模糊颜色; 1，纵向横向距离可以是负数 2，一个属性可以设置多个阴影效果 二，引用字体 实现方式： 三，改变字体种类保持字体大小 实现方式： font-size-adjust:aspect; aspect的计算方式： aspect: 0.58 = x-height: 58(高度) ...

盒子相关样式 一，盒子的类型 在CSS中我们利用display属性来定义盒子的类型，块级元素属于block类型，行内元素属于inline类型，其中还有block-inline类型。 实现方式： display: 属性值； 属性列表 二，内容溢出盒子边界处理 实现方式： 1，常用边缘裁剪 overflow：属性值 属性列表 2，左右边缘裁剪 overflow-x:属性值 3，上下边缘裁剪 ...

背景相关样式部分 一，背景绘制区域样式 实现方式： background-clip:属性值； 属性列表 二，背景图片定位区域样式 实现方式： background-origin:属性值； 属性列表 三，多重背景样式 实现方式： 1，多张背景图 background-image：url("图片地址"),url("图片地址")，...url("N张图片地址")； 2，背景图平铺 backgr...

动画功能 一，Transition功能 将元素的某个属性，从属性值指定的时间内平滑的过渡到另一个属性值。 实现方式： transition：progerty dration timing-function; progerty：指定需要执行动画的属性值 dration：动画执行时间 timing-function：动画执行方式 示例： 二，Animations功能 通过定义多个关键帧来实现复...

选择器声明优先级 注：本笔记由“尚硅谷”提供的笔记整理，非笔者原创 一，选择器的特殊性 选择器的特殊性由选择器本身的组件确定，特殊性值表述为4个部分 0,0,0,0 一个选择器的具体特殊性如下确定： 1.对于选择器中给定的ID属性值，加 0,1,0,0 2.对于选择器中给定的各个类属性，属性选择，或伪类，加 0,0,1,0 3.对于选择器中的给定的各个元素和伪元素，加0,0,0,1 4.通配...