HTML+CSS - 随笔分类 - 柴犬金刚

大小不固定的图片、多行文字的水平垂直居中

摘要：想必写css的都知道如何让单行文字在高度固定的容器内垂直居中，但是您知道或者想过让行数不固定的文字在高度固定的容器内垂直居中呢？本文将会告诉你如何实现多行文字的垂直居中显示。关于图片垂直居中显示，想必很多写css的人都研究过，或者说是搜寻过方法。淘宝团队似乎提供了一种不错的方法，用font-size... 阅读全文

posted @ 2014-11-14 13:02 柴犬金刚阅读(249) 评论(0) 推荐(0)

关于Google圆角高光高宽自适应按钮及其拓展

摘要：一、前言对于一门技术而言，要想达到真正的高度，需要形成自己关于这门技术的世界观。我在研究css上花费的功夫相对多些，但还不至于形成css世界观的程度，css是如此精深的一门学问，不仅仅是一门技术，更融入了美学，哲学的东西。当然，对于css，我是有自己的一套约束准则的，请允许我称之为“鑫三无准则”，即... 阅读全文

posted @ 2014-11-14 13:01 柴犬金刚阅读(261) 评论(0) 推荐(0)

精简高效的CSS命名准则/方法

摘要：一、“无”的哲学佛家讲究“因果报应”，有果必有应。此段看似与主题没有血缘关系，实际讲的是“因”。我个人比较喜欢老子的道家思想，并喜欢以其思想解释学习与工作中遇到的一些问题。例如我之前写过的“中国古代道家思想与网页重构的思考”一文。老子有云：“天下万物生于有，有生于无”。具体解释就是：天下万物都是由看... 阅读全文

posted @ 2014-11-14 13:00 柴犬金刚阅读(284) 评论(0) 推荐(0)

关于文字内容溢出用点点点(…)省略号表示

摘要：前言：由于文字内容的长度不确定性和页面布局的固定性，难免会出现文字内容超过div（或其他标签，下同）区域的情况，此时比较好的做法就是当文字超过限定的div宽度后自动以省略号（…）显示，这样，按照习惯，人们都会知道这儿有文字被省略了。css中有个属性叫做text- overflow:ellipsis... 阅读全文

posted @ 2014-11-14 12:59 柴犬金刚阅读(1072) 评论(0) 推荐(0)

IE5,IE6,IE7,IE8的css兼容性列表[转自MSDN]

摘要：At-rulesCSS 2.1:IE 5.0IE 5.5IE 6.0IE 7.0IE8 Beta 1IE8 Beta 2IE 8.0@charsetNoYesYesYesYesYesYes@importYesYesYesYesYesYesYes@mediaNoYesYesYesYesYesYes@p... 阅读全文

posted @ 2014-11-13 16:47 柴犬金刚阅读(275) 评论(0) 推荐(0)

还记得我们折腾过的居中么？

