学习html总结（四）
伪元素：一个每日有标签的元素，不能独立存在，要依附于其他真实元素
元素内容由content属性提供
伪元素的其他特征跟真实元素没区别
xxx::after{......}/xxx::before{.....} --------两种写法,可以同时生成两个伪元素
生成的伪元素会出现在主元素的内部，也就是相当于它的子元素
css3动画：
transition（过渡）
transition: 3s;-----------过渡三秒，可以在秒前加方向或者别的
translate(变形)
rotate()----旋转---------rotateX(20deg)/rotateY(45deg)/rotateZ(30deg)-----deg代表角度名叫杜为正时候顺时针旋转
translate()--位移--------translateX(20px)/translateY(20px)/translateZ(20px)---在原来的基础上产生的位移偏移，该偏移不会对网页布局产生任何影响
scale()------缩放--------scale(2.5)--放大至2.5倍----scale(0.7)--缩小至0.7倍
ps: transfrom:translateX(50px) rotateZ(360deg) scale(1.4);---------三种变形效果可以同时叠加，注意编写顺序，会影响执行顺序
@keyframes:
第一种编写方式：该动画表示的含义是，元素的背景颜色从红色变为绿色
@keyframes bgchange{
from{
background:red;
}
to{
background:green;
}
}
第二种编写方法：该动画表示的含义是：元素的背景色，从红色开始，在40%的时候变为黄色，70%时候变为粉色，在100%时候变为绿色
@keyframes bgchange{
0%{
background:red;
}
40%{
background:yellow;
}
70%{
background:pink;
}
100%{
background:green;
}
如何调用帧动画？
div.info{
animation:bgchange 5s infinite;----------------------元素使用了bgchange这个动画，并且持续5秒完成，动画无限循环播放
}
补充：：
css属性的简写
背景相关：
background:grayurl(XXX/XX.png) norepeat;
(背景色) (背景照片) (平铺方式)
边框相关：
border : 1px solid #D31402;
(边框宽度)(边框样式)(边框颜色)
字体相关： (字体大小)(默认字体) (备用字体)
font: italic bold 20px/35px arial,sans-serif,"微软雅黑"；
(斜体字)(加粗) (行高) (备用字体)
外边距(内边距同理)：
margin: 10px15px 10px 15px;
(上) (右) (下) (左)
margin: 10px15px 15px;
(上) (左右) (下)
margin: 10px15px;
(上下) (左右)
margin: 10px;---(上下左右)
HTML和CSS部分更新完了，接下来更新JS部分了，也夹杂着java的部分知识~
学习html总结（一）
学习html总结（二）
学习html总结（三）
加油！坚持下去就能学到很多东西 学过一点，看着头疼
页:
[1]