css常用方式

 常容器用的样式：

position: relative | absolute;  /*相对定位|决定定位*/
display: flex;  /*浮动*/
line-height: 0px;  /*div 撑开问题*/

对 rpx 详细说明：

设计师在提供设计图时，一般只提供一个分辨率的图。

严格按设计图标注的 px 做开发，在不同宽度的手机上界面很容易变形。

而且主要是宽度变形。高度一般因为有滚动条，不容易出问题。由此，引发了较强的动态宽度单位需求。

微信小程序设计了 rpx 解决这个问题。uni-app 在 App 端、H5 端都支持了 rpx，并且可以配置不同屏幕宽度的计算方式，具体参考：rpx 计算配置。

rpx 是相对于基准宽度的单位，可以根据屏幕宽度进行自适应。uni-app 规定屏幕基准宽度 750rpx。

开发者可以通过设计稿基准宽度计算页面元素 rpx 值，设计稿 1px 与框架样式 1rpx 转换公式如下：

设计稿 1px / 设计稿基准宽度 = 框架样式 1rpx / 750rpx

换言之，页面元素宽度在 uni-app 中的宽度计算公式：

750 * 元素在设计稿中的宽度 / 设计稿基准宽度

举例说明：

若设计稿宽度为 750px，元素 A 在设计稿上的宽度为 100px，那么元素 A 在 uni-app 里面的宽度应该设为：750 * 100 / 750，结果为：100rpx。
若设计稿宽度为 640px，元素 A 在设计稿上的宽度为 100px，那么元素 A 在 uni-app 里面的宽度应该设为：750 * 100 / 640，结果为：117rpx。
若设计稿宽度为 375px，元素 B 在设计稿上的宽度为 200px，那么元素 B 在 uni-app 里面的宽度应该设为：750 * 200 / 375，结果为：400rpx。

合作模型：

常用的伪类:

:nth-child() 选择元素（n）。
:nth-of-type() 同种标签指定序号的子元素，.box    1 p:nth-of-type(    3 )  box    1 里第    3 个p元素。
:link没被访问过的状态
:visited已被访问过的状态
:hover鼠标悬停时的状态
:active点击时的状态（鼠标按下还没弹起）
:empty选择空标签。
:focus选择当前获得焦点的表单元素。
:enabled选择当前有效的表单元素。
:disabled选择当前无效的表单元素，添加此属性，将无法选择。
:checked选择当前已经勾选的单选按钮或者复选框。
:root选择根元素，即标签，通过继承性影响文档样式。
:first-letter 向文本的第一个字母添加特殊样式。
:first-line 向文本的首行添加特殊样式。
:before 在元素之前添加内容。
:after 在元素之后添加内容