如何使整个页面内容居中，如何使高度适应内容自动伸缩。这是学习CSS布局最常见的问题。下面就给出一个实际的例子，并详细解释。（本文的经验和是蓝色理想论坛xpoint、guoshuang共同讨论得出的。） 首先先按这里看实际运行效果，这个页面在mozilla、opera和IE浏览器中均可以实现居中和高度自适应。我们来分析代码： 完整代码body{background:#999;text-align:center;color: #333;font-family:arial,verdana,sans-serif;}#header{wid...
如何禁止打印页面_CSS/HTML解决思路： 要真正禁止打印页面是办不到的，但是如果能设置让用户打印到的是空白，也算是实现禁止打印的目的了。 具体步骤： 代码示例： <html> <head><title>不可打印的页面</title> <style> @media print{ body{display:none} } </style> </head> <body> 文档主要内容 </body> </head>注意：@media print{}规则中所定义的CSS仅对打印时的页面生效。 技巧：在很多论坛中在打...
本篇用box的图例，对CSS中box（盒模式）的分析，为学习CSS的读者建立了清楚的模型。 W3C定义的盒模式如下: width和height定义的是Content部分的宽度和高度，padding border margin的宽度依次加在外面。背景会填充padding和content部分。但是由于浏览器设计上的问题，不同浏览器显示效果会有些不同。左右Margin加倍的问题当box为float时，IE6中box左右的margin会加倍 左面的inner的左面margin明显大于5px。这时候，定义inner的disp...
经典论坛 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
无意中看到的一个非常不错的小技巧.是关于用CSS处理闭合浮动元素的方法,收藏了.关于闭合浮动元素（clearing float）的方法现在已经很多了，你还不了解的话去old9的blog看看，有一篇闭合浮动元素。这些方法我最喜欢就是 使用:after 伪类动态的嵌入一个用于清除浮动的元素，可惜代码量太大了，看着不够简洁。现在我看到有个方法超级简单。赶紧介绍一下。原文在：http://annevankesteren.nl/2005/03/clearing-floats原理是这样的，外围...
作为一个热门技术，CSS的发展的确有些缓慢。CSS最早被提议在1994年，最早被浏览器支持在1996年，CSS一直被力捧为传统的以HTML为基础的web代码的继承者。CSS使用样式表来控制整个站点字体和布局的能力,使它看起来非常有效率、易于设计和有远见。然而，也一直有荒诞的说法围绕着CSS，阻碍了网页设计师学习和掌握这种语言。究竟是什么让人们大惊小怪呢？ 我们访问了大学教师Christopher Schmitt，他是CSS的倡导者之一。Christopher深信...
Web Encoder body { font-size:12px; line-height:12px; background-Color:buttonface; border-width:0px; overflow:auto; margin:0px; padding:4px; } #t1, #t2 { width:100%; height:40%; border-width:1px; overflow:auto; height:expression((document.body.clientHeight-100)/2); } input { border-width:1px; padding-left:10px; padding-right:10px; margin:4px; } function webEncode(){ strS...
#tabs UL {DISPLAY: inline; PADDING-LEFT: 0px; MARGIN-LEFT: 10px; WHITE-SPACE: nowrap} #tabs UL LI {BORDER-RIGHT: #999 1px solid; PADDING-RIGHT: 8px; BORDER-TOP: #999 1px solid; DISPLAY: inline; PADDING-LEFT: 12px; FONT-SIZE: x-small; BACKGROUND: #eee; PADDING-BOTTOM: 0px; BORDER-LEFT: #999 1px solid; MARGIN-RIGHT: 2px; PADDING-TOP: 3px; BORDER-BOTTOM: #4bcb66 0px solid; FONT-FAMILY: verdana; WHIT...
用web标准设计网站，过渡的方法主要是采用XHTML+CSS，css样式表是必不可少的。这就要求所有网页设计师必须熟练掌握CSS，如果你以前不常用，那么现在就开始学习吧。要制作符合web标准的网站，不懂CSS是设计不出漂亮的页面的。 事实上，所有表现的地方都需要用CSS来实现。我们以前都习惯用table来定位和布局，现在要改用DIV来定位和布局。这是思维方式的变化，一开始有些不习惯。呵呵，任何变革都会有阻力的，为了享受标准带来的"益...
A { TEXT-DECORATION: none } A:hover { COLOR: #ff9900; TEXT-DECORATION: underline } TD { FONT-SIZE: 9pt; LINE-HEIGHT: 13pt } TH { FONT-SIZE: 9pt; LINE-HEIGHT: 13pt } BODY { FONT-SIZE: 9pt; LINE-HEIGHT: 13pt } #mnu { FILTER: revealTrans(Duration=1.5,Transition=12) visibility:hide }function set_mnu() { if (mnu.style.visibility=="hidden") { //产生效果和把图层显示 mnu.filters.revealTrans.apply(); mnu.s...
1.embed是非法的 标签是Netscape的私有标签，虽然标签应用广泛存在，但是从HTML3.2,HTML4.0到XHTML1.0，W3C都没有收录这个标签。使用标签的页面将不能通过W3C校验。 2.应该用object W3C推荐的是标签。甚至在XHTML2中，都要被所取代。用方法插入flash的代码是： <parm name="movie" value="test.swf /> 但是这个方法在IE5-IE6/Win上不能正确显示(不能连续播放，要下载完才能放),在低版本的可以正确显示。后来采用先调一个小flash文...
我们大部分的设计师依旧在采用传统的表格布局、表现与结构混杂在一起的方式来建立网站。学习使用XHTML+CSS的方法需要一个过程，使现有网站符合网站标准也不可能一步到位。最好的方法是循序渐进，分阶段来逐步达到完全符合网站标准的目标。如果你是新手，或者对代码不是很熟悉，也可以采用遵循标准的编辑工具，例如Dreamweaver MX 2004，它是目前支持CSS标准最完善的工具。 1．初级改善 为页面添加正确的DOCTYPE 很多设计师和开发者...
top、clientTop、scrollTop、offsetTop图示说明如下：51windows.Net var s = ""; s += "\r\n网页可见区域宽："+ document.body.clientWidth; s += "\r\n网页可见区域高："+ document.body.clientHeight; s += "\r\n网页可见区域宽："+ document.body.offsetWidth +" (包括边线的宽)"; s += "\r\n网页可见区域高："+ document.body.offsetHeight +" (包括边线的宽)"; s += "\r\n网页正文全文宽："+ document.body.scrollWidth; s ...
想法很简单，代码很简洁，效果也不错，蛮有用（这种高级东东 IE 自然又是不认识的）。 代码如下: * { outline: 2px dotted red } * * { outline: 2px dotted green } * * * { outline: 2px dotted orange } * * * * { outline: 2px dotted blue } * * * * * { outline: 1px solid red } * * * * * * { outline: 1px solid green } * * * * * * * { outline: 1px solid orange } * * * * * * * * { outline: 1px sol...
这些小TIPS，在CSS手册或者HTML手册里是看不到的，不记得是在那里看到的，不过我一直用着。虽然标准校验通不过，如果不追求标准校验的话，还是可以用用的，因为在IE和Firefox里能显示的很好。 1。是不是经常会遇到小图片和文字一行排列不齐的尴尬? img的align属性有一个这样的，align="absmiddle"，可以试试，不过要是校验的时候，会提示错误。 2。字体 写一行中英文混在一起的内容，然后分别用font-family:宋体，font-family:Aria...