随笔分类 -  CSS3

摘要:.box{ width: calc(100% - 96rpx); border-radius: 40rpx; padding: 60rpx 48rpx; box-shadow: inset 0 0 30rpx #d6e8ff; background-image: linear-gradient(15 阅读全文
posted @ 2024-02-20 18:29 MiniDuck 阅读(146) 评论(0) 推荐(0) 编辑
摘要:需要实现的效果 代码实现: .colorbg1{ display:block; width: 400rpx; height:400rpx; border-radius: 100%; box-shadow: 0 0 300rpx #e8fefd; position: absolute; top: 0; 阅读全文
posted @ 2024-02-20 14:31 MiniDuck 阅读(1071) 评论(0) 推荐(0) 编辑
摘要:css的解决办法: * { margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: non 阅读全文
posted @ 2024-01-04 14:23 MiniDuck 阅读(147) 评论(0) 推荐(0) 编辑
摘要:/*video::-webkit-media-controls-fullscreen-button { display: none; //更改是否显示全屏按钮 }*/ /*video::-webkit-media-controls-play-button {display: none;}// 更改是 阅读全文
posted @ 2022-12-28 17:35 MiniDuck 阅读(450) 评论(0) 推荐(0) 编辑
摘要:默认小于4条信息左右两端对齐 超出添加滚动 示例: <view class="padding-style"> <view class='overflow-company-second'> <view class="special-list"> <view class='active'>发现简书</v 阅读全文
posted @ 2022-12-28 17:00 MiniDuck 阅读(1941) 评论(0) 推荐(0) 编辑
摘要:现实: 字母,数字都会存在上述的问题,不会主动换行所以我的需要添加css: word-break:break-all; word-wrap:break-word; so解决: 阅读全文
posted @ 2021-12-20 09:57 MiniDuck 阅读(237) 评论(0) 推荐(0) 编辑
摘要:一:将默认多选框checkbox的默认选中背景红色改为绿色 checkbox .wx-checkbox-input{ border-radius:50%; width:20px;height:20px; } checkbox .wx-checkbox-input.wx-checkbox-input- 阅读全文
posted @ 2021-10-26 14:54 MiniDuck 阅读(2848) 评论(0) 推荐(0) 编辑
摘要:img[src=""],img:not([src]){ opacity:0; } 阅读全文
posted @ 2021-05-17 13:58 MiniDuck 阅读(940) 评论(0) 推荐(0) 编辑
摘要:兼容不同的浏览器:-webkit-, -ms- 或 -moz- 本单元笔记:flex:1 、flex-basis 、flex-direction 、flex-flow 、flex-grow 、flex-wrap 、order 一:flex:1 1.让所有弹性盒模型对象的子元素都有相同的长度,且忽略它 阅读全文
posted @ 2020-10-12 22:43 MiniDuck 阅读(237) 评论(0) 推荐(0) 编辑
摘要:HTML: CSS: JAVASCRIPT: 阅读全文
posted @ 2020-01-08 16:01 MiniDuck 阅读(2178) 评论(0) 推荐(0) 编辑
摘要:早上好,仙女刘,首先恭喜你在2019.06.13号也就是昨天生日快乐!希望你在今后的每一天都是开开心心的,爱你哟,早上起床后的在激动心情下的美美哒 好了,现在进入正题: 在做响应式页面的时候,我经常用到媒体查询。写代码的时候,一个页面我基本一个css就搞定了。但是页面最后的最后,我真心的为我的css 阅读全文
posted @ 2019-06-14 10:34 MiniDuck 阅读(3403) 评论(0) 推荐(0) 编辑
摘要:CSS命名规范(规则)常用的CSS命名规则   头:header   内容:content/container   尾:footer   导航:nav   侧栏:sidebar   栏目:column   页面外围控制整体佈局宽度:wrapper    阅读全文
posted @ 2018-10-23 09:51 MiniDuck 阅读(247) 评论(0) 推荐(0) 编辑
摘要:爱心图片: HTML: 阅读全文
posted @ 2018-10-12 14:37 MiniDuck 阅读(2272) 评论(0) 推荐(0) 编辑
摘要:1.缩进文本:text-indent 2.水平对齐:text-align: left/center/right/justify(实现两端对齐文本效果) 3.字间隔:word-spacing(可以改变(单词)之间的标准间隔。其默认值 normal 与设置值为 0 是一样的。) 4.字母间隔:lette 阅读全文
posted @ 2018-09-25 15:20 MiniDuck 阅读(195) 评论(0) 推荐(0) 编辑
摘要:在活动中,文字的颜色经常采用渐变的效果,在此,做一下笔记 效果图: 注:-webkit-background-clip: text; 务必添加前缀(-webkit-) 阅读全文
posted @ 2018-06-21 11:08 MiniDuck 阅读(151) 评论(0) 推荐(0) 编辑
摘要:这个坑让我郁闷极了,之前我的手机在微信浏览器打开网页点击图片时,啥事也没有 现在,咋回事,变了呢! 现在我打开微信浏览器网页面html,点击一个img标签的图片,图片会自动满屏放大,吓死宝宝了。其他人的手机就咋没有这个问题呢,我的pie手机 这种事情的发生有时候是让我高兴的,但是有时候是悲伤的(若是 阅读全文
posted @ 2018-04-04 11:55 MiniDuck 阅读(8529) 评论(1) 推荐(2) 编辑
摘要:@charset "utf 8"; {margin: 0;padding: 0; webkit tap highlight color: transparent; webkit overflow scrolling: touch;} body, div, ul, li, h1, h2, h3, h4 阅读全文
posted @ 2018-01-06 23:21 MiniDuck 阅读(267) 评论(0) 推荐(0) 编辑
摘要:css滤镜属性,可以在元素呈现之前,为元素的渲染提供一些效果,如模糊、颜色转移之类的。滤镜常用于调整图像、背景、边框的渲染。 语法: webkit-filter: none | blur(px) | brightness() | contrast() | grayscale() | hue-rota 阅读全文
posted @ 2017-11-08 14:02 MiniDuck 阅读(309) 评论(0) 推荐(0) 编辑
摘要:我需要的效果: html: <img src="images/my1.jpg" width="20%"/> css: img{-webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(tra 阅读全文
posted @ 2017-11-02 15:39 MiniDuck 阅读(1330) 评论(0) 推荐(0) 编辑
摘要:摘要 为了保护我们的代码,我们需要想些办法禁止复制。 css: body{ -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-us 阅读全文
posted @ 2017-11-02 11:35 MiniDuck 阅读(4759) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示