摘要：虽然div中内容上下居中的问题已经是一个比较古老的话题，但是最近发现还是有很多前端开发者在询问如何实现。其实网络上已经有很多资料和案例了，我这里再总结一下几个比较常见的处理方式。情形一：div限高，内容长度限一行1 .v-align {2 margin: 0 auto;3 width... 阅读全文

posted @ 2014-11-13 16:44 柴犬金刚阅读(192) 评论(0) 推荐(0)

使用CSS使内容垂直居中的N中方法

摘要：用css+div使页面内容水平居中的方法大家并不陌生，那么如何使内容垂直居中呢？OK，下面进入正题，不如我们使用做高中数学题时经常用的思想：分情况讨论。1.当待垂直居中的DIV高宽为已知时： 1.1绝对定位法： CSS: .middle-div{ width:3... 阅读全文

posted @ 2014-11-13 16:41 柴犬金刚阅读(199) 评论(0) 推荐(0)

Css调整图片大小[将大图片压缩成小图片]

摘要：采用滤镜[filter]效果，实现大图片压缩成小图片。阅读全文

posted @ 2014-11-13 16:35 柴犬金刚阅读(860) 评论(0) 推荐(0)

html/css一些需要注意的基础点

摘要：border:0;边框存在但不现实并且占内存border:none;边框未渲染HTML的书写规范： 1、标签换行。 2、标签缩进。 3、标签要关闭。 4、标签名属性不能为空。 5、首先要！doctype声明。 6、编码格式为UTF-8。 7、标签要半角英文小写。 8、合理注释。9、类名，id名要... 阅读全文

posted @ 2014-11-13 16:30 柴犬金刚阅读(165) 评论(0) 推荐(0)

Css设置图片垂直居中

摘要：说明：样式设置主要是针对图片的父级元素，并非图片元素本身。Css代码[图片父级点的样式]：Html代码：阅读全文

posted @ 2014-11-13 16:28 柴犬金刚阅读(176) 评论(0) 推荐(0)

设置兼容性[指定IE浏览器渲染方式]

摘要：以上代码告诉IE浏览器，无论是否用DTD声明文档标准，IE8/9都会以IE7引擎来渲染页面。以上代码告诉IE浏览器，IE8/9都会以IE8引擎来渲染页面。以上代码告诉IE浏览器，Windows以最高版本的IE显示内容。根据指令确定如何呈现内容。标准模式指令以Windows Internet Ex... 阅读全文

posted @ 2014-11-13 16:27 柴犬金刚阅读(440) 评论(0) 推荐(0)

各种浏览器css hack

摘要：你在写css时样式表加上浏览器标识符就行了,各浏览器区别如下:IE都能识别*，标准浏览器（如FF）不能识别*；IE6能识别*，但不能识别 !important；IE7能识别*，也能识别 !important；IE8能识别\0，不能识别*，+,_,*加!important;FF不能识别*，但能识别 ... 阅读全文

posted @ 2014-11-13 16:22 柴犬金刚阅读(1066) 评论(0) 推荐(0)

10步掌握CSS布局定位: position static relative absolute float

摘要：无意中看到此文，因作者强调其中避开了浏览器bug/分歧，所以个人认为值得借鉴。不才仔细看了此文，自觉受益匪浅，屡试不爽，佩服作者对css布局的精炼总结，顺便小译了一段，英文水平有限，且个人通常写写php，对css了解不深却有点兴趣，错误之处还请指正。个人没有空间，代码中的css文件和js保留了完整... 阅读全文

posted @ 2014-11-13 16:21 柴犬金刚阅读(278) 评论(0) 推荐(0)

魔哥圆角--（代码精简，完全自适应）

摘要：圆角底部内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里圆角底部阅读全文

posted @ 2014-11-13 16:19 柴犬金刚阅读(157) 评论(0) 推荐(0)

IE6终极备忘单：修复IE6下 25+ Bugs

摘要：参见：http://bbs.blueidea.com/thread-2965546-1-1.html 阅读全文

posted @ 2014-11-13 16:17 柴犬金刚阅读(117) 评论(0) 推荐(0)

Img图片在IE6下显示空白的Bug解决方案

摘要：在进行页面的DIV+CSS排版时，遇到IE6（当然有时Firefox下也会偶遇）浏览器中的图片元素img下出现多余空白的问题绝对是常见的对于该问题的解决方法也是“见机行事”。1、将图片转换为块级对象即，设置img为“display:block;”。在本例中添加一组CSS代码：“#sub img {d... 阅读全文

posted @ 2014-11-13 16:16 柴犬金刚阅读(199) 评论(0) 推荐(0)

web标准常见问题整理

摘要：参见：http://bbs.blueidea.com/thread-2692909-1-1.html 阅读全文

posted @ 2014-11-13 16:15 柴犬金刚阅读(115) 评论(0) 推荐(0)

解决li在ie,firefox中行高不一致问题

摘要：li在ie与firefox的高度是不一样的，解决办法是li font-size:0;然后在将其子元素复为12px￥3452元起台湾环岛经典8日游台湾环岛经典8日游-华￥3452元起台湾环岛经典8日游台湾环岛经典8日游-华￥3452元起台湾环岛经典8日游台湾环岛经典8日游-华￥3452元起台湾环岛经典... 阅读全文

posted @ 2014-11-13 16:04 柴犬金刚阅读(195) 评论(0) 推荐(0)

CSS实现背景透明，文字不透明，兼容所有浏览器

摘要：11.11也是公司成立的日子，16岁啦，我呢3岁半，感谢公司给了这样一个平台，让我得以学习和成长，这里祝愿公司发展越来越好~进入主题，每年11月11号是光棍节，产生于校园，本来只是一流传于年轻人的娱乐性节日，以庆祝自己仍是单身一族为骄傲，而如今是各大商家以脱光为由打折促销的时期，成为了所谓的”购物节... 阅读全文

posted @ 2014-11-13 15:45 柴犬金刚阅读(444) 评论(0) 推荐(0)

png-24在ie6中的几种透明方法

摘要：由于游戏类官网在页面背景和装饰人物的设计上追求画丽且与游戏风格想匹配，这就给前端页面制作人员带来了很多的麻烦，一个页面的制作主要时间和精力花费在兼容ie6上，而ie6因为不兼容png-24的图片一直被开发人员所鄙视。由于市场决定了页面的存在的价值，所以ie6还是必须要兼容。下面介绍几种常用的解决办法... 阅读全文

posted @ 2014-11-13 14:43 柴犬金刚阅读(291) 评论(0) 推荐(0)

随笔分类 - HTML+CSS