广州做网站,广州建站_小燕子网络 广州网站制作热线:020-23318051广州建网站第一品牌! 点击添加QQ好友!广州网页设计 为什么大家都喜欢小燕子网络?
站内公告_小燕子网络
广州小燕子网络公司专业从事网站建设、域名注册、企业邮局、网站推广、网站改版、服务器/VPS/虚拟主机空间租用,小燕子网络(www.168xyz.com)以客户需求为出发点,以简洁实用为设计目标!“梦想所有企业都拥有一个自己的官方网站

搜索内容

搜索类别

广州做网站,广州建站_小燕子网络
 
用户名
密  码
 
泽泡网
百度
google
 
当前位置:HOME > 新闻资讯 > 网站制作

广州网站设计公司分享CSS隐藏滚动条: CSS、XHTML中隐藏滚动条与设置样式

来源:小燕子网络  发布时间 2013-08-15

广州网站设计公司分享在用ie6浏览有框架的xhtml页面的时候,默认会水平和垂直滚动条会一起出现,没办法,这是ie6的一个 bug,在firefox上是正常的,出现的原因是其对XHTML 1.0 transitional doctype的解释缺陷.

对于这个错误一般有3种解决方案,

1: 代码: html { overflow-y: scroll; }

原理:强制显示ie的垂直滚动条,而忽略水平滚动条优点:完全解决了这个问题, 允许你保持完整的XHTML doctype.

2:代码: html { overflow-x: hidden; overflow-y: auto; }

原理:隐藏横向滚动,垂直滚动根据内容自适应优点:在视觉上解决了这个问题.在不必要的时候, 未强制垂直滚动条出现.

缺点:只是隐藏了水平滚动条,如果页面真正需要水平滚动条的时候,屏幕以外的内容会因为用户无法水平滚动,而看不到。

3: 代码: body { margin-right: -15px; margin-bottom: -15px; }

原理:这会在margin的水平和垂直方向上添加一个负值, IE添加了该精确数值后, 便会去除对滚动条的需求假象.

设置样式 在原来的html的时候,我们可以这样定义整个页面的滚动条程序代码

body{ scrollbar-3dlight-color:#D4D0C8;

scrollbar-highlight-color:#fff;

scrollbar-face-color:#E4E4E4;

scrollbar-arrow-color:#666;

scrollbar-shadow-color:#808080;

scrollbar-darkshadow-color:#D7DCE0;

scrollbar-base-color:#D7DCE0;

scrollbar-track-color:#; }

但是同样的代码,我们应用在 xhtml下就不起作用了,我相信好多好朋友也遇到过同样的问题那么怎么才能在xhtml下应用滚动条样式呢?

看下列代码

html{ scrollbar-3dlight-color:#D4D0C8;

scrollbar-highlight-color:#fff;

scrollbar-face-color:#E4E4E4;

scrollbar-arrow-color:#666;

scrollbar-shadow-color:#808080;

scrollbar-darkshadow-color:#D7DCE0;

scrollbar-base-color:#D7DCE0;

scrollbar-track-color:#; }

广州网站设计公司提醒这段代码和上一段唯一的不同就是在css定义的元素上,一个是body一个是html。我们再测试一下,把html页面的 "body"修改成"html"测试一下,发现依然可以实现效果。那到底是为什么呢?从字面上来看,xhtml比html多一个x,那么这个x其实也就是 xml,为什么要加一个xml在里面?其实最根本的原因就是要让html更加结构化标准化(因为html实在是太烂)。我们在html里面定义的是 body,因为html不是很标准所以这样可以生效,而在xhtml里面这样就不行了,我看看那个图很明显,body标签本身不是根元素,只有html才是根元素,而页面的滚动条也是属于根元素的,所以这就是我们为什么定义body没有效果的原因,因为我们定义的只是一个子原素。

ok,我们知道了原理,来做一个试验如果把定义"body"或"xhtml"换成"*",

*{ scrollbar-3dlight-color:#D4D0C8;

scrollbar-highlight-color:#fff;

scrollbar-face-color:#E4E4E4;

scrollbar-arrow-color:#666;

scrollbar-shadow-color:#808080;

scrollbar-darkshadow-color:#D7DCE0;

scrollbar-base-color:#D7DCE0;

scrollbar-track-color:#;

}

在html和xhtml都通过,因为*就是定义页面上的任何标签当然也包括了“html”这个标签。

文章来自小燕子网络整理,专为艺考资讯,http://www.168xyz.com写作发布,欢迎转载,同时也喜欢结识来自更多地方的朋友!谢谢!

相关关键词:广州网站制作公司 广州网站设计公司 广州网站建设公司

(网页编辑:李明)

[ 点击数:] [打印本网页] [关闭本窗口]
 

相关内容
  • 广州网站设计公司设计师李明跟大家分享
    标签的用法 2013-08-15
  • 广州网站制作公司分享网页设计案例:PSD源文件要合理分层 2013-08-15
  • 广州网站设计公司教你如何更加正确书写网站title 2013-08-15
  • 广州网站制作公司消息干互联网13年,觉得卖卤菜比找风投上市靠谱 2013-08-15
  • 广州网站设计公司消息新东方回购股票 俞敏洪私有化蓝图 2013-08-15
  • 广州网站制作公司分享网页中代码中的细节 2013-08-15
  • 广州网站设计公司消息360买搜狗下周公布是真是假 2013-08-15
  • 广州网站制作公司涉及到的知识 2013-08-15
  • 广州网站设计公司传言新蛋网 撤出中国市场 2013-08-15
  •  
    小燕子简介 网站设计 诚聘英才 网站建设 常见问答 新闻资讯 网站制作 联系我们 网站推广 关注我们
    广州做网站,用微信扫一扫 小燕子网络 电话:020-23318051  手机:13076712935 邮箱:xyz#168xyz.com(#换成@)  
    地址:广州市番禺区石岗东村市莲路69号 邮编:511450

    Copyright © 2013 广州泽泡信息科技有限公司. All Rights Reserved   
    如果你喜欢本站,别忘了把本站告诉给你QQ上的朋友哦! 试试 Ctrl+D 有意外惊喜哦~

    泽泡公司旗下网站:小燕子网络

    警警广州网警察察






    法律顾问:广州道怡律师事务所
    安全认证
    中国软件网推荐企业
    广东中小企业发展促进会
    中国互闻网协会会员
    经营性网站备案信息
    可信网站