css3
泥猴桃
web前端开发
展开
-
css 控制文字间距
css letter-spacing 属性可以控制文字之间的间距,或紧凑或稀疏<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style type="text/css"> h1 {letter-spacing: -5px}原创 2016-11-07 22:21:58 · 757 阅读 · 0 评论 -
css代码编写空心箭头
突然发现现在这种空心箭头特别流行 ,也许很早以前就流行了,最近才注意到,汗啊,研究了一下结合网上的资料稍微整理了下! 效果如图: 代码如下:<!-- css --><style> #talkbubble { width: 120px; height: 80px; position: relative; -moz-border-radius: 10px;原创 2016-12-06 17:29:04 · 695 阅读 · 0 评论 -
使用CSS将图片转换成黑白(灰色、置灰)
可能早就知道,像汶川这种糟糕的日子网站全灰在IE下是可以轻松实现的(filter: gray;),不过,当时,其他浏览器是无解的。不过,时代发展,如今,CSS3的逐步推进,我们也开始看到“黑白效果”大规模应用于实际的可能。图片效果如下代码如下,兼容IE浏览器<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <原创 2017-08-21 22:01:17 · 1056 阅读 · 0 评论 -
ios下button input checkbox radio 默认样式去除
开发移动端的时候ios 下 button input checkbox radio 会有默认样式,很丑的那种背景色不能去除,通过给元素添加如下样式可以去除-webkit-appearance: none;原创 2017-10-09 22:40:39 · 2974 阅读 · 0 评论 -
h5 场景动画效果相关插件 aos.js 和 swiper.animate.js
最近项目要做几个相关的h5 场景动画的小页面,移动端PC端都有,虽然纯手打也不是很难,但是项目要上线,所以时间卡的很紧,又要效果,又不能耽误工期,没办法这时候在网上搜了下相关的插件,找到了两个比较好的,都用了下,上手简单,效果丰富,所以在这里记录下,以后肯定还会用到! 1. swiper.animate.js 这个插件很不错,网上相关的API 也很多,这款插件和 swiper 结合很适合做整平翻原创 2017-11-23 00:03:57 · 3256 阅读 · 0 评论 -
css3 媒介查询 适配移动端
这种适配方案,适合于640 的设计稿,刚好1rem = 100px,使用起来比较简单,真是px尺寸前进两位小数点就是对应的rem 值,使用方便;@media screen and (min-width: 320px) { html { font-size: 50px; }}@media screen and (min-width: 360px) { html { font-si...原创 2018-12-16 15:01:21 · 308 阅读 · 0 评论 -
css3实现高度从固定到高度自适应的过渡动画
去年做过一个这样的动画效果,然后今年又做了一次,今年做的时候突然发现想不起来了,抠鼻尴尬百度了下找到了方法,在此记录下!效果图如下代码如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" conten...原创 2019-06-13 00:09:49 · 17372 阅读 · 1 评论