选择器:
属性选择器:[属性名]:设置名称为属性名
[属性名="属性值"]:属性名与命名值
[属性名~="属性值"]:
[属性名|="属性值"]:
[属性名^="属性值"]:以属性值开头的所有行
[属性名$="属性值"]:以属性值结尾的所有行
[属性名*="属性值"]:包含属性值
兄弟元素选择器:查找后边一个兄弟元素 . 兄弟元素 + 兄弟元素{}
查找后边所有的兄弟元素 . 兄弟元素 ~ 兄弟元素{}
子元素选择器:父元素 > 子元素{} 【ie6即以下浏览器不支持】
:first-child 选择第一个子标签【所有】
:last-child 选择最后一个子标签
:nth-child 选择指定位置的子元素 其中odd奇数行;even偶数行
:first-of-type |同
:last-of-type |下 type中指【当前类型】
:nth-of-type | 选择指定类型的子元素
否定伪类::not(选择器) eg:p:not(.hello) 表示选择所有的p元素但class为hello的除外
继承:指CSS中祖先元素的样式会被子元素继承。(并非所有)
背景边框和定位不会被继承
权重:CSS选择器选择元素时,会一元素被多元素选中、此时会看权重即优先级
内联样式:权重是 1000
id选择器:权重是 100
类、属性、伪类选择器:权重是 10
元素选择器:权重是 1
通配符:权重是 0
继承的样式,没有优先级
计算权重:将一个样式的全部选择器相加
并集选择器的优先级是单独计算的
!important:优先级更高,优先于所有,但尽量避免
文本标签:
<em>:斜体 表语气强调
<strong>:粗体
<i>: icon图标 可用于电商网站的小图标 【答辩重点】
<b>
<small> 小字体.用于底下条款等
<cite>参考内容
<q>短引用
<blockquote> 长引用 如论坛引用评论
<sup>上标(类似百度百科超链接)
<sub>下标
<ins>插入内容 加下划线
<del>表删除内容
<code>|
<pre> |一般code包pre结合使用
box:
列表:互相之间随意嵌套
<ol>+<li>有序列表
<ul>+<li>无序列表
<dl><dd><dt>定义列表 dl列表 dd描述 dt内容 可互相嵌套 类似下拉列表 {list-style:none;}给ul列表设
单位:
长度单位:
em:1em = 1font-size
像素:px
百分比% : 针对父元素来讲,如父元素使用大小为16px,则100%就是16px,同理200%就是32px
颜色:
RGB(r,g,b)表示法 可用0~255或0%~100%
直接使用颜色表示
十六进制颜色:#6600FF 按顺序为红绿蓝 如每一组两个数字都想同,可简写为#60F (举例用字母数字不固定)
RGBA:比RGBA多了一个A(alpha),区间为(0~1)0为完全透明,1为不透明 RGBA(255,100,5,0.5)
前端三大块
结构:html
表现:CSS
行为:javascript