随笔分类 -  css3

网页动画效果 css3实现
摘要：CSS3小例子。这次由于时间有限，就做了几个相对比较简单的例子。我们一起来看一下。 第一种效果： 由于录制gif图片会掉帧，所以看起来不流畅，很卡，但其实实际效果还是不错的，有弹性一些。html代码： <span class="shake">弹</span> CSS代码: .shake{ width 阅读全文
posted @ 2021-01-28 15:26 轻舟经年 阅读(167) 评论(0) 推荐(0)
SVG-波浪动画效果实现
摘要：波浪动画效果 html代码里加入： <svg class="editorial" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 28" preserveA 阅读全文
posted @ 2020-12-16 11:12 轻舟经年 阅读(449) 评论(0) 推荐(0)
使用css3在网页中实现各种三角形样式集合（原理解析）
摘要：大家在浏览web网页的时候经常看到有各种各样的图形，比如圆形，正方形，长方形，三角形等，今天特意做了一个关于用CSS实现三角形的教程，那css三角形怎么写呢？css实现三角形的原理是什么？ 我们知道有一个特效是span下拉列表，也就是说当鼠标放上一个div时，会出现原本隐藏的内容或者二级菜单，这样一 阅读全文
posted @ 2020-07-16 15:23 轻舟经年 阅读(1502) 评论(0) 推荐(0)
css技巧和经验列表
摘要：如何清除图片下方出现几像素的空白间隙？ 方法1： img{display:block;} 方法1： 方法2： img{vertical-align:top;} 除了top值，还可以设置为text-top | middle | bottom | text-bottom，甚至特定的<length>和<p 阅读全文
posted @ 2017-12-04 17:19 轻舟经年 阅读(206) 评论(1) 推荐(0)
CSS3嵌入字体@font-face调用字体
摘要：@font-face可以实现从服务器端加载字体，所有浏览器中使用的字体就可以不受本地字体的限制。@font-face真的不是什么新鲜玩意，早在2001年时就被提出来，只不过近两年才被各浏览器广泛支持。而且各浏览器支持的字体文件格式也可能不同，一般来说如下四种格式可覆盖所有浏览器。 eot：该格式仅在 阅读全文
posted @ 2017-12-04 10:41 轻舟经年 阅读(12683) 评论(0) 推荐(0)