今天无意中在网上发现尤文牛人用纯CSS3写出来的火车头,在这里FORK一下,供学习之用 * { margin:0px; padding:0px; list-style:none;}body { background-color:#eee; text-align:center;}a { color:……继续阅读 » 6年前 (2017-01-23) 675浏览 0评论
利用纯css3实现花格纹理背景,纯css3实现花格纹理背景是一款无需任何图片和js脚本即可以实现形式多样的花纹背景,包含横向和竖向栅格背景、马赛克背景等等,还可以自己扩展,非常棒的效果。效果:CSS样式部分 body { font-family: Georgia, serif; } .stripes { heig……继续阅读 » 7年前 (2016-05-13) 1075浏览 0评论
效果代码.join { position: absolute; display: block; text-align: center; line-height: 40px; width: 148px; height: 40px; color: #fff5d1; border-radius: 20px; border:……继续阅读 » 7年前 (2016-05-10) 1607浏览 0评论
特效说明:这是一款CSS3网页加载后图片翻转效果代码,基于CSS3属性transform编写简单动画,随简单,但是效果很好的图片翻转效果。请用支持HTML5+CSS3主流浏览器预览效果。(兼容测试:FireFox、Chrome、Safari、Opera等支持HTML5/CSS3浏览器)使用方法:调用CSS样式:<link rel="sty……继续阅读 » 7年前 (2016-04-11) 1005浏览 0评论
看效果:<!DOCTYPE html><html><head><meta charset="gbk2312"><title>动画动感按钮</title><style>body {background: #000;}.center-w……继续阅读 » 8年前 (2015-09-01) 1262浏览 0评论
先看效果:html部分代码:<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script><div class="progressbar" data-perc="100">……继续阅读 » 8年前 (2015-08-21) 1115浏览 0评论
直接上代码:<!DOCTYPE html><html><head><meta charset=utf-8 /><title>CSS 实现元素背景渐变</title><style>.demo {width:100%;height:200px;……继续阅读 » 8年前 (2015-08-19) 971浏览 0评论
想想当初有多人为了这个事情而忙得不可开交,要把所有的图片在photoshop里去色,再到样式表中把所有的颜色值改成灰色,最后等过了时间之后又要恢复原状。其中也有一些网站仅仅是在IE浏览器中用了滤镜来解决,并没有去处理其他浏览器的。html{filter:progid:DXImageTransform.Microsoft.BasicImage(graysca……继续阅读 » 8年前 (2015-06-13) 1125浏览 0评论
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="en">&l……继续阅读 » 8年前 (2015-05-08) 1014浏览 0评论
::after是一个CSS伪元素,使用::after,你可以从CSS里往页面上新增内容(不再要在HTML里有相应的东西)。虽然最终生成的东西并不是真正的DOM里的内容,但这些内容能像普通内容一样显示,基本的效果是这样的:CSS代码div::after {content: "你好";}/HTML代码</pre><div……继续阅读 » 8年前 (2015-05-04) 969浏览 0评论