随笔分类 -  CSS3

C3的新特效
小程序的image图片显示
摘要：最近接触到了一点小程序的东西，跟我们平常的HTML还真不太一样，这里我先大概讲一下图片的显示问题， 小程序的图片用的是<image><image/>标签，他默认的大小是宽300px，高225px。那我们如果用图片的话，肯定不能用默认的大小，那image常用的除了src属性之外，还有一个mode属性， 阅读全文
posted @ 2018-03-07 11:41 额爷 阅读(35251) 评论(0) 推荐(0)
div的文字倾斜
摘要：最近要写一个页面，需要一排文字是倾斜的，我就写了一下 效果图： 好啦，可以实现了，不过就是要加上那些兼容的前缀。 阅读全文
posted @ 2018-01-09 14:27 额爷 阅读(1019) 评论(0) 推荐(0)
PC端无论页面有没有完全撑开把footer保持在最底部（不用定位）
摘要：最近在写项目，有的页面没有占到一屏，然后footer也就是底部就靠上了，这样很影响美观，于是在网上找了找，下面是我的成果 解决该问题的最好方法是采用CSS3提供的一种先进布局模型 ：flexbox，可以建立具有适应性的布局。 下面我们代码走起来 我们利用flex-deraction：column将页 阅读全文
posted @ 2017-12-28 16:08 额爷 阅读(1098) 评论(0) 推荐(0)
把图片画到画布上，适应PC和移动端
摘要：画一张图片到画布上 如果要把几张不同的图片放画到画布上，有几张图片就需要声明几次对象，获取几次路径，在画布上画几次。 下面是我在画布上画来 6张图片， 效果图： 现在呢，我要让画布画的图片能在pc和移动端都能适应，那么，我就要对这些代码进行再加工，我现在只要改 把图片画到画布上的代码 resize（ 阅读全文
posted @ 2017-12-22 10:59 额爷 阅读(688) 评论(0) 推荐(0)
实现字体外部有描边
摘要：公司做的游戏页面，房间号要有描边。然后我就开始尝试，写了两种办法： 第一种：CSS实现 text-stroke实现字体的描边颜色和宽度，-webkit-text-fill-color实现字体的颜色，和css的color一样 需要注意的是：目前这两个属性只有webkit内核的Safari和Chrome 阅读全文
posted @ 2017-12-21 18:48 额爷 阅读(4478) 评论(0) 推荐(0)
给字体和元素加阴影text-shadow和box-shadow
摘要：1、语法： 对象选择器 {text-shadow:X轴偏移量 Y轴偏移量 阴影模糊半径 阴影颜色} 注：text-shadow可以使用一个或多个投影，如果使用多个投影时必须需要用逗号“,”分开。 2、取值： box-shadow属性最多可以有6个参数设置，他们分别取值： (1) 阴影水平偏移量 ：是 阅读全文
posted @ 2017-11-29 17:50 额爷 阅读(2565) 评论(0) 推荐(0)
css3 clac()方法
摘要：calc()从字面上可以把它理解成为一个函数function，英文单词是calculate（计算），是CSS3的一个新功能，用来显示元素的长度。 他的用途就是，如果你有一个元素，加了padding或者border就超出了原来预想的效果，或者把元素盒子撑破，这时我们就可以用calc()了, 注意： 1 阅读全文
posted @ 2017-11-29 17:10 额爷 阅读(613) 评论(0) 推荐(0)
CSS3动画@keyframes图片变大变小颜色变化
摘要：在我做公司官网的时候也会帮着写一些游戏的静态页，今天产品要求为了突出一个按钮，他要有颜色的变化而且要变大变小，然后我就在网上搜了下呼吸灯和其他的案例，写了个小damo，看着还有些魔性嘞。 html： 原理是这样的：body相对定位，.change绝对定位到.color上面，大小和.color一样，第 阅读全文
posted @ 2017-11-23 17:23 额爷 阅读(7352) 评论(0) 推荐(0)