随笔分类 -  css

上一页 1 2
css 设置 transform 无效
摘要：可被transform的元素有：block-level element 或 atomic inline-level element等，但不包括inline element. 例如： <div class="box"> <span>今天你吃了么？</span> </div> // css span { 阅读全文
posted @ 2020-08-04 11:01 vickylinj 阅读(2888) 评论(0) 推荐(0)
CSS 子绝(position：absolute;)父相(position：relative)
摘要：首先你必须知道的是：top、right、bottom、left这四个属性要生效的话,必须得设置相对定位/绝对定位，即position：relative;或者position：absolute;，也就是说top、right、bottom、left是为相对定位/绝对定位而生的。 子绝父相就是：子元素为绝 阅读全文
posted @ 2020-07-24 20:49 vickylinj 阅读(9830) 评论(0) 推荐(2)
【移动端】移动端点击可点击元素时，出现蓝色默认背景色
摘要：web页面放在移动端，点击button 标签或者添加了cursor:pointer 样式的标签，会出现 蓝色背景色， 解决方案： 给相应标签 或者直接在body 标签上添加 样式： -webkit-tap-highlight-color: transparent; 或者 -webkit-tap-hi 阅读全文
posted @ 2020-07-16 14:52 vickylinj 阅读(2464) 评论(0) 推荐(1)
CSS3 background-size 属性
摘要：示例： <!DOCTYPE html> <html> <head> <style> body { background:url(/i/bg_flower.gif); background-size:63px 100px; -moz-background-size:63px 100px; /* 老版本 阅读全文
posted @ 2020-06-18 11:27 vickylinj 阅读(175) 评论(0) 推荐(0)
iconfont字体生成原理及使用技巧
摘要：转自：https://www.dazhuanlan.com/2019/10/17/5da8546b505cf/ 一、css加载自定义字体 首先前端都知道我们可以定义web上面文字的fontfamily。 css: .test{ font-size: 16px; font-family: '微软雅黑' 阅读全文
posted @ 2020-03-12 18:10 vickylinj 阅读(2525) 评论(0) 推荐(1)
如何让Iconfont作用到content伪类中
摘要：1.先参照https://www.cnblogs.com/vickylinj/p/12030413.html引入iconfont字体图标。 比如&#xe710; 其中&#是开头用以标明这是字符实体，x表示这是十六进制，而CSS的content接受的也是16进制的Unicode编码。 2.将iconf 阅读全文
posted @ 2020-03-10 15:01 vickylinj 阅读(1443) 评论(0) 推荐(0)
HTML CSS 特殊字符表
摘要：HTML有许多特殊的字符，您对此有多少了解？平时在WEB制作中，您又有用到多少？或者说你在平时使用之时，是否也会碰到，有许多特殊字符要如何打印出来？比如说“笑脸”，比如说“版权号”。要是你用时忘记了这些特殊字符，不要紧，请记住今天这个地址，你就随时可以查到这些特殊字符的表示方法。 简单的介绍一下其使 阅读全文
posted @ 2020-03-09 16:25 vickylinj 阅读(332) 评论(0) 推荐(0)
CSS-界面滚动时不显示滚动条
摘要：设置滚动条的样式： div::-webkit-scrollbar { width: 0; } 关于::-webkit-scrollbar ::-webkit-scrollbar CSS伪类选择器影响了一个元素的滚动条的样式 ::-webkit-scrollbar 仅仅在支持WebKit的浏览器 (例 阅读全文
posted @ 2020-02-26 18:12 vickylinj 阅读(14899) 评论(0) 推荐(0)
Vue Loader 作用域CSS（scoped）——/deep/ 深入组件选择器
摘要：用过vue组件的前端同学应该都遇到过一个问题，就是在当前页的组件有自定义样式，而用了scoped编译出的样式对组件内部并不起作用，最后要写全局样式才能有效，但是可能会污染到其他组件，其实我们可以用/deep/来解决此问题。 关于scoped请查看：https://www.cnblogs.com/vi 阅读全文
posted @ 2020-02-26 17:58 vickylinj 阅读(503) 评论(0) 推荐(0)
css3中 百分比宽度减去固定宽度的写法
摘要：div{ /*实现了宽度为父容器宽度减去固定的300像素*/ width:-webkit-calc(100% - 300px); width:-moz-calc(100% - 300px); width:calc(100% - 300px); } 阅读全文
posted @ 2020-02-26 17:28 vickylinj 阅读(434) 评论(0) 推荐(0)
不遮挡人物弹幕是怎么实现的——图片蒙版效果-webkit-mask
摘要：这是一个实验中的功能，用于设置元素上遮罩层的图像。 一、Values none：默认值，透明的黑色图像层，也就是没有遮罩层。 <mask-source>：<mask>或CSS图像的url<image>图片作为遮罩层 二、语法： .demo1 { background : url("images/lo 阅读全文
posted @ 2019-12-23 16:49 vickylinj 阅读(2755) 评论(0) 推荐(0)
iconfont的使用
摘要：Iconfont 是采用字体的方式来做图标，它不但可以提高网页性能也能适用在 iOS 和 Android App 平台。再加上现在扁平化设计席卷互联网，它变得越来越流行。它的原理就是将很多 icon 做成字体库，通过样式或者字体对应的字符集来显示这个 icon。 Iconfont 的优点 减少请求次 阅读全文
posted @ 2019-12-12 17:16 vickylinj 阅读(1103) 评论(0) 推荐(0)
CSS3 @font-face 规则
摘要：指定名为"myFirstFont"的字体，并指定在哪里可以找到它的URL： @font-face { font-family: myFirstFont; src: url('Sansation_Light.ttf'), url('Sansation_Light.eot'); /* IE9 */ } 阅读全文
posted @ 2019-12-12 15:44 vickylinj 阅读(290) 评论(0) 推荐(0)
CSS抗锯齿 font-smoothing 属性介绍
摘要：这个属性可以使页面上的字体抗锯齿,使用后字体看起来会更清晰舒服。 1.windows: 属性：-webkit-font-smoothing 示例： body{ -webkit-font-smoothing: antialiased; } 它有三个属性： none 对低像素的文本比较好 subpixe 阅读全文
posted @ 2019-12-12 15:01 vickylinj 阅读(772) 评论(0) 推荐(0)

上一页 1 2