HTML+CSS

文本超过两行 显示省略号 场景 文字行数很多 会撑开盒子高度，需要控制在几行内 解决方案： 效果：.

LESS less 可以把px单位转换到rem单位。 Less是一个CSS预处理器, Less文件后缀是.less 扩充了 CSS 语言, 使 CSS 具备一定的逻辑性、计算能力。 less 运算 注

介绍： 使用flexible js配合rem实现在不同宽度的设备中，网页元素尺寸等比缩放效果 flexible.js是手淘开发出的一个用来适配移动端的js库。 核心原理就是根据不同的视口宽度给网页中h

用css做一个三角形 <style> div { width: 0; height: 0; border-top: 20px solid re 实现效果

7、如何实现双飞翼（圣杯）布局？ --- 1、利用定位实现两侧固定中间自适应 ```html``` 2、利用 flex 布局实现两侧固定中间自适应 ```html``` 3、利用 bfc 块级格式化上

盒子模型（Box Modle）可以用来对元素进行布局，包括内边距，边框，外边距，和实际内容这几个部分 盒子模型分为两种: 第一种是W3C标准的盒子模型（标准盒模型） 第二种IE标准的盒子模型（怪异盒模

Flex布局/弹性布局： 是一种浏览器提倡的布局模型 布局网页更简单、灵活 避免浮动脱标的问题 Flex布局模型构成 作用 基于 Flex 精确灵活控制块级盒子的布局方式，避免浮动布局中脱离文档流现象

PC端/移动端不同？ PC端 屏幕大，网页固定版心 端浏览器繁多，更多考虑兼容性问题。（布局： 浮动+定位+标准流） 移动端 手机屏幕小，网页宽度多数为100%，是适配手机屏幕宽度 移动端则基本不需要

perspective 是透视，可以让电脑模拟 3d效果， 实现近大远小的效果。 transform-style 立体呈现 可以让 子元素 里面按照设置位移，旋转，缩放，扭曲等。如果不给父元素这个属性

transition: 属性 花费时间 速度曲线 延时时间; animation: 动画名称 花费时间 速度曲线 延时时间 重复次数 动画方向 执行完毕的状态; 过渡经常配合鼠标经过使用，只能设置起始

动画最大的特点可以不用鼠标触发，自动的，反复的执行某些动画。 动画使用分为定义和调用： 定义： 或者是 调用 动画属性 动画名字参照css类选择器命名 动画时长和延迟时间别忘了带单位 s infina

3D坐标系 3D 坐标系比2D 多了一个Z轴。 3D位移 透视 透视的作用： 空间转换时，为元素添加近大远小、近实远虚的视觉效果 语法: 透视注意事项： 取值范围经常在 800px ~ 1200px

变形可以改变盒子在平面内的形态（位移、旋转、缩放等等） 位移 translate translate可以让盒子沿着x轴或者y轴来移动。 语法： translate和margin的区别 margin移动

实现如上图动态效果 transform: translate(-50%, -50%) rotate(-360deg);

使盒子水平垂直居中的不同办法 定位写死 四测为0 利用transform 使盒子水平垂直居中的不同办法 定位写死 四测为0 利用transform

下载字体图标 具体的步骤： 使用字体图标 引入相关文件 复制相关的文件，到 fonts文件夹里面。 引入 css 使用类名引入字体图标 如果是一个标签来使用字体文件，可以采取2个类名的形式。（开发最常