css - 随笔分类(第2页) - dtdxrk

【CSS3 DEMO】扑克正反面翻牌效果

摘要：在线预览地址：http://dtdxrk.github.io/game/css3-demo/drawbox.html用到两个属性：一个是动画时间transition-duration: 0.8s;-moz-transition-duration: 0.8s;-webkit-transition-du... 阅读全文

posted @ 2015-01-12 12:09 dtdxrk 阅读(1228) 评论(0) 推荐(0)

Css中常用中文字体的Unicode编码对照

摘要：在网页制作中，最常用的恐怕是字体属性了，在调整页面兼容的时候，也常常发现字体名称的原因导致不兼容或乱码，下面给出几种常用字体的ucicode编码对照，方便使用。宋体SimSun\5B8B\4F53黑体SimHei\9ED1\4F53微软雅黑MicrosoftYaHei\5FAE\8F6F\96C5\... 阅读全文

posted @ 2014-11-10 14:49 dtdxrk 阅读(554) 评论(0) 推荐(0)

内层元素设置position:relative后父元素overflow:hidden overflow:scroll失效解决方法

摘要：内层元素设置position:relative后父元素overflow:hiddenoverflow:scroll 都失效解决方法：在position:relative的外层父容器加position:relative就可以搞定阅读全文

posted @ 2014-11-04 17:21 dtdxrk 阅读(1639) 评论(0) 推荐(0)

【转】行内元素和inline-block产生的水平空隙bug

摘要：重构工程师们在设计代码时，有喜欢手动删除行内元素之间产生的额外空隙，并通过设置margin或padding来获取想要间距吗？如代码：去掉了间距去掉了间距去掉了间距去掉了间距去掉了间距去掉了间距然而删除间距后，代码堆成了一片，看得起很不舒服，特别是从重构转给JS同事后，JS同事看完代码后就会提出抱怨，... 阅读全文

posted @ 2014-08-13 11:37 dtdxrk 阅读(334) 评论(0) 推荐(0)

随机图片大小在DIV中垂直居中对齐总结

摘要：老遇到这种样式现在总结一下阅读全文

posted @ 2014-07-25 16:37 dtdxrk 阅读(278) 评论(0) 推荐(0)

CSS控制元素背景透明度总结

摘要：方法一：CSS3的background rgbafilter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#7F000000',endColorstr='#7F000000');background... 阅读全文

posted @ 2014-07-11 10:52 dtdxrk 阅读(908) 评论(0) 推荐(0)

常见浏览器CSS hack方法总结

摘要：ie6和ie7#tip{*background:black;/*IE7背景变黑色*/_background:orange;/*IE6背景变橘色*/}IE8和IE9:root .test { color:#963\9; } /* IE9 only */ firefox@-moz-document ur... 阅读全文

posted @ 2014-06-24 19:16 dtdxrk 阅读(287) 评论(0) 推荐(0)

css文本超出部分省略号&CSS强制换行总结

