本文主要介绍CSS14个实用技巧精选推荐。本页创业项目2018首选技能目录：1.CSS字体属性缩写规则 2.FireFox去除超链接的虚线 3.居中定宽页面 4.隐藏水平滚动条 5.浏览器选择器 6。同时使用两个类1.CSS字体属性缩写规则一般CSS字体属性是这样设置的：font-weight:bold; font-style:italic; font-varient:small-caps; 字体大小:1em; 行高:1.5em; 字体家族:verdana,sans-serif;将它们全部写在一行中：font:bolditalicsmall-caps1em/1.5emverdana,sans-serif;注意：此速记方法仅在指定了font-size和font-family属性时才有效。此外，如果您不设置font-weight、font-style和font-variant，它们将使用默认值，因此请记下这一点。2.FireFox去除超链接的虚线在FireFox下，当你点击超链接时，外围会出现一个虚线轮廓。这很容易修复，只需在标签的样式中添加outline:none即可。a{ outline:none; }3.定宽页面居中为了使页面在浏览器中居中，需要相对定位外层的div，然后设置margin为auto。wrapper{margin:auto;position:relative;}4.隐藏水平滚动条为了避免水平滚动条，在body中加入overflow-x:hidden。身体{溢出-x：隐藏；当您决定使用比浏览器窗口大的图像或flash时，这个技巧很有用。5.浏览器选择器当你需要为某个浏览器设计CSS时，这些选择器会非常有用。IE6和更低版本的html{}IE7和更低版本：first-child+html{}html{}仅适用于IE7*：first-child+html{}仅适用于IE7和当前浏览器html>body{}contemporaryonly浏览器（不适用于IE7)html>/**/body{}Opera9及更低版本html:first-child{}Safarihtml[xmlns*=""]body:last-child{}要使用这些选择器，请将它们放在样式之前。例如：content-box{width:300px;height:150px;}htmlcontent-box{width:250px;}/重写上面的样式，在IE6及以下/6下把width改为250px，同时使用两个class一般只是因为可以设置一个class对于一个元素并不意味着你不能使用两个。其实可以这样做： ...
同时给P元素两个类，用空格隔开，这样所有的属性text和side类将添加到P元素。如果两个类中的属性发生冲突，则最后的设置生效，即CSS文件中放置在后面的类的属性起作用。 补充：ID不能这样写
...，也不能写本页的技能列表： 7.CSS边框默认值 8。CSS用于文档打印 9。图片替换技巧 10.CSS盒模型的另一种调整技巧 11。块元素居中对齐 12。使用CSS处理垂直对齐 13。容器内的CSS定位 14.通向屏幕底部的背景颜色。7、cssborder的默认值通常可以设置边框的颜色、宽度和样式，如：border:3pxsolid#000这个将边框显示为3像素宽的黑色实线。但实际上，你只需要在这里指定样式即可。如果只指定样式，其他属性将使用默认值。一般Border的默认宽度是medium，一般等于3到4个像素；默认颜色是其中文本的颜色。如果这个值刚刚好，就不用设置那么多了。8.CSS用于文档打印很多网站都有打印的版本，其实并不需要，因为CSS可以用来设置打印样式。也就是说，你可以为页面指定两个CSS文件，一个用于屏幕显示，一个用于打印：>第一行显示，第二行打印，注意media属性。但是打印CSS应该写什么呢？您可以像设计普通CSS一样设置它。在设计时，你可以设置这个CSS来显示CSS来检查它的效果。也许你会使用display:none命令来关闭一些装饰图像，并关闭一些导航按钮。9、图片替换技巧一般推荐使用标准的HTML来显示文本而不是图片，这样不仅速度更快而且可读性更好。但是如果要使用一些特殊的字体，就只能用图片了。例如，如果你想要一个卖东西的图标，你可以使用这个图像：??
Of当然可以，但是对于搜索引擎来说，他们对alt中的alt文本的兴趣不如普通文本。这是因为很多设计师在这里放了很多关键字来欺骗搜索引擎。所以方法应该是这样的： Buywidgets
但是没有特殊的字体。为了达到同样的效果，你可以这样设计CSS： h1{background:url(widget-image.gif)no-repeat;height:imageheighttext-indent:-2000px}注意把imageheight换成真实图片的高度。这里会以图片作为背景显示，而真实的文字会因为-2000像素的缩进出现在屏幕左侧2000点处，并且是不可见的。但是关掉图片的人可能看不到全部，所以要注意这一点。10、CSS盒模型的另一种调整技巧。Box模型的调整主要针对IE6之前的IE浏览器。他们将边框宽度和空白区域都算作元素宽度。例如：box{width:100px;边框：5px；padding:20px}可以这样称呼： ... 框的全宽应该是150点，之前除了IE以外的所有浏览器都是这样IE6。但是在IE5这样的浏览器上，它的全宽还是100点。这种差异可以通过前人发明的Box调整法来处理。但是也可以用CSS来达到同样的目的，让它们显示同样的效果。box{width:150px}#boxdiv{border:5px;padding:20px}这样调用：
