css
鱼与雨于语
记录
展开
-
iPhone 伪类溢出父元素圆角范围
iPhone 手机在写伪类上增加动效时,溢出了父元素圆角,需在父元素添加样式。原创 2023-03-15 09:46:58 · 75 阅读 · 0 评论 -
css取消双击选中文字
body {-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none; }原创 2021-05-25 15:39:15 · 66 阅读 · 0 评论 -
CSS 图片 在线拼合生成器(雪碧图)
页面中小图标太多,请求次数太多,整合到一个大图片中。CSS 图片拼合生成器http://cn.spritegen.website-performance.org/原创 2020-09-03 14:51:19 · 3312 阅读 · 0 评论 -
移动端 字体大小设置 适配
html { font-size: 20px; font-size: 5.33334vw; }@media screen and (max-width:320px){ html { font-size: 17.06667px; }}@media screen and (min-width:750px){ html { font-size: 40px; }}body { max-width: 750px; margin: a.原创 2020-06-22 17:51:58 · 1092 阅读 · 0 评论 -
华为p30自带浏览器 样式表命名为skin.css 里面的color样式不起作用
样式表命名为skin.css华为自带浏览器 里面的color 样式不起作用,所以不能用skin.css原创 2020-06-22 17:06:45 · 314 阅读 · 0 评论 -
使用RGBA实现背景颜色半透明并兼容低版本IE浏览器
示例: background: rgba(0,0,0,.5); filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=#7F000000,endcolorstr=#7F000000);IE渐变滤镜:filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr= #AARRGGBB,endColorStr= #AARRGGBB,grad...原创 2020-05-30 14:56:45 · 699 阅读 · 0 评论 -
css 样式 单行、多行文本溢出 显示省略号 方法
单行省略号:overflow: hidden; text-overflow:ellipsis; white-space: nowrap;多行省略号:display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;注:-webkit-line-clamp 用来限制在一个块元素显示的文本的行数。...原创 2020-05-30 13:51:08 · 177 阅读 · 0 评论 -
利用伪类 编写 纯css 飘带效果
<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">原创 2018-11-27 14:27:31 · 1013 阅读 · 0 评论 -
网站 灰色调
如何让实现整站变灰色调 (一般用于悼念活动)html{filter: grayscale(100%);filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); -webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);}那么问题来了,IE 10...原创 2020-04-03 17:43:35 · 451 阅读 · 0 评论 -
h5适配iphoneX
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">/* @supports 检测是否支持指定的CSS属性 (实验中的功能) 判断iphoneX 将 footerBox 的 padding-bottom 填充到最底部 ht...原创 2020-03-31 10:44:55 · 156 阅读 · 0 评论 -
flex 布局 详细总结(弹性布局)
Flex 是 Flexible Box 的缩写,意为"弹性布局"任何一个容器都可以指定为 Flex 布局块元素: display: flex; 行内元素: display: inline-flex; 如果是webkit内核浏览器,需加上-webkit- : display: -webkit-flex兼容:Chrome 21+ 、 Opera 12.1+ 、Firefox ...原创 2019-07-29 15:18:14 · 146 阅读 · 0 评论