diff --git a/docs/web/README.md b/docs/web/README.md index cb755eb41af24790d4bd76f085b96d626c1e7fc4..7c1ac8140e7bd134a9926093e43fdd13a0485124 100644 --- a/docs/web/README.md +++ b/docs/web/README.md @@ -103,8 +103,12 @@ console.log(result instanceof Obj) // true ## css +### 默认样式 + 为保证多端统一,uni-app-x编译到web端时,内置组件根元素带有一些默认样式,详情参考:[uvue css使用](../css/README.md)。如果是使用`document.createElement`等方式自行创建的html元素不会有这些默认样式。 +### 样式格式自动转化 + 通过element.style.xxx设置样式时,web端会自动将样式进行转化,具体取决于浏览器。 例如: @@ -114,6 +118,26 @@ element.style.color = '##FF0000' element.style.color === 'rgb(255, 0, 0)' // true ``` +### fixed定位 + +position: fixed定位时,web端为相对于整个浏览器页面进行定位,app端为相对于页面(除导航栏、tabbar)定位。可以使用css变量使两端表现一致 + +```css +.fixed { + position: fixed; + width: 100px; + height: 100px; + background-color: #FF0000; + left: 10px; + /* #ifdef WEB */ + top: calc(--window-top + 10px); + /* #endif */ + /* #ifdef APP */ + top: 10px; /* App端暂不支持calc */ + /* #endif */ +} +``` + ## 运行与发行 运行到web端时,uni-app-x编译器不会对语法进行转化来兼容低版本浏览器。发行时会对代码进行转化,以保证低版本浏览器能正常运行。