随笔分类 - CSS
CSS
摘要：FROM : http://www.ijophy.com/2014/05/bootstrap3-compatible-with-ie8.html 最近在研究Bootstrap（官方，Github）这个优秀的前端框架，Bootstrap最开始是Twitter团队内部的一个前端框架，所谓前端框架就是一个
阅读全文
摘要：From :http://www.cnblogs.com/Wayou/p/goodui.html如此有用的文章我已记不得是什么时候发现的了，但在看完的那一刻便想将之翻译，分享给大家自己也受用。时间过了很久，来到了2014年，终于静下心来花了大把时间连同图片一起译成了中文。像我这样业余的翻译六级分数只够及格的程序员，不敢说做到信雅达，但求意思到位。1 尽量使用单列而不是多列布局单列布局能够让对全局有更好的掌控。同时用户也可以一目了然内容。而多列而已则会有分散用户注意力的风险使你的主旨无法很好表达。最好的做法是用一个有逻辑的叙述来引导用户并且在文末给出你的操作按钮。2 放出礼品比草草结束掉一次活动
阅读全文
摘要：转： http://uicss.cn/css-scrollbar/PSD转html， 设计稿上，有一处内嵌的介绍信息，当文字过长时，要求使用一个经过处理的滚动条来展示。如果要求兼容firefox，可以使用JQ来进行制作。如果仅要求IE浏览器，可以通过调整CSS的方式，来给滚动条换色。代码如下：.uicss-cn{height:580px;overflow-y:scroll;scrollbar-face-color:#EAEAEA;scrollbar-shadow-color:#EAEAEA;scrollbar-highlight-color:#EAEAEA;scrollbar-3dlight-
阅读全文
摘要：轉:http://www.blogjava.net/xcp/archive/2010/11/04/337254.html1、设置FCKeditor编辑区的背景色如果改css的话，就直接修改/fckeditor/editor/css/fck_editorarea.css文件就可以了body{ background-color: #ffffff; padding: 5px 5px 5px 5px; margin: 0px;}2、设置FCK工具条的背景，在fckeditor/editor/skin/各自不同的主题/fck_editor.css文件就可以了body{ padding: 1px; mar
阅读全文
摘要：From : http://www.zhangxinxu.com/wordpress/?p=794CSS小三角原理CSS气泡效果IE6下边框透明原理解析CSS3实现的机器猫图形
阅读全文
摘要：From : http://wayfoon.iteye.com/blog/182041word-break:break-all和word-wrap:break-word都是能使其容器如DIV的内容自动换行。它们的区别就在于：1，word-break:break-all 例如div宽200px，它的内容就会到200px自动换行，如果该行末端有个英文单词很长（congratulation等），它会把单词截断，变成该行末端为conra(congratulation的前端部分)，下一行为tulation（conguatulation）的后端部分了。2，word-wrap:break-word 例子与上
阅读全文
摘要：From : http://hi.baidu.com/liuyang1984/blog/item/28bba545456dee3a869473c7.html网站布局用CSS进行页面布局需要了解很多不同的技术，设计师也要有相当的创造性思维。无论选择固定布局或流式布局，无论作品靠左还是居中对齐，都需要对CSS布局有着良好的把握能力。布局基础在用CSS实现分栏布局之前，需要了解一些预备知识。CSS并没有提供诸如“left-column:200px”之类的直观分栏属性，因此我们必须要用一些技巧来突破这些限制。实现分栏布局主要有两种方法，每种都各有利弊。第一种方法是使用四种CSS定位选项（absolut
阅读全文
摘要：DIV结构如下： │body {} /*这是一个HTML元素，具体我就不说明了*/ └#Container {} /*页面层容器*/ ├#Header {} /*页面头部*/ ├#PageBody {} /*页面主体*/ │ ├#Sidebar {} /*侧边栏*/ │ └#MainBody {} /*主体内容*/ └#Footer {} /*页面底部*/Form : http://www.blueidea.com/tech/site/2006/3574.asp
阅读全文
摘要：Cnblog網頁設計新聞主題UI 设计师的盛宴：Web UI 设计资源大系120个非常优秀的CSS水平导航菜单60个高质量的CSS、XHTML网页布局模板下载免费的线框工具，UI设计工具，PDFs，资源等精挑细选，9款基于Web浏览器的线框图绘制软件（全英文）10款非常棒的web原型设计工具
阅读全文
摘要：CnBlog Search解決方案一:http://www.cnblogs.com/yangxiaohu1/archive/2010/11/14/1877100.html解決方案二:http://www.cnblogs.com/web-backend/archive/2010/01/20/1652792.htmlImg Lowsrchttp://221.199.150.103/jsj/Html/page/book/js/h_lowsrc.htm
阅读全文
摘要：轉自:http://tieba.baidu.com/f?kz=669728589关于强制不换行、强制换行的话题在网上已经被讨论了无数次，但我发现都不够全面，没有充分考虑各种浏览器、各种标签等情况，以致不兼容，所以我再来说说。由于div和p在本文的讨论中，效果相同，所以省略p。 文中“没有指定宽度的td”是指：为table指定了宽度，但没有给td指定宽度。 强制不换行 div...
阅读全文
摘要：http://www.itxuexi.com/tech/wangyezhizuo/css/66021252633559.htmlhttp://bbs.blueidea.com/thread-2853109-1-4.htmlhttp://www.google.com.hk/search?hl=zh-CN&newwindow=1&safe=strict&rls=ig&q...
阅读全文
摘要：轉自:http://www.blueidea.com/tech/web/2006/3469.asp自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法对于div,p等块级元素 正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行html<div id="w...
阅读全文
摘要：轉自:http://www.icafer.com/Archiver/26.htmlli的这个样式定义是将列表项目使用图片来代替显示的小圆点。当然您也可以显示成其它效果，详细请参阅下面的定义: 列表项目效果的CSS定义li {list-style-image: url(images/disc.gif);} *list-style-type: circle(可换成自己想要的样式); 列表项目样式...
阅读全文
摘要：数月来学习web标准，并遵循标准设计和制作web页面。一直想写点什么，整理一下自己的心得体会。写这篇文章，主要是针对中文排版设计，英文排版因为很少做，所以不涉及。 先介绍如何设定字体、颜色、大小、段落空白等比较简单的应用，后面再介绍下比如首字下沉、首行缩进。最后讲一些常用的web页面中文排版，比如中文字的截断、固定宽度词内折行（word-wrap和word-break）等等。因为只是写一些应用方面...
阅读全文
摘要：轉自:http://www.lbsfans.cn/article.asp?id=283今天在对原创草根文学进行字体设置的时候，突然发现一个问题，就是无论在css中如何设置中文字体：比如黑体，总在博客中无法体现出来，查看了yahoo中国以及一些wp博客，貌似在css中的中文字体显示正常，于是得出初步判断就是lbs博客读取css文件中的中文字体时不能识别，于是在百度了以下，通过网络获悉：浏览器在读取c...
阅读全文
摘要：11 CSS navigation menus : at Exploding Boy 12 more CSS Navigation Menus. : at Exploding Boy 14 Free Vertical CSS Menus : at Exploding Boy 2-level horizontal navigation : demo at Duoh Absolute Lists: A...
阅读全文
摘要：无意间在microsoft网站源码顶部看到这么两行代码：<meta http-equiv='MSThemeCompatible' content='yes' /><meta name='MSSmartTagsPreventParsing' content='yes' />网上搜索一下，解释如下：MSSmartTagsPreventParsing的解释是： 在Microsof...
阅读全文
摘要：图片中：CSS 'width' 指的是标准CSS中所指的width的宽度，在firefox，opera等中的宽度就是这个宽度。它只包含容器中内容的宽度。 而Internet Explorer 'width'则是指整个容器的宽度，包括内容，padding ，border。 所谓的CSS的宽度的加法减法就指这里不同浏览器对width解析得到的不同结果。 Firefox中是加法：容器占的宽度=内...
阅读全文
摘要：FROM :http://help.powereasy.net/Template/WEB/1608.html 进步总是要有代价的。 对网页浏览器来说， 由于开发者像是宣传真理一样的拍着胸部担保着一些编辑器和浏览器(特别是Internet Explorer)， 用户们为此花费很多的成本。 而当这个浏览器推出了一个新版本， 然后又修正了之前版本的一些错误和对规范的误解(或是引入了新的)， 或是以任何...
阅读全文
