当前位置:爱推吧 » Div+CSS

网站的建设离不开网页的布局和优化,WordPress工作站注重于CSS+Div布局,将给大家展示CSS+div布局过程中的一些技巧和精典的布局方式。

如何在html中用IE条件判断表达式判断IE版本

HTML 的注释格式是 , IE 对HTML注释做了一些扩展,使之可以支持条件判断表达式,如何让静态HTML代码在不同IE版本显示不同内容? 和编程语言类似,这里的表达式还支持大于(gt)、小于(lt)、 与或非 等操作符,条件注释是 IE5.0 以上版本所特有的一种对注释的扩展,其它浏览器不支持。 [if IE] 判断是否IE [if IE 7] 判断是否是IE7 [if !IE] 判断是否不是IE [if lt IE 5.5] 判断是否是IE5.5 以下版本。  (<) [if lte IE 6] 判...

深入理解 display:inline-block

应用inline-block特性的元素呈现为内联对象,与周围内联元素保持在同一行,可以设置宽度和高度地块元素的属性,此元素之间允许空格。 浏览器对display:inline-block的支持: 目前支持的浏览器有:Internet Explorer 8、Internet Explorer 9、 Firefox、Chrome、Opera、Safari等相对标准浏览器。 Internet Explorer低版本的浏览器不支持display:inline-block,但是会触发IE/Win 的私有概念hasLayout ,从而使内联元素拥有了displa...

IE HACK汇总

很多朋友搞不清楚CSS中有哪些HACK,怎么使用,我整理了一下,贴在这里。这篇文章是关于CSS的hacking技术。不要和微软专有的CSS属性“滤镜”混淆。 在理想世界里,正确的CSS应该在任何支持CSS的浏览器里工作良好。不幸的是,我们并不是生活在理想的世界里,浏览器们布满了BUG和不一致。创建一个跨浏览器并且显示一致的页面,CSS开发者必须想尽办法。通过使用BUG和未实现的CSS,开发者就能够为不同的浏览器应用不同的规则。HACK和FI...

Div+CSS经验总结

让你使用DIV+CSS排版, 不是让你用换个标签然后再去按照表格的方式去排版而是做到内容与表现的分离。 1: ID用于标识页面单独元素以及持久行的结构性元素,方便JS的调用。 类用于标识同一页面可重复定义使用的结构性元素 ID与类的命名需与表现形式无关 :leftContent 而使用有意义的定义方式:sideBar等等。命名方式遵循“驼峰式大小写(标志符由多个单词组成 除首词首字母小写外 其余单词首字母均大写)” 2:避免滥用类,当类型的...

HTML标签CSS属性默认值汇总

HTML标签CSS属性默认值,在你需要还原默认值的时候比较有用。 以前一直在找这份文档,今天偶然在网上看到了。除了inline和block的定义,主要是要注意body|h1~h6|blockquote|menu|ul|ol|dd等标签的默认样式(margin和font-size)。  html, address,blockquote,body, dd, div,dl, dt, fieldset, form,frame, frameset,h1, h2, h3, h4,h5, h6, noframes,ol, p, ul, center,dir, hr, menu, pre   { display: block } li           ...

JavaScript网页特效5则

动态字幕 代码:在需要处加入 < marquee onmouseover=this.stop() onmouseout=this.start()>欢迎访问WordPress工作站 特点:当你把鼠标指向字幕时字幕停止并有链接、移开鼠标指针字幕又滚动了,运用以上代码即可实现。 延伸:动态字幕有一个属性“direction”,它是控制字幕滚动方向的,把“direction”的属性改为“up”,就可以实现向上滚动,同理当改为“down”时就向下滚动,那么“left”和“right”自然就是向左和向右了。  ...

中文字体在CSS中的表达方式

在写一个网站的样式表的时候,都会不可避免地用到一些中文字体,比如说微软雅黑、黑体等,除非是做英文站,或者说你乐意整站都用浏览器默认的字体,那我也算服了U。在 CSS 中写入中文字体的方法一般采用 font-family:"微软雅黑","黑体";这样类似的表达方式,但是对于像 WordPress 这样需要 UTF8 编码平台来说,一个不注意没有转换编码就会导致中文字体无法按照希望的字体表形出来。所以我们可以通过英文、unicode 这种形式来表...

将网站favicon图标缓存到google

个性化的网站ico图标,就像窗外的街道标志一样。当打开网站一个醒目并具有特色的图标,可以让浏览者过目不忘,在打开多个网站时更容易让人迅速找到你的网站,并在收藏夹中彰显个性。浏览器地址栏中的favicon.ico,一般都是由站点的LOGO简化而来。 利用google 的favicon图标缓存服务,调用友链网站favicon小图标,不过你可能会发现有的网站前面有小图标,有的却是默认的,打开这个无favicon图标网站却又发现浏览器地址栏有小图标...

纯CSS实现三列DIV等高布局

DIV等高布局,我想很多人都遇见过,我也看过不少的方法,有的是通过背景图片,实现假象的等高效果; 还有的用js实现等等。这些都是方法,但是现在都不用以上的方法,来个真正的纯css实现等高! 现在我们来看看真正的 CSS 实现的等高布局,其方法主要是采用“隐藏容器溢出”、“正内补丁”和“负外补丁”结合的方法实现的。 下面来看看实际的例子(三列等高),以下面的 XHTML 代码为例: html代码: <div id="wrap"> <div id...

简洁的 CSS 清理浮动方式

清理浮动有很多种方式,像使用 br 标签自带的 clear 属,使用元素的 overflow,使用空标签来设置 clear:both 等等。但考虑到兼容问题和语义化的问题,一般我们都会使用如下代码来清理浮动。 /* 清理浮动 */ .clearfix:after{ visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0;} .clearfix { zoom:1;} 其原理是,在「高级」浏览器中使用 :after 伪类在浮动块后面加上一个非 display:non...