鼠标手势、animate.css、引入外部字体、怪异盒模型、文字阴影

cursor 鼠标手势

鼠标在页面或者元素上的样式
值
crosshair 用于精确定位的 十字形
pointer 鼠标显示小手
move 拖拽效果时候的鼠标移动样式
text 鼠标悬浮在文本的样式
wait 鼠标等待加载时候的样式
help 鼠标显示带问号的箭头
not-allowed 禁用效果
default 默认指针样式
auto 鼠标按照默认的状态根据页面上的内容自行修改样式

animate.css

使用 animate.css
1.直接在元素上使用，需要添加 公共类 animate__animated,然后根据效果添加
需要使用 动画类名，注意以 animate__ 为前缀
animate__动画名
2. 使用 animate.css 的动画名
不用特意添加类名，可以直接在css中声明 animation 属性，然后他的动画名是 animate.css
中的动画名即可

引入外部字体

引入外部字体
字体格式
1. ttf: 专门用于标准浏览器和 Android等(最常用)
2. svg： 支持ios
3. eot： 仅支持IE浏览器
4. woff：支持火狐和谷歌

    使用步骤
    1.将字体引入到项目中
    2.声明引入的字体中
    3.在设置css字体的时候，使用声明的字体族

    声明字体族的方式
    @font-face{
        font-family:'自定义的字体族名字'
        src:url('字体资源地址')
    }

引入iconfont字体

	1.下载图标，并且 引入 iconfont.css
    2. 在使用的标签上引入 类名 iconfont 
    3. 引入需要的图标类

div的属性设置
contenteditable=“true” 设置div的内容可以编辑

怪异盒模型

outline 轮廓线 他的使用方式和 border一样
轮廓不占据文档流空间

    怪异盒模型
    box-sizing: 
                值
                border-box：border 和 padding 统一计入到 width之内，也就是
                宽度包含了 border 和 padding的值
                content-box: 默认值，只有内容被计入到width 之内
                padding-box：火狐支持，padding计入到width 之内
            由于 padding-box 存在兼容性问题，因此常用的怪异模式是border-box

                标准盒模型
                    宽度 = border的宽度 + padding 宽度 + 内容宽度 

                怪异盒模型
                    宽度 = 设置的width(包含了border的宽度 + padding 宽度 + 内容宽度 )

文字阴影

设置文字阴影
text-shadow: x轴偏移 y轴偏移 模糊度 阴影颜色

    如果需要设置多个阴影，就使用英文逗号隔开

    单个阴影
    text-shadow：0 0 10px #f60;

    多个阴影
    text-shadow: 0 0 10px #f60,0 0 10px #f60,0 0
    10px #f60;