Posts Tagged ‘css’

直接使用网页进行打印

Posted in 前端技术 on 九月 14th, 2010 by admin – Be the first to comment

网页打印内容有很多便利的地方,而且不需要安装其他软件

会打印机页眉与页脚并且在有些在程序中不好去掉.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<title></title>

	<style type="text/css" media="print">
		*{margin:0; padding:0;}
		p{ background-color:#333; color:#fff; margin:1mm;}
		.page-break-after{page-break-after : always}
		button{display:none;}
	</style>
	<script type="text/javascript">
	function webprint(){
		window.print();
	}
	</script>
</head>
<body>
	<p>1</p>
	<div class="page-break-after">&nbsp;</div>
	<p>2</p>
	<div class="page-break-after">&nbsp;</div>
	<p>3</p>
	<button onclick="webprint()">print</button>

</body>
</html>

用a模拟submit按钮事件

Posted in 默认分类 on 九月 2nd, 2010 by admin – Be the first to comment

优点:样式可控制性强,可以加不同的状态,兼容ie6. 可扩展性好

缺点: 需要增加js,如果禁用JS可能不能使用.  需要多增加一个a标签。

提交提交

如果直接隐藏在from 中有多个表单无件时无效,求解


.btn_a_submit{ position:absolute; left:-1000px; top:0px;}

关于IIS与APACHE的对width:100%的解析区别

Posted in 默认分类 on 四月 14th, 2010 by admin – Be the first to comment

在FF浏览器下

.issuance_from .form_fill li .wareinfo ul li {
    clear:both;
    line-height:24px;
    width:100%;
}

APACHE平台下面可以不写width:100%,但在IIS中一定要指明,不知道这个是什么原因导致的。

完美的表格(CSS与HTML)

Posted in 默认分类 on 八月 26th, 2009 by admin – Be the first to comment

理论上兼容所有浏览器(FF,GG,IE)其他未测试

table{ border-collapse:collapse;border:1px solid #CCC;background:#efefef;width:100%}
table th{ font-weight:bold; padding:.5em 2em .5em .75em; line-height:1.6em; font-size:12px; border:1px solid #CCC;}
table td{ padding:.5em .75em; line-height:1.6em; font-size:12px; border:1px solid #CCC;}
1
1

两种常用的图文排版实现(CSS)

Posted in 前端技术 on 十一月 22nd, 2008 by admin – Be the first to comment

一般的图文排版方式有两种,
1. 图文并排
2. 图文绕排

代码如下



简约视界|www.simcn.com

图文并排(固定度宽)

image 生活中,无数的物品正随着时光的流逝而变旧,破损,数不清的财富在不经意间消失,杨欣的发家史是一个不为人知的秘密,化腐朽为神奇这种事情,就算他不隐瞒,别人也不会相信。   一个生活在大都市的拾荒者,为了自己的梦想和家人而不断打拼,从社会的最底层,逐步走上巅峰,当金钱,荣誉,美女接踵而至,他能否把....

图文绕排(固定度宽)

image 生活中,无数的物品正随着时光的流逝而变旧,破损,数不清的财富在不经意间消失,杨欣的发家史是一个不为人知的秘密,化腐朽为神奇这种事情,就算他不隐瞒,别人也不会相信。   一个生活在大都市的拾荒者,为了自己的梦想和家人而不断打拼,从社会的最底层,逐步走上巅峰,当金钱,荣誉,美女接踵而至,他能否把....

图文并排(不固定宽度)

image 生活中,无数的物品正随着时光的流逝而变旧,破损,数不清的财富在不经意间消失,杨欣的发家史是一个不为人知的秘密,化腐朽为神奇这种事情,就算他不隐瞒,别人也不会相信。   一个生活在大都市的拾荒者,为了自己的梦想和家人而不断打拼,从社会的最底层,逐步走上巅峰,当金钱,荣誉,美女接踵而至,他能否把....生活中,无数的物品正随着时光的流逝而变旧,破损,数不清的财富在不经意间消失,杨欣的发家史是一个不为人知的秘密,化腐朽为神奇这种事情,就算他不隐瞒,别人也不会相信。   一个生活在大都市的拾荒者,为了自己的梦想和家人而不断打拼,从社会的最底层,逐步走上巅峰,当金钱,荣誉,美女接踵而至,他能否把....生活中,无数的物品正随着时光的流逝而变旧,破损,数不清的财富在不经意间消失,杨欣的发家史是一个不为人知的秘密,化腐朽为神奇这种事情,就算他不隐瞒,别人也不会相信。   一个生活在大都市的拾荒者,为了自己的梦想和家人而不断打拼,从社会的最底层,逐步走上巅峰,当金钱,荣誉,美女接踵而至,他能否把....生活中,无数的物品正随着时光的流逝而变旧,破损,数不清的财富在不经意间消失,杨欣的发家史是一个不为人知的秘密,化腐朽为神奇这种事情,就算他不隐瞒,别人也不会相信。   一个生活在大都市的拾荒者,为了自己的梦想和家人而不断打拼,从社会的最底层,逐步走上巅峰,当金钱,荣誉,美女接踵而至,他能否把....

min-height属性在ie6下表现

Posted in 前端技术 on 十一月 14th, 2008 by admin – Be the first to comment
selector {
  min-height:500px;
  height:auto !important;
  height:500px;
}
/*另一种*/
selector {
  min-height:500px;
  _height:500px;
}

ie6 的 height 属性具有像 min-height的功能 也就是说当内容高度比较 height高是会扩展开

CSS布局_基础框架_左边固定右边自适应宽度

Posted in 默认分类 on 十一月 7th, 2008 by admin – Be the first to comment

IE6与IE7适合









2
1

这个是第二种方式(建议使用第二种)










1
2

css实现两个图片叠加效果

Posted in 前端技术 on 十月 31st, 2008 by admin – Be the first to comment



http://192.168.32.254/temp/thumb/aa/08/aa087f796d2c580441a536ef343286c4110.jpg" border="0" />
http://192.168.32.254/temp/thumb/aa/08/aa087f796d2c580441a536ef343286c4110.jpg" border="0" />
http://192.168.32.254/temp/thumb/aa/08/aa087f796d2c580441a536ef343286c4110.jpg" border="0" />