卡卡网

项目列举 li 是常用的网页内容布局排版标签，其样式也非常丰富，单单是列表项标记的类型（list-style-type），我们就有20多个选择。今天谈的问题是，项目列举 li 换行文字左边不对齐的问题。

Table表格颜色，默认时是整个表格每行每列的颜色都一样，这很容易产生视觉疲劳，因此，较友好的设计是TR单双行颜色相间而不同。

本文介绍一个table表格样式，是一种很友好的看着很舒服的表格样式，常见用于教程站里。这也是是个十分通用的table表格样式，可以说大部分网页都适用。

有的浏览器如Firefox，在a标签（链接）点击后会留下一个虚线边框，影响美观，我们如果想a标签（链接）在点击后不要留下虚线边框，要怎么做呢？其实，我们可以从css来设置，达到要求。

我们在设计网页的时候，往往要为丑陋的原始表格美化一翻，美化样式当然要用到css。本文介绍的网页表格美化插件：jqtransform，将大大帮助我们设计漂亮的网页表格。

html控件默认样式都不好看，需要css来美化，本文介绍的checkbox多选框和radio单选按钮也不例外，美化工作需要css+图片来完成。此外，Javascript或JQuery脚本也是少不了的，不然提交表单时传值就有问题。

本文介绍用css实现的下拉菜单，简单、方便、实用。为什么推荐用css实现的下拉菜单？因为html默认的 select 控件生成的下拉菜单样式不好控制，不够美观，使用css打造的下拉菜单，样式可以更加美观，设计可以随意发挥。

在网页设计时，有时遇到某个DIV内容被其他层覆盖挡住了，怎么办呢？我们如何让某一DIV层显示在上面？其实，使用css属性 z-index 就能解决问题。

在现在的网页设计中，鼠标移到图片上图片放大的效果常常被用到，这个效果多应用于文章列表里。我一开始以为是用JQuery来实现的，后来才知道原来是用CSS3来实现的，用CSS3来实现会更加简单和方便。本文将介绍如何用CSS3来实现这个功能。

本文将继续介绍用CSS3来画一个半圆的方法。 CSS3画一个半圆无论圆角、圆弧、实心圆、半圆，css3的实现代码都是 border-radius 属性，border-radius 不但可以定义圆半径和圆角大小，还可以设置圆弧的方向，进而画出各种方向的半圆。

在前文中介绍过CSS3实现圆角的方法，代码更少更简单，不过由于其不兼容IE8浏览器，所以就目前IE8仍然占一定用户比例的情况下，CSS3要完全取代CSS还不太现实。因此本文将介绍纯CSS实现圆角的4种写法，该方法对比CSS3的优势是不用考虑浏览器的兼容问题。

当你要用到一个圆形icon的时候，你可能想到通过图片软件来制作，在css3之前，大家都是通过图片+css来实现各种各样的样式效果。现在，我们用css3的代码，轻松就能画出实心圆了。

圆波扩散动画效果，就是一个圆由中心向四周循环扩散的动画效果。圆波扩散动画效果应用非常广泛，例如可以用来表示某一个位置的状态信息，在网页设计中，常常被用来作为登录或切换页面时的等待状态。本文将使用纯CSS3实现上图动画效果。

要在网页上显示各种算式的符号的时候，我们大多数人是先在Word里插入，然后复制粘贴到网页里，不过要在网页上显示各种计算符号和特殊符号，还是建议用转义字符串。本文收集了各种计算符号和特殊符号的HTML代码，在编写网页代码时可直接使用，值得收藏，以作备用。

有的时候我们要用HTML代码来输出显示乘号（×）、除号（÷）、双引号（"）等字符实体，例如需要显示某个计算公式的时候。其实几乎所有的字符实体（尤其是大量的特殊字符）都有其对应的HTML代码的写法，本文将给大家介绍各种字符实体的HTML写法。

每次设计一张网页或一个表单，都对各种浏览器的兼容问题伤透脑筋，尤其是IE家族。在做兼容性设计时，我们往往会使用各种浏览器能识别的独特语法进行hack，从而达到各种浏览器下显示正常的目的。其中，我们用得最多莫属于\9和\0了。\9和\0是hack IE8、IE9、IE11的独特标识。但是问题来了，\9和\0到底怎样hack IE8、IE9、IE11这三个浏览器？

