H5+C3复习
一，常见架构
CS和BS架构的区别就是一个有客户端一个就是网页。
干前端的主要是写BS架构
行块元素
块级元素：独占一行（排版标签都是块级元素）
行内元素：不独占一行，input等
使用规则：
1.块级元素中能写行内元素和块级元素，啥都能写
2.行内元素中能写行内元素，不能写块级元素
3.特殊规则：h1-h6不能嵌套使用，p中不要写块级元素
图片格式
jpg格式，有损的压缩格式，占用内存小，颜色丰富，不透明不动图。
png格式，无损的压缩格式，颜色丰富，内存占用大，透明背景，不动图。
bmp格式，不压缩的格式，最大程度保持细节。占用空间极大 ，不透明不动图。
gif格式，颜色较少，简单透明，动图。
webp格式，谷歌推出的格式，用来网页中呈现图片，兼容性一般
base64格式，特殊文本，需要通过浏览器打开，传统应用无法查看，可直接作为img标签的src值，不受位置影响
常用标签
br，换行，但标签
hr，分割，单标签
pre，嵌入代码，双标签
html全局属性
id唯一标识
class 指定类名
style指定样式
dir，内容的放向，不咋用
title，文字提醒，a和img多
lang，指定语言
并集选择器
.person,.personBody,.personStyle{}
子代选择器
.grandFather>.father>.son{}
兄弟选择器
相邻兄弟选择器 紧挨着的下一位
.brother1+brother2{}
通用兄弟选择器 符合条件的所有
.brother1~brother2{}
属性选择器
E[att] { ... }：选择具有指定属性att的元素E，不论属性值是什么。
E[att="value"] { ... }：选择属性值完全等于指定值value的元素E。
E[att="value"] { ... }：选择属性值中包含指定单词value的元素，单词可以是属性值的一部分或完整值（注意，这里的“”要求单词必须独立，且用空格分隔）。
E[att^="value"] { ... }：选择属性值以特定字符串value开头的元素。
E[att$="value"] { ... }：选择属性值以特定字符串value结尾的元素。
E[att*="value"] { ... }：选择属性值中包含特定字符串value的元素（与“~”不同，这里没有单词独立的要求）。
示例
a[href]：选择所有具有href属性的a元素。
img[src="logo.png"]：选择src属性值为"logo.png"的img元素。
div[class~="myclass"]：选择类名中包含单词"myclass"的div元素（注意类名中的单词用空格分隔）。
a[href^="https"]：选择href属性值以"https"开头的a元素。
a[href$=".pdf"]：选择href属性值以".pdf"结尾的a元素。
p[data-info*="urgent"]：选择data-info属性值中包含"urgent"字符串的p元素。
伪类选择器
：link 超链接未被访问
：visited 超链接访问过的状态
：hover 鼠标悬停在元素的状态
：active 元素激活的状态
：focus 获取焦点的元素
子类选择器
了解即可
伪元素选择器
：：before 在元素最开始的位置，创建一个子元素
：：after 在元素最后的位置，创建一个子元素
选择器优先级重要
比较规则
继承性
字体风格
normal：默认，正常
italic：斜体
oblique：强制斜体
font-style：normal
文本修饰
文本相关的
文本对齐 text-align：center，left，right
行高 line-height
文本缩进 text-indent:40px
文字对齐方式：vertical-align：top,middle,bottom X基线
css列表属性
表格属性
背景属性
鼠标属性 常用pointer
盒子模型
行内元素
元素显示模式
display:none 隐藏
※盒子模型
盒子内容区
※盒子默认宽度
盒子边框属性
盒子外边距margin
※盒子塌陷问题
margin合并问题
内容溢出处理
隐藏元素的方式
样式继承
默认样式
布局技巧
元素空白问题
行内块幽灵空白问题
浮动特点
浮动后产生的影响
清除浮动
※※定位 子绝父相
相对定位
绝对定位
※固定定位
粘性定位
定位层级
版心，一般自己设置，名为container
常用布局名称
重置默认样式，在开发中都会有重置的css，引入即可
※新增语义化标签
meter标签 了解即可
新增列表标签 了解
新增文本标签 了解
新增表单功能
input新增属性值
视频标签
音频标签
新增全局属性 了解
H5兼容性问题解决
c3新增长度单位
怪异盒模型
resize调整盒子大小
box-shadow盒子阴影
不透明度
设置背景图原点
背景图向外裁剪区域
背景图尺寸
多背景图
边框圆角
边框外轮廓 了解
c3新增文本属性
文本换行
文本溢出
文本修饰
文本描边
c3新增渐变
线性渐变
渐变方向
关键词
角度
调整开始渐变的位置
径向渐变
关键词，像素值调整位置
调整渐变形状为正圆
调整形状的半径
调整开始渐变的位置
Web字体 了解
2D位移
2D旋转
2D扭曲
多重变换
变换原点
3D变换
透视点位置
3D位移
3D旋转
3D缩放
BFC面试题，BFC是块级格式上下文，理解为特异功能，元素的隐藏属性，默认为关闭，满足某些条件自动激活。开启方式如上图
flow-root 是新的最好清楚浮动影响的方法，但是IE浏览器不支持
原文地址：https://blog.csdn.net/ytpedancerow/article/details/143863720
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！