精彩专题推荐:建站之入门课 建站之必修课 建站之关键课 网站价值所在 流量提高专题 css+div 标准 个人网站打造全过程
返回建站学首页
导航:
建站首页 | 网站设计 | 网站开发 | 网站运营 | 网页软件 | 建站指南 | 搜索优化 | 图像处理 | 视频教程 | 书籍教程 | 建站专题
当前位置:首页>网站设计>html/xhtml教程>正文

整理收集的div+css制作网页的一些小实例技巧


来源:建站学 时间:07-06-05 点击: 点击这里收藏本文

1.鼠标移上去是出现一个window的保存收藏打印的那个小框框,能不能限制它的出现?

在HEAD中加入

<META HTTP-EQUIV="imagetoolbar" CONTENT="no">

2. 图片上用新属性galleryimg

<img width=500 height=500 src=a.gif galleryimg="no">

3.div实现滚动条 (某些情况下可以替代iframe)

<style>
.gb { overflow:auto; white-space:normal; height:100px; padding:3px;}
</style>
<div class="gb"></div>

其中高度height和overflow是必须设置的!

ps:在IE下有的时候水平滚动条会出来,但是事实上,水平滚动条不没有实际的用途,貌似这个是IE的bug,解决方法:overflow-x: hidden

 加上这个.把水平滚动条隐藏掉~

4.用css来实现三角形

 HTML代码

<style>
.t{
  width:50px;
  border-style:solid;
  border-color:#a6a2f7 #fff;
  border-width:0 50px 50px 50px;
}
</style>
<span class="t"></span>

5. 用vml来画圆角...

 HTML代码

<html xmlns:v>
<head>
<style>
v\:* {behavior: url(#default#VML);}
#lone {
 width:200;
 height:70px;
}
</style>
</head>
<body>
<v:RoundRect id="lone" strokecolor="#000" strokeweight="4px" arcsize="0.8" fillcolor="#ff0000">
<!--arcsize 弧度值 fillcolor 圆的填充色 strokecolor 圆的边框色 strokeweight 边框大小-->
</body>
</html>

6 . IE下,当使用了FLOAT之后.用margin-left和margin-right 会变成用双倍的数值,例子:

margin-left:10px; 实际的效果是20PX;

解决的方法:(1),用display:inline;(2)用clear:float

方法1适应的范围比较广一些,(2)的话.只适合那些可以清除浮动的元素.不能清除的,不能用~

7.在mozilla firefox和IE中的BOX模型解释不一致导致相差2px解决方法:

div{margin:30px!important;margin:28px;}

注意这两个margin的顺序一定不能写反,据阿捷的说法!important这个属性IE不能识别,但别的浏览器可以识别。所以在IE下其实解释成这样:
div{maring:30px;margin:28px}
重复定义的话按照最后一个来执行,所以不可以只写margin:XXpx!important;

8.IE5和IE6的BOX解释不一致IE5下

div{width:300px;margin:0 10px 0 10px;}

div的宽度会被解释为300px-10px(右填充)-10px(左填充)最终div的宽度为280px,而在IE6和其他浏览器上宽度则是以300px+10px(右填充)+10px(左填充)=320px来计算的。这时我们可以做如下修改:

div{width:300px!important;width /**/:340px;margin:0 10px 0 10px}

这个/**/是IE5和firefox都支持但IE6不支持.

9.ul标签在Mozilla中默认是有padding值的,而在IE中只有margin有值所以先定义

ul{margin:0;padding:0;}

10.关于脚本,在xhtml1.1中不支持language属性,只需要把代码改为

<script type="text/javascript">

11.JS 的页面跳转脚本

 HTML代码

<script language="javascript">
location.assign ("<a href="HTTP://www.jzxue.com" target="_blank">HTTP://www.jzxue.com</a>")
</script>
 
12. IE下用JS去掉所有链接和图片的焦点(因点击而产生的虚线框)

function bluring(){
if(event.srcElement.tagName=="A"||event.srcElement.tagName=="IMG") document.body.focus();
}
document.onfocusin=bluring;
</script>

9 7 3 1 2 4 8 :

  把此文章收藏到:          
广而告之
文章搜索
  • Google JZxue.Com

关于我们 | 联系我们 | 友情链接 | 网站地图
Copyright © 2005 - 2006 建站学 All rights reserved.