在上一篇文章里介绍了用css背景图实现文字链右边加一个箭头图标的方法，本文将介绍用Font Awesome实现文字链右边加一个箭头图标的方法。 Font Awesome是一个图标字体库，包含300多种常见小图标，如小箭头之类的icon，使用起来相当方便，只需引用一个css文件，是现在网页设计师常用的插件之一。

许多知名网站都在文字链的右边加一个箭头图标，例如Google站长管理后台，Alexa官网等，这样设计的好处是让链接更醒目，更容易辨认。文字链右边加一个箭头图标的方法，多数人是使用css背景图来实现，包括上面提到的Google站长管理后台，Alexa官网等。是的，这种方法最容易掌握和应用。这正是本文要介绍的实现方法。

近日在做一个网页标签列表，要求不能换行，一开始以为比较容易，三两下就把代码写完了，并且在Firefox和Chrome浏览器测试通过，不过，在IE11一看，却出人意料的没有达到预期效果，li inside-block在IE11里竟然无效！照样换行！为何无效？难道代码还要hack一下IE11？

之前设计网页，如果希望div或table居中，总是用<center></center>把它包起来，但是这样的结果，div或table虽然居中了，但div或table里面的文字也居中了，这是不符合设计者意愿的。那么，我们能否用css实现div或table居中，文字不居中呢？答案是肯定的，本文将给你介绍如何实现此效果。

IE7、IE8、IE9、IE11虽然同属IE家族，但他们在网页渲染时，对css属性的识别却不尽相同，因此，我们会发现网页在IE9浏览好好的，却在IE11上浏览时出现错乱的问题。本文将举例介绍IE家族IE7、IE8、IE9、IE11的css hack的问题，了解它们之间的差异，从而能够写出兼容性良好的css代码。

blockquote默认的双引号千篇一律太过普通，我们能否更改它并美化它，以搭配网页模版的视觉要求？答案是肯定的。下面我就以两个实例来教你怎样修改和美化blockquote双引号，并送上漂亮的css样式。

有关Blockquote的css样式，上一篇已经介绍了《5个Blockquote的css样式》，不过，那是使用css1的写法，要借助双引号的图片和span、div等标签来完成。今天将介绍3个使用css3来实现的Blockquote样式，代码更简洁，并且无需借助图片，推荐使用。

Blockquote标签多用于文章引用内容的时候，这里将介绍8个blockquote的css样式，通过实例，让大家进一步了解blockquote的用法。

在网页设计中，一些区域的标题文字是不能换行的，例如首页显示的文章标题，因为布局是固定的，换行会打乱布局，从而使网页产生错位。因此，我们需要一行一段文字，超出行宽的文字用省略号表示或者直接去掉不用省略号代替。

今天用IE11使用卡卡网的网站速度诊断工具时，发现选项的排版是错位的，我大吃一惊，因为该工具上线有半年多时间了，开发时是经过了多浏览器兼容性测试的，当时测试的浏览器有IE8、IE9、Chrome、360、Firefox，之所以没有IE11，是因为认为只要通过IE9就可以通过IE11了，但实际上现在发现是不行的。

在网页自适应设计中，max-device-width和max-width是不可缺少的两大CSS属性，但是可能大家在使用的选择上没有太多讲究，认为用其中一个即可。不过如果你对此两个属性有了充分的认识之后，你或许把网页的自适应设计得更为极致一些。

网站兼容性调试实在令人烦心，今天，我就把这几个主要浏览器的CSS hack代码汇总一下，满足如下的浏览器要求：IE8、IE9、IE10、IE11、Chrome、Firefox，由于360使用的是Chrome内核，所以满足Chrome基本就满足了360。

在复杂的网页框架布局中，div起了绝对的主导作用，而又因为div的语法在各个浏览器中的表现并不一致，因此div的浏览器兼容性写法就起了至关重要的意义。

hover在css里比较常见，多用于菜单或一些按钮上的鼠标事件，用法也比较简单，不难掌握。不过在浏览器兼容性测试中，发现ie浏览器对hover还是很挑剔的，html写法会影响hover是否有效。

div+css实现的下拉菜单大量被网页设计师使用，通过div+css，可以随心所欲的实现自己想要的样式效果，使得下拉菜单与网页整体布局搭配的更美观和谐。

我写文章，喜欢段落开头空两格，以前，我都是手动敲两个空格进去，后来，我发现，有的文章的每个段落开头并没有空格符，而在网页上显示时照样会缩进两个空格。这就是菜鸟和专家的差别。