css
层叠样式表css,是前端开发人员必会的三大技能之一。是ui层面的主要表现形式。
莫成尘
不必记住我的名字,但别忘记我的故事。uview团队欢迎你的加入。
展开
-
自定义滚动条@莫成尘
先看代码,复制使用即可,以下代码均可复制粘贴使用(我将以注释的形式解释代码左右,您将看到以下效果)。原生的滚动条比较方正,不够圆滑,很大程度上不能满足我们的审美,有时候需要修改其样式。<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&原创 2021-02-24 12:01:06 · 219 阅读 · 0 评论 -
css实现三角形(上下左右)@莫成尘
先看代码,复制使用即可,以下代码均可复制粘贴使用(我将以注释的形式解释代码左右,您将看到以下效果)。如您满意请给莫成尘点个Fabulous<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equ原创 2020-12-10 11:54:15 · 737 阅读 · 0 评论 -
CSS使网页适应不同屏幕大小(最实用的rem基础屏幕的适配方案)
先看代码,复制使用即可,以下代码均可复制粘贴使用(我将以注释的形式解释代码左右)。如您满意请给莫成尘点个Fabulous牛顿说过:我之所以看得远,是因为我站在巨人的肩膀上,我们充分借鉴了element,antd等的方案来适配。需要注意的是使用了这个方案,您最好使用rem作为单位来设置css,\color{#FF0000}{需要注意的是使用了这个方案,您最好使用rem作为单位来设置css,}需要注意的是使用了这个方案,您最好使用rem作为单位来设置css,如果觉得自己计算比较麻烦,可以使用您的编译器设置原创 2020-12-10 11:40:00 · 4073 阅读 · 2 评论 -
前端css文字单行和两行超出变为省略号解决方案@莫成尘
先看代码,复制使用即可,css样式在本身提供的特别多的能力,但我仍以为很多前端开发者并不精深于研究css,这里提供一个超出隐藏的demo,让您可以很轻松应对。(您将看到以下效果)两行省略word-break: break-all;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;line-height: 50px;/原创 2020-09-29 17:26:04 · 1374 阅读 · 3 评论 -
border-radius进阶使用,画瓜子,眼镜片,水滴等@莫成尘
先看代码,复制使用即可,css样式在本身提供的特别多的能力,但我仍以为很多前端开发者并不精深于研究css,这里提供一个背景样式,让您可以很轻松应对复杂的UI界面。(您将看到以下效果)如您满意请给莫成尘点个Fabulous以下是代码片段,一个完整的html文件,您可以直接复制,对于其他您想要设置的样式,这里提供了在线网站 网站链接.可以供您做其他参考,使用方式如下图<!DOCTYPE html><html> <head> <meta charset=原创 2020-09-29 11:09:52 · 696 阅读 · 0 评论