摘要：word-break:break-all单词截断自动换行word-break:break-all 例如div宽200px，它的内容就会到200px自动换行，如果该行末端有个英文单词很长（congratulation等），它会把单词截断，变成该行末端为conra(congratulation的前端部分... 阅读全文

posted @ 2014-06-03 17:03 dtdxrk 阅读(1520) 评论(0) 推荐(0)

CSS网站框架及样式命名规范

摘要：CSS网站框架复位：reset.css基础：base.css或 basic.css (字体大小、颜色、背景、行高、列表样式、按钮样式、表格样式等等)布局：layout.css （非结构的布局）主题：themes.css表单：forms.css//模块类头部：header.css尾部：footer.c... 阅读全文

posted @ 2014-05-19 09:37 dtdxrk 阅读(1013) 评论(0) 推荐(0)

CSS Position定位过多是否会影响浏览器渲染速度

摘要：一直有个传说就是页面里的Position多了会影响浏览器渲染速度，今天做个测试看看结果如何。检验的方法：动态创建一定数量的div > 开始计算时间 > 导入css文件渲染 > onload计算时间，看那种方法延迟最短。为了统计的数据有意义没有设置上万个节点，以cnmo首页的节点数为例，chrome ... 阅读全文

posted @ 2014-03-26 18:19 dtdxrk 阅读(2846) 评论(1) 推荐(1)

前端研究CSS之文字与特殊符号元素结合的浏览器兼容性总结

摘要：页面布局里总是会有类似 “文字 | 文字” 的设计样式，不同的浏览器存在严重偏差。有兼容问题就要解决，下面总结了3种解决方案，分享给大家：一.系统默认的样式1.元素换行的段落文字链接 | 文字链接 | 文字链接 ... 阅读全文

posted @ 2014-03-07 15:56 dtdxrk 阅读(1922) 评论(3) 推荐(1)

前端研究CSS之内联元素块级化/区域大小/文字和图标的位置

摘要：做了一天的小按钮基本都是文字+小图标的组合，问题挺多处理的不好，现在总结一下做个了断。//页面结构订阅博客其实结构可以很简单一个a元素设置padding-right或者padding-left的距离设置添加背景图标。但是这样的话用合并的背景图不好使，尤其是一个图标反复用在对应不同大小元素的时... 阅读全文

posted @ 2014-03-05 01:27 dtdxrk 阅读(2035) 评论(1) 推荐(5)

关于css清除元素浮动的方法总结（overflow clear floatfix）

摘要：在前两天的一个面试中考官问我web中清除浮动的一些css常用方法，我很轻松的答出了：1.overflow：hidden2.clear:both3.floatfix类然后问题就来了,考官接着问'为什么overflow：hidden'可以清除浮动?这下就把我问住了。写了这么多年css只是单纯的解决问题，... 阅读全文

posted @ 2014-02-19 11:21 dtdxrk 阅读(840) 评论(0) 推荐(1)

网页布局 CSS实现DIV并列等高

摘要：同事去笔试遇到的问题要求3列div根据内容的变化通过css实现等高效果图：原理：同列的div设置一个父级overflow:hidden 超出部分隐藏给同列的div设置cssmargin-bottom:-10000px; padding-bottom:10000px; 1 2 3 网页布局 CSS... 阅读全文

posted @ 2013-12-20 11:07 dtdxrk 阅读(985) 评论(0) 推荐(0)

两道淘宝的css测试练习题

摘要：准备换工作了，周末在家充电，本来想封装个插件的。但是看到个有意思的博文，原作者处理的不是很好，感觉有点意思我就研究一下。原文地址：http://www.cnblogs.com/yexiaochai/archive/2013/05/18/3085536.html我完成的效果预览：http://jsfi... 阅读全文

posted @ 2013-05-25 14:44 dtdxrk 阅读(3107) 评论(7) 推荐(3)

盒模型块级元素与行内元素浮动元素

摘要：盒模型——外边距、内边距和边框之间的关系，IE8以下版本的浏览器中的盒模型有什么不同。一个元素盒模型的层次从内到外分别为：内边距、边框和外边距IE8以下浏览器的盒模型中定义的元素的宽高不包括内边距和边框块级元素与行内元素——怎么用CSS控制它们、它们怎样影响周围的元素以及你觉得应该如何定义它们的样式... 阅读全文

posted @ 2012-07-19 16:35 dtdxrk 阅读(1584) 评论(0) 推荐(1)

如何居中一个浮动元素?

摘要：设置容器的浮动方式为绝对定位然后确定容器的宽高比如宽500高300的层然后设置层的外边距1 Div {2 width:500px ;3 height:300px;4 margin: -150px 0 0 -250px;5 position: absolute;6 ... 阅读全文

posted @ 2012-07-19 16:13 dtdxrk 阅读(3176) 评论(3) 推荐(0)

CSS块级元素与内联元素

摘要：CSS文档流与块级元素（block）、内联元素（inline），之前翻阅不少书籍，看过不少文章，看到所多的是零碎的CSS布局基本知识，比较表面。看过O'Reilly的《CSS权威指南》，发现里面提到的文档流概念让我很敏感。可恶的是书中并没有解释文档流是什么东西，或许作者觉得这个太简单了以至于不值... 阅读全文

posted @ 2012-07-19 16:07 dtdxrk 阅读(751) 评论(0) 推荐(0)

CSS引入的方式有哪些? link和@import的区别?

摘要：HTML文件是通过CSS样式进行显示的控制的，也就是结合XHTML与CSS来表现页面内容。那么到底有哪些方式在XHTML文件中引入CSS样式呢？一、内联引用CSS将STYLE属性直接加在个别的元件标签里，模板无忧 - www.mb5u.com这种方法优点：可灵巧应用样式於各标签中。方便于编写代码时的... 阅读全文

posted @ 2012-07-19 15:58 dtdxrk 阅读(3135) 评论(0) 推荐(1)

随笔分类 - css