首页 | 站长免费中心 | 新手上路 | 网站运营 | 网页制作 | 图片设计 | 动画设计 | 网页编程 | 网页特效 | 本站专题 | 虚拟主机 | 域名注册 | 网站建设 | 程序下载
       免费空间资源 | 新闻咨询 | 免费域名 | 免费网盘 | 网站推广 | 网站策划 | 建站经验 | 网站优化 | 网页代码 | 源码下载 | 音乐小偷 | 网络赚钱 | 论坛交流
网站建设
网站建设
虚拟主机
虚拟主机
域名注册
域名注册
711网络首页
站长工具
站长工具
网站源码
网站源码
站长论坛
站长论坛

 711网络 网页制作CSS教程

css实用技巧及必须得注意的事项

来源: 互联网    日期:2008-12-26
 

10.导航间竖线的定义方法:
css部分:

.nav {
    width:408px;/* 这个宽度一定要按li中的宽度算好 */
    float:right;
    display:inline;
    overflow:hidden
}
.nav ul {
    margin:0;
    padding:0
}
.nav li {
    float:right;
    width:80px;
    height:auto;
    text-align:center;
    padding:0 10px;
    border-right:1px solid #444;
    margin-right:-1px;
}

html部分:

<div class="nav">
  <ul>
    <li><a href="show.htm">产品展示</a></li>
    <li><a href="case.htm">成功案例</a></li>
    <li><a href="service.htm">客户服务</a></li>
    <li><a href="download.htm">下载中心</a></li>
  </ul>
</div>

11.中英文下划线对齐方式(利用图片的align="absmiddle"):

<img src="img.gif" align="absmiddle">中英文并排:<a href="/">中文 gollum</a>

12.li交替显示背景代码:

ul {
    list-style:none;
    font-size:12px;
    line-height:20px;
    color:#666;
}
ul li {
background-color:e­xpression(this.sourceIndex%2==0?'#EAF8FD':'#ffffff');
}

13.利用css reset规避IE6下密码表单和文本不等长的问题,在css reset中加入:

input {
    font-family:Arial, Helvetica, sans-serif;
}

14.FF下上边距无效时,及时反应给父级div上写入overflow:hidden或overflow:auto;也可以在子级div中写入float:left; display:inline.

15.描边文字效果:

<div style="position:relative; width:200px; height:25px; line-height:25px; text-align:center; font-size:14px; color:#fff; background:#9c0;">
这是描边文字<span style="position:absolute; left:-1px; top:-1px; color:#444;width:200px; height:25px; display:block">这是描边文字</span>
</div>

16.圆角背景,最简单的方法就是PS圆角线条,然后用表格实现自适应

17.通过定义em实现小三角效果:

* {
    font-size:14px;/* 必须通配字体大小 */
}
em {
    display:block;
    font:0/0 "宋体";/* 经本人摸索,只有在宋体下才最为标准 */
    border:7px solid;/* border值越大,三角形越大 */
    border-color:#fff #fff #fff #444;/* 通过改变颜色值,可产生不同效果,自己实验 */
    margin-top:5px
}

在样式中加入以上代码后,在body中用<em></em>即可得到小三角效果.

18.如果在FF中测试发现层错位或者下面的层跑到顶上了,八九不离十是没清除浮动的原因,在出问题那个层样式中加入:

clear:both

即可.

19.IE6下当层高低于10px时,会出现高度在定义值上加10px的效果,最简单的方法就是在该层样式中加入:

font-size:0;

立马将其打回原形.



文章共3页:  [1] [2] [3]


更多的css实用技巧及必须得注意的事项请到论坛查看: http://BBS.TC711.COM



【 双击滚屏 】 【 评论 】 【 收藏 】 【 打印 】 【 关闭 】 来源: 互联网    日期:2008-12-26   

发 表 评 论
查看评论

  您的大名:
  • 尊重网上道德,遵守中华人民共和国的各项有关法律法规
  • 承担一切因您的行为而直接或间接导致的民事或刑事法律责任
  • 本站管理人员有权保留或删除其管辖留言中的任意内容
  • 本站有权在网站内转载或引用您的评论
  • 参与本评论即表明您已经阅读并接受上述条款
认证编码: 刷新验证码
点评内容: 字数0
  精品推荐  
  本月推荐  
  友情赞助  

关于我们 | 联系我们 | 广告投放 | 留言反馈 | 免费程序 | 虚拟主机 | 网站建设 |  网站推广 |  google_sitemap baidu_sitemap RSS订阅
本站所有资源均来自互联网,如有侵犯您的版权或其他问题,请通知管理员,我们会在最短的时间回复您
Copyright © 2005-2015 Tc711.Com All Rights Reserved 版权所有·711网络   蜀ICP备05021915号
110网监备案 信息产业备案 不良信息举报