Fork me on GitHub
魔芋铃
Menu

随笔分类 -  CSS

上一页 1 2
腻子脚本
摘要：腻子脚本（polyfill）指的是一段JavaScript代码，能够赋予浏览器未曾有过的功能。目前，几乎所有CSS3和HTML5功能都有各自对应的腻子脚本，包括视频回放和阴影，从而让那些老得走不动道儿的“老家伙”们也能闪现青春的光芒。PaulIrish维护了一个完整的腻子脚本的列表，地址是：http... 阅读全文
posted @ 2015-10-30 14:21 魔芋铃 阅读(600) 评论(1) 推荐(1)
【03】placeholder
摘要：placeholder表单占位符解决方案Css Code:-moz-placeholder,::-webkit-input-placeholder{ color: #bfbfbf;}.placeholder{ color: #bfbfbf;}【】css修改placeholder的颜色::-webk... 阅读全文
posted @ 2015-10-26 17:46 魔芋铃 阅读(157) 评论(0) 推荐(0)
HTML+CSS 制作HTML5标志图
摘要：效果图如下：（是用代码写的，而不是图片！）网上看到的代码。看了下，就是CSS的transform属性的应用。加上定位等。组合在一起形成图片。没什么难点，就是width,left等数据得根据HTML的标志图计算出来。也就是说，简单的几何图片都可以用代码写了。代码地址百度云盘：http://pan.ba... 阅读全文
posted @ 2015-08-25 15:02 魔芋铃 阅读(724) 评论(0) 推荐(0)
清除浮动1
摘要：/******clear float*******/ .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix {display: inline-ta... 阅读全文
posted @ 2015-07-14 13:33 魔芋铃 阅读(120) 评论(0) 推荐(0)
CSS笔记1
摘要：在div+css开发的时候，特别是新手特别喜欢追求完美，所以开发中或开发完后立即去验证开发的css是否符合w3c标准。虽然说验证w3c是好事但是，这个不是最重要的，最重要的是divcss的兼容浏览器性能、css代码最优程度、特效兼容。CSS扩展与提升1、兼容各版本浏览器也会导致验证失败。在开发div... 阅读全文
posted @ 2015-07-05 20:30 魔芋铃 阅读(108) 评论(0) 推荐(0)
css中文字体乱码解决方案
摘要：css中文字体乱码解决方案css中文字体乱码解决方案：把css编码和html页面编码统一起来。如果html页面是utf-8、css、js也统一成utf-8编码。如果html页面是gb2312、css、js也统一成gb2312编码。还有一个避免中文乱码的办法就是把中文字体写成英文来表示，例如：font... 阅读全文
posted @ 2015-07-05 11:55 魔芋铃 阅读(920) 评论(0) 推荐(0)
font-size的探究
摘要：整理网上的资料font字体，用px，em，100%,rem?分什么情况考虑？我们逐渐意识到，我们用px作为文字大小的单位，已经出现很多问题。最主要是体现在用户不能灵活的控制文字的大小。　对于大多数用户来说或许这并无不妥，但对于年龄稍大及眼力不佳的访客来说，他们不能按他们的意愿，通过浏览器来改变文字的... 阅读全文
posted @ 2015-07-05 11:21 魔芋铃 阅读(441) 评论(0) 推荐(0)
彻底弄懂css中单位px和em的区别(转)
摘要：国内的设计师大都喜欢用px，而国外的网站大都喜欢用em，那么两者有什么区别，又各自有什么优劣呢？1. IE无法调整那些使用px作为单位的字体大小；2. 国外的大部分网站能够调整的原因在于其使用了em作为字体单位；3. Firefox能够调整px和em，但是96%以上的中国网民使用IE浏览器(或内核)... 阅读全文
posted @ 2015-07-05 10:56 魔芋铃 阅读(304) 评论(0) 推荐(1)
网页字体介绍以及网页常用字体设置
摘要：# 网页字体介绍以及网页常用字体设置 # 网页字体设置不同于平面设计等其他媒体设计有更多的艺术字体可供选择。因为网页设计中永远不要假设客户的电脑上有你使用的字体。为了让我们的网页在绝大多数访客的电脑上看起来一致。就必须使用绝大多数访客电脑上都有的字体。 网页中的字体是通过css设定，如：font... 阅读全文
posted @ 2015-06-30 13:10 魔芋铃 阅读(796) 评论(0) 推荐(0)
不定高度的div背景或背景图片不显示问题
摘要：在使用div+css进行网页布局时，如果外部div有背景颜色或者边框，而不设置其高度，在IE浏览器下显示正常。但是使用Firefox/opera浏览时却出现最外层Div的背景颜色和边框不起作用的问题。大体结构 原因分析：由于在Firefox和opera中：如果里面的DIV是浮动的（fl... 阅读全文
posted @ 2015-06-22 19:17 魔芋铃 阅读(3292) 评论(1) 推荐(0)
CSS width：100%和width：auto的区别
摘要：width：100%和width：auto的区别width:auto比较聪明，如果margin已经左右占去10px的空间，那么width给的值就是580px。 123如果是width:100%，则说明p的width会得到600px就已经充满div区域，然后自己又有margin，所以会出现滚动条... 阅读全文
posted @ 2015-06-22 17:23 魔芋铃 阅读(1120) 评论(0) 推荐(0)
背景图片满屏显示
摘要：如何用css背景图片拉伸 以及100% 满屏显示呢？这个问题听起来似乎很简单。但是很遗憾的告诉大家。不是我们想的那么简单。比如一个容器（body,div,span）中设定一个背景。这个背景的长宽值在css2.1之前是不能被修改的。所以实际的结果是只能重复显示，所以出现了repeat,repeat-x... 阅读全文
posted @ 2015-06-20 15:40 魔芋铃 阅读(508) 评论(0) 推荐(0)
选择器中含有特殊符号的注意事项
摘要：# 一、选择器中含有特殊符号的注意事项 #1．选择器中含有“.”、“#”、“(”或“]”等特殊字符根据W3C的规定，属性值中是不能含有这些特殊字符的，但在实际项目中偶尔会遇到表达式中含有“#”和“.”等特殊字符，如果按照普通的方式去处理出来的话就会出错。解决此类错误的方法是使用转义符转义。 ... 阅读全文
posted @ 2015-06-17 10:01 魔芋铃 阅读(445) 评论(0) 推荐(0)
CSS抗锯齿 font-smoothing
摘要：CSS3里面加入了一个“-webkit-font-smoothing”属性。这个属性可以使页面上的字体抗锯齿,使用后字体看起来会更清晰舒服。加上之后就顿时感觉页面小清晰了。 淘宝也在用哦！它有三个属性：none ------ 对低像素的文本比较好subpixel-... 阅读全文
posted @ 2015-06-12 14:29 魔芋铃 阅读(1041) 评论(1) 推荐(0)
filter在CSS中的效果
摘要：滤镜说明： Alpha：设置透明层次 blur：创建高速度移动效果，即模糊效果 Chroma：制作专用颜色透明 DropShadow：创建对象的固定影子 FlipH：创建水平镜像图片 FlipV：创建垂直镜像图片 glow：加光辉在附近对象的边外 gray：把图片灰度化 inver... 阅读全文
posted @ 2015-06-12 10:55 魔芋铃 阅读(289) 评论(0) 推荐(0)
url(data:image/png;base64,R0**)(转)
摘要：##url(data:image/png;base64,R0**) ----------所谓"data"类型的Url格式，是在RFC2397中 提出的，目的对于一些“小”的数据，可以在网页中直接嵌入，而不是从外部文件载入。例如对于img这个Tag，哪怕这个图片非常非常的小，小到只有一个 点，也是要从... 阅读全文
posted @ 2015-06-12 09:14 魔芋铃 阅读(3582) 评论(0) 推荐(0)
中国地图
摘要：# 中国地图Div+CSS #----------****１. 设置省会城市的margin值。２. 然后，有些城市离得很近，要修改图标和文字的左右位置。３. 最后设置：CSS中绝对定位将图标放在合适的位置。完整代码demo:[http://yun.baidu.com/s/1pJvDnK3](http... 阅读全文
posted @ 2015-06-12 00:54 魔芋铃 阅读(480) 评论(0) 推荐(0)
如何引用CSS样式表
摘要：如何使用样式当浏览器读到一个样式表，它就会按照这个样式表来对文档进行格式化。有以下三种方式来插入样式表：1、外部样式表当样式需要被应用到很多页面的时候，外部样式表将是理想的选择。使用外部样式表，你就可以通过更改一个文件来改变整个站点的外观。2、内部样式表当单个文件需要特别样式时，就可以使用内部样式表... 阅读全文
posted @ 2015-06-11 10:53 魔芋铃 阅读(245) 评论(0) 推荐(0)
_margin和margin的区别
摘要：_margin和margin的区别_margin和margin的区别Question:margin:15px 300px 0px 100px; height:72px; width:188px; float:left; 以上的CSS样式由于用了float:left; 所以在IE5-IE6中他的mar... 阅读全文
posted @ 2015-06-11 08:37 魔芋铃 阅读(443) 评论(0) 推荐(0)

上一页 1 2