标签 CSS 下的文章

div+css按比例布局:宽度为百分比高度自动等比正方形的实现方式

第一种方案 效果 css文件 body { width: 100%; font-size: 0; text-align: center; } div { display: inline-block; width: 20%; background: green; font-size: 12px; position: relative; vertical...

memory   2017-05-15  暂无评论

纯 CSS 创建各种不同的图形形状

矩形 .rectangle { width: 250px; height: 150px; background-color: #6DC75F; } <div class="rectangle"></div> 三角形 .triangleUp { border-left: 75px solid tran...

memory   2015-11-16  暂无评论

新手入门响应式布局--响应式布局的那些事儿

讲到响应式布局,相信大家都有一定的了解,响应式布局是今年很流行的一个设计理念,随着移动互联网的盛行,为解决如今各式各样的浏览器分辨率以及不同移动设备的显示效 果,设计师提出了响应式布局的设计方案。今天就和大家来讲讲响应式布局这件小事,包含什么是响应式布局、响应式布局的优点和缺点以及响应式布局该怎么设计(通过CSS3 Media Query实现响应布局)。一、什么是响应式布局? 响应式布局是...

memory   2013-05-29  暂无评论

根据链接的内容不同,定制不同的CSS样式 CSS之特殊用法

CSS还可以这样用、你知道吗?利用CSS给链接添加一个ICO图标a[href$='.zip'], a[href$='.rar'], a[href$='.gzip']{background:transparenturl(images/zip.png)center right no-repeat;display:inline-block;padding-right:35px;...

memory   2013-05-18  暂无评论

又地震了.一个前端代码。通过CSS让整个网页变黑白

html{ filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: url("data:image/svg+xml;ut...

memory   2013-04-21  暂无评论

textarea标签中resize缩放属性的设置

CSS3中新增了resize缩放属性,这个属性可以应用到任意元素。目前只有Webkit内核的浏览器才支持这个css3属性,即Google chrome和Apple safari都支持。而textarea标签中,Webkit内核的浏览器会默认resize的值为both,即用户可以调节元素的宽度和高度。如下图就是在Google chrome中我博客的textarea...

memory   2013-04-12  暂无评论

CSS兼容性技巧整理--从IE6-IE9 火狐谷歌浏览器兼容

 CSS兼容性技巧整理--从IE6-IE9 火狐谷歌浏览器兼容本文收集整理了IE7,6与Fireofx的CSS兼容性处理技巧,供大家参考。CSS兼容常用技巧请尽量用xhtml格式写代码,而且DOCTYPE影响 CSS 处理,作为W3C标准,一定要加DOCTYPE声明。1.div的垂直居中问题vertical-align:middle; 将行距...

memory   2013-04-12  暂无评论