案例 鼠标划入特效

项目维护
四个文件 css js images html
div
id 仅能出现一次
class 起名字
style 只能用于当前标签
每个浏览器解析标签的不同
css magrin 外边距 为零
margin-bottom
复合样式
单一样式

学会布局
整体入手
局部分析
调整位置
添加样式
box-sodwon
阴影 x 偏移量 y 偏移量 阴影羽化值 阴影颜色

命令规则
1.见名只意 小写英文
2.不能以数字开头
3.以下划线来分割,适当缩写

border 10px solid(实线) #fff
默认流式布局

为什么不用浮动?
1.霸道 破坏盒子模型
2.破坏性
3。兼容性问题
4.包裹性

display: inline-block
1.能够使用文本样式
把换行解析成空格了?怎么解决
结束和开始不闭合


screenshot.png

常用的方法
letter-space 文字间距 -5px???
word-space -5px
让空格不解析
font-size

透明值
background: rgba(255,255,255,255.7)

css3变幻
写动画用css3实现,就不用js实现
tranform:translate位移 scale硕放 rotate旋转
translates x轴 y轴
overflow hidden 超出隐藏

hover 动态伪类选择器
改变元素的样式
transition 过度时间 transition: 0.3s;
鼠标划入改变样式

抖动效果
@keyframes

animation:move 0.9s;
@keyframes move {
0%(是0.9s的0%){
transform:translateY(-404px);
}
40%{
transform:tranlateY(-)
}
}

企业标准
模块化 组件化 插件化 可拔插化
模块化
降低耦合度

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    wzhiq896阅读 1,830评论 0 2
  • 1、属性选择器:id选择器 # 通过id 来选择类名选择器 . 通过类名来选择属性选择器 ...
    Yuann阅读 1,680评论 0 7
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    love2013阅读 2,355评论 0 11
  • 特别,大部分时间是个中性词,没有好或不好。在某些的场合,特别是一种暧昧的肯定。但对于张笑微来说,特别是一个贬义词,...
    菁菁年华的阿菁阅读 471评论 3 4
  • 初到简书,还在适应磨合期,定期分析数据十分必要。从7月8日至7月20日,共发文9篇,后7天算是实现日更。共写178...
    子肖阅读 362评论 9 15