随笔分类 -  css

纯CSS实现多选组件
摘要：mark:http://blog.meathill.com/tech/fe/create-multiple-select-component-with-pure-css.htmlDemo: 小宝3225 王老白白白 空夫31 谷大白话 Meathill 一毛不拔大师Code: Doc... 阅读全文
posted @ 2014-04-19 14:40 yedeying 阅读(1336) 评论(0) 推荐(0)
zoom 用法
摘要：from:http://www.jb51.net/css/40285.html其实Zoom属性是IE浏览器的专有属性，Firefox等浏览器不支持。它可以设置或检索对象的缩放比例。除此之外，它还有其他一些小作用，比如触发ie的hasLayout属性，清除浮动、清除margin的重叠等。Zoom的使用... 阅读全文
posted @ 2014-04-19 14:09 yedeying 阅读(428) 评论(0) 推荐(0)
css helper class
摘要：应该习惯的css helper class.text-centeredtext-align: center;.text-righttext-align: right;.smallsmall font size from variables.less.lastmargin-right: 0;.pausemargin-bottom: baseline/2;.endmargin-bottom: 0;.normalfont-weight: normal;.boldfont-weight: bold;.italicfont-style: italic;.groupclearfix layer.right 阅读全文
posted @ 2014-04-09 14:08 yedeying 阅读(349) 评论(0) 推荐(0)
自设chrome默认滚动条样式
摘要：今天无聊，想着chrome这种全面使用html的浏览器，可不可以让我自行改变它的默认CSS呢，结果去查查，有，很好win7/8目录为C:\Users\[你的用户名]\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets在这个目录下找到Custom.css打开修改即可立马套上了之前做的一个滚动条样式，代码如下:::-webkit-scrollbar { width: 8px; height: 8px;}::-webkit-scrollbar-track { border-radius: 10px; b... 阅读全文
posted @ 2014-04-03 21:19 yedeying 阅读(785) 评论(0) 推荐(0)
本博客css style
摘要：#navList { min-height: 60px;}#navList li { height: 60px;}#navList a { margin: 0px 5px !important; padding: 19px 10px !important; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; -ms-transition: background 0.5s; -o-transition: background 0.5s; transiti... 阅读全文
posted @ 2014-03-28 15:11 yedeying 阅读(159) 评论(0) 推荐(0)
css缩写
摘要：CSS缩写属性：margin padding口决：上右下左1、CSS 文本： font-size:12px;font-weight:bold;font-family:Arial, Helvetica, sans-serif;line-height:22px; 缩写为font:12px/22px bold Arial, Helvetica, sans-serif;2、CSS 背景： background-color:#F00;background-image:url(图片地址);background-position:bottom;background-repeat:no-repeat;　... 阅读全文
posted @ 2014-03-26 09:24 yedeying 阅读(828) 评论(0) 推荐(0)
position
摘要：今天重新看了下绝对定位，总算明白那个绝对居中的原理了。绝对定位是对它关系最近的一个有定位属性的父元素进行定位，参数先看left top，再看right bottom。绝对居中布局是指(对其关系最近的一个有定位属性的父元素进行居中).div{ position: absolute; margin: auto; left: 0; right: 0; top: 0; bottom: 0}margin: auto起到的作用是将div相对其父元素延伸出左右上下相等的外补丁从而实现居中 Document Demo如下:... 阅读全文
posted @ 2014-03-26 00:03 yedeying 阅读(151) 评论(0) 推荐(0)
发光输入框
摘要：CSS3 transition 以及 box-shadow实现，要注意的是outline:none;代码： Document Demo:顺便地，把这个样式应用到了下面的评论框中，博客园可以自己提交css，这个特爽 阅读全文
posted @ 2014-03-23 15:43 yedeying 阅读(175) 评论(0) 推荐(0)
CSS3 学习
摘要：border-radius: 半径，不用学了，用得很熟了，但要记得它的某一个角的写法是border-top/bottom-left/right-radius: ，参数中的两个值为先左右后上下，支持百分号box-shadow: div加阴影，语法为box-shadow: h-shadow v-shadow blur spread color inset;text-shadow: 文字阴影，类似box-shadowword-wrap: 只有break-word or normal@font-face: 安全字体transform: 2D变换，要加前缀，平移是相对的，还可以旋转拉伸各种，... 阅读全文
posted @ 2014-03-23 10:43 yedeying 阅读(154) 评论(0) 推荐(0)
Emmet Documentation
摘要：src:http://docs.emmet.io/cheat-sheet/Emmet DocumentationSyntaxChild: >nav>ul>li Sibling: +div+p+bq Climb-up: ^div+div>p>span+em^bq div+div>p>span+em^^bq Grouping: ()div>(header>ul>li*2>a)+footer>p (div>dl>(dt+dd)*3)+footer>p Multiplication: *ul>li*5 It 阅读全文
posted @ 2014-03-23 09:46 yedeying 阅读(312) 评论(0) 推荐(0)
字体候选
摘要：body{font-family:"Microsoft YaHei",Arial,Helvetica,sans-serif,"宋体";} 阅读全文
posted @ 2014-03-22 16:43 yedeying 阅读(137) 评论(0) 推荐(0)
[转]绝对定位居中
摘要：原文：http://coding.smashingmagazine.com/2013/08/09/absolute-horizontal-vertical-centering-css/Ⅰ.绝对定位居中(Absolute Centering)技术我们经常用margin:0 auto来实现水平居中，而一直认为margin:auto不能实现垂直居中……实际上，实现垂直居中仅需要声明元素高度和下面的CSS:[css]view plaincopy.Absolute-Center{margin:auto;position:absolute;top:0;left:0;bottom:0;right:0;}我不 阅读全文
posted @ 2014-03-21 23:14 yedeying 阅读(577) 评论(0) 推荐(0)