两周的学习时间眨眼就过，现在也能开始写一些简单的网页了，虽然代码写的很慢很吃力，但是看着在自己手中完成一个完整的网页还是挺有成就感的。
还是总结总结这周所学吧。
补充一下CSS选择器吧：
一.选择器
1.子元素选择器:
选择作为某元素子元素的元素
h1>strong{color:red}-----选择h1元素的子元素strong变为红色
2.相邻兄弟选择器:
选择紧接在另一元素都的元素,且二者具有相同的父元素
h1+p{color:red}--------选择h1元素后的p元素变为红色
3.伪类:
向某些选择器添加特殊效果
属性: hover---鼠标悬浮在元素上方时为元素添加样式
first chlid---向元素的第一个子元素添加样式
4.伪元素:
向某些选择器设置特殊效果
属性:first letter----向文本的首字母设置特殊样式
first line-----向文本的首行设置特殊样式
接下来是一些其他的基础内容，都是一些自己掌握的不太好的：
CSS3转换
浏览器支持:-webkit-transform 谷歌
-moz-transform 火狐
-o-transform 欧朋
-ms-transform IE9
2D转换
transform{
translate---元素从其当前位置移动
例:translate(50px,100px) 把元素从左侧移动 50 像素，从顶端移动 100 像素
rotate ----元素顺时针旋转给定的角度。允许负值，元素将逆时针旋转
例: rotate(30deg) 把元素顺时针旋转 30 度
scale----元素的尺寸会增加或减少，根据给定的宽度（X 轴）和高度（Y 轴）参数
例:scale(2,4) 把宽度转换为原始尺寸的 2 倍，把高度转换为原始高度的 4 倍
skew-----元素转动给定的角度，根据给定的水平线（X 轴）和垂直线（Y 轴）参数
例:skew(30deg,20deg) 围绕 X 轴把元素转动 30 度，围绕 Y 轴转动 20 度
3D转换
transform{
rotateX与rotateY----围绕X,y轴以给定的度数进行旋转
过渡
CSS3 过渡是元素从一种样式逐渐改变为另一种的效果
必须规定两项内容：
1.规定您希望把效果添加到哪个 CSS 属性上
2.规定效果的时长
向宽度、高度和转换添加过渡效果
{transition: width 2s, height 2s, transform 2s;}
动画
通过规定至少以下两项 CSS3 动画属性，即可将动画绑定到选择器：
1.规定动画的名称
2.规定动画的时长
例
div{width:200px;height:200px;background:black;position: relative}
div{animation: a 6s;}
@keyframes a
{
0% {background: red ;left: 0;top: 0}
25% {background: blue ; left: 200px;top: 200px}
75% {background: red ;left: 300px;top: 300px}
100%{background: yellow;left: 0;top:0 }
}
权重值
1.第一级：内嵌样式 1000
2.第二级：ID选择器 0100
3.第三级：类，伪类选择器 0010
4.第四级：元素选择器 0001
注：通配符选择器（*），子元素选择器（>）与相邻兄弟选择器（+）权重值为 0000
定位
1. display：block-------可以让行内元素（比如 <a> 元素）表现得像块级元素一样
display：none -------让生成的元素没有框
2.position 属性
relative-----相对定位：元素框偏移某个距离。元素仍保持其未定位前的形状，它原本所占的空间仍保留
absolute-----绝对定位：元素框从文档流完全删除，并相对于其包含块定位（包含块可能是文档中的另一个元素或者是初始包含块）
fixed -----固定定位：生成绝对定位的元素，相对于浏览器窗口进行定位
时间： 2024-10-25 18:22:24