易截截图软件、单文件、免安装、纯绿色、仅160KB
热门标签: c c# c++ asp asp.net linux php jsp java vb Python Ruby mysql sql access Sqlite sqlserver delphi javascript Oracle ajax wap mssql html css flash flex dreamweaver xml
 最新文章 : css

网页布局CSS技巧 Web设计必知

两列布局
1、左列固定,右列自适应
#left{    width:190px; float:left; }
#right{    margin-left:205px; }
2、右列固定,左列自适应
#left{    float:left; width:100%; }
#right{    float:left; margin-left:-100px; width:100px; }
三列布局
左右宽度固定,中间自适应
#left{ float:left; width:200px; }
#middle{ margin:0 210px; }
#right{ float:right; width:200px; }
至于HTML代码,我想没有必要贴出来了,有这三个作对照,常用的网站布局应该都可以搞定。 ......

整理及优化CSS代码的7个原则

  作为网页设计师(前端工程师),你可能还记得曾经的那个网页大小建议:一个网页(包括HTML、CSS、Javacript、Flash和图
片)尽量不要超过30KB的大小,随着互联网的日益庞大,网络带宽也在飞速发展,很多设计师已经不再考虑这条30KB的理想准则。随着越来越受欢迎的
CSS布局和Javascript对网站用户体验的强化,使得这种现象越来越普遍,尤其是对于大型网站来说,仅仅一个CSS文件就已经超过了30KB的上
限。
  但是即便如此,现在也有很多准则来帮助你在完成CSS布局后进行CSS代码的压缩和优化。CSS代码优化的目的并不仅仅是减少CSS文件的大
小,它还能让你的CSS代码更有条理、更高效。在彬Go,你将会学到更多关于CSS代码优化的知识,这能帮你更熟悉CSS代码的规范性。熟悉这些概念还能
让你成为更全面的网页设计师,从而写出更优化的CSS代码。
  您还可以参阅《10个CSS简写技巧让你永远受用
》。
1.使用简写
  如果你现在还对简写一点都不了解,那你就又写落伍了,不过幸好,学起来并不是很难。使用简写是一种让代码减少的最简单方法。没有比现在更适合实践代码简写的时候了,还等什么,一起来看看吧。
  Margin、border、padding、background、font、list-sty ......

图片居中显示的css样式代码

.box128{
    width:128px;
    height:128px;
    text-align: center;
    vertical-align:middle;
    display:table-cell !important;
    display:block;
    border:1px solid #DDD;
    white-space:nowrap;
    overflow:hidden;
}
.box128 i {
    line-height: 128px;
    width:0px;
    display:inline-block;
}
.box128 img {
    text-align: center;
    vertical-align: middle;
    display: inline;
}
html结构
<div class="box128"><i></i><img src"" /></div>
注意:图片的高和宽不能大于128,否则会撑开,对于大于的可在服务器端进行处理。 ......

牛人也得看的15个CSS常识

      1、不要使用过小的图片做背景平铺。这就是为何很多人都不用 1px 的原因,这才知晓。宽高 1px 的图片平铺出一个宽高 200px 的区域,需要 200*200=40, 000 次,占用资源。 
  2、无边框。推荐的写法是 border:none;,哈哈,我一直在用这个。 border:0; 只是定义边框宽度为零,但边框样式、颜色还是会被浏览器解析,占用资源。 
  3、慎用 * 通配符。所谓通配符,就是将 CSS 中的所有标签均初始化,不管用的不用的,过时的先进的,一视同仁,这样,大大的占用资源。要有选择的初始化标签。 
  4、CSS 的十六进制颜色代码缩写。习惯了缩写及小写,这才知道,原来不是推荐的写法,为的是减少解析所占用的资源。但同时会增加文件体积。孰优孰劣,有待仔细考证。 
  5、样式放头上,脚本放脚下。不内嵌,只外链。 
  6、坚决不用 CSS 表达式。 
  7、使用 引用样式表,而不是通过 @import 导入。 
  8、一般来说,PNG 比 GIF 要小,小得多。再者,GIF  ......

CSS网页布局编码小技巧整理

1、ul标签在Mozilla中默认是有padding值的,而在IE中只有margin有值。 
2、同一个的class选择符可以在一个文档中重复出现,而id选择符却只能出现一次;对一个标签同时使用class和id进行CSS定义,如果定义有重复,id选择符做的定义有效,是因为ID的权值要比CLASS大。
3、一个兼容性调整(IE和Mozilla)的笨办法:初学可能会碰到这样一个情况:同样一个标签的属性在IE设置成A显示是正常的,而在Mozilla里必须要设成B才能正常显示,或者两个倒过来。
   临时解决方法:选择符{属性名:B !important;属性名:A}
4、如果一组要嵌套的标签之间需要些间距的话,那就留给位于里面的标签的margin属性吧,而不要去定义位于外面的标签的padding
5、li标签前面的图标推荐使用background-image,而不是list-style-image。
6、IE分不清继承关系和父子关系的差别,全部都是继承关系。
7、在给你的标签疯狂加选择符的时候,别忘了在CSS里给选择符加上注释。 等你以后修改你的CSS的时候就知道为什么要这么做了。
8、如果你给一个标签设置了一个深色调的背景图片和亮色调的文字效果。建议这个时候给你的标签再设置一个深色调的背景颜色。
9、定义链接的四种状态要注意 ......

css的伪类

<html>
<head>
<title>CSS伪类 pseudo-class</title>
<style type="text/css">
a:link {color: #FF0000}     /* 未被访问的链接 红色 */
a:visited {color: #00FF00}  /* 已被访问过的链接 绿色 */
a:hover {color: #FFCC00}   /* 鼠标悬浮在上的链接 橙色 */
a:active {color: #0000FF}   /* 鼠标点中激活链接 蓝色 */
</style>
</head>
<body>
<a href = www.google.cn>Google</a>
</body>
</html> ......
总记录数:772; 总页数:129; 每页6 条; 首页 上一页 [109] [110] [111] [112] 113 [114] [115] [116] [117] [118]  下一页 尾页
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号