随笔分类 -  CSS

摘要:让某个图片或者Div层悬浮在别的对象之上,一般的方法是用CSS的z-index来定义。z-index的数值越大,对象越在上面。比如: <div style="position:absolute;z-index=1;">test</div>但是,无论怎么设置z-index,你的对象总是在Object对象下面。要想解决让Div覆盖Flash Object的问题,需要在Object的<object>...</object>标签内部加入一个参数“<param name="wmode" value=" 阅读全文
posted @ 2012-08-29 18:40 hen 阅读(6251) 评论(0) 推荐(0) 编辑
摘要:/*隐藏标签*/ .hid{display:none;height:0px;width:0px;} /*左飘浮*/ .left{float:left;} /*右飘浮*/ .right{float:right;} /*文字左对齐*/ .text_left{text-align: left;} /*文字左对齐*/ .te... 阅读全文
posted @ 2012-08-17 10:17 hen 阅读(588) 评论(0) 推荐(0) 编辑
摘要:table{ table-layout: fixed;}td{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}原理:本方法用于解决表格单元格内容过多时的美观问题,主要涉及到4句CSS样式:1.table-layout: fixed由于table-layout的默认值是auto,即table的宽高将取决于其内容的多寡,如果内容的体积无法估测,那么最终表格的呈现形式也无法保证了,fixed一下就好了。(注意:此样式是关键)2.white-space: nowrap是为了保证无论单元格(TD)中文本内容有多少,... 阅读全文
posted @ 2012-05-09 13:40 hen 阅读(17276) 评论(2) 推荐(0) 编辑
摘要:说明: IE: 微软的自带浏览器, 用户群最多的浏览器 火狐: 这里就作为W3C标准浏览器Padding: padding在火狐(W3C标准)和IE中的解释是不同的. IE中padding是包含在宽高中的, 火狐是不包含宽高中的. 所以在使用padding的时候不要设定其相应的宽高, 而应该由内部盒装模型去撑开此盒装模型的相应宽高示例:<div style="padding:15px;"> <div style="width:100px;height:100px;"> 我是内部盒装模型 </div> </div& 阅读全文
posted @ 2012-02-09 10:57 hen 阅读(404) 评论(0) 推荐(0) 编辑
摘要:1. input hidden 标签必须放在 一个隐藏域中 否者在ie6下容易造成布局乱掉<div style="display: none;"> <input class="mention_id" type="hidden" /></div> 阅读全文
posted @ 2011-11-21 13:37 hen 阅读(153) 评论(0) 推荐(0) 编辑
摘要:标签内文字自动换行: style= "word-break:break-all;word-wrap:break-word "文字垂直居中: vertical-align:middle;文字水平居中: text-align:center; 阅读全文
posted @ 2011-07-07 10:13 hen 阅读(240) 评论(0) 推荐(0) 编辑
摘要:CSS 控制:<style>body{ -moz-user-select:none; hutia:expression(this.onselectstart=function(){return(false)});}</style>JS 控制:onselectstart="return false"; 阅读全文
posted @ 2011-06-30 17:05 hen 阅读(2734) 评论(0) 推荐(0) 编辑
摘要:max-width:201px; max-height:136px;width:expression(this.width > 201 && this.width > this.height ? '201' : auto);height: expression(this.height > 136 ? '136' : auto); 阅读全文
posted @ 2011-05-20 08:40 hen 阅读(398) 评论(1) 推荐(0) 编辑
摘要:定义vertical-align 属性设置元素的垂直排列。继承性:No说明该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中,这个属性会设置单元格框中的单元格内容的对齐方式。JavaScript 语法CSS 属性也可通过一段 JavaScript 被动态地改变。脚本语法:object.style.verticalAlign="bottom"例子img{ vertical-align:bottom;}可能的值 属性描述 baseline默认。元素放置在父元素的基线上。sub垂直对齐文本的下标。supe 阅读全文
posted @ 2011-05-16 01:24 hen 阅读(500) 评论(0) 推荐(0) 编辑
摘要:用css 添加手状样式,鼠标移上去变小手,变小手cursor:pointer;用JS使鼠标变小手onmouseover(鼠标越过的时候)onmouseover="this.style.cursor='hand'"cursor其他取值 auto :标准光标 default :标准箭头 pointer, hand :手形光标 wait :等待光标 text :I形光标 vertical-text :水平I形光标 no-drop :不可拖动光标 not-allowed :无效光标 help :帮助光标 all-scroll :三角方向标 move :移动标 cro 阅读全文
posted @ 2011-04-29 10:51 hen 阅读(304834) 评论(0) 推荐(5) 编辑
摘要:文字,table 水平居中: 将父标签CSS设为 text-align:center;div水平居中: 父级: {TEXT-ALIGN: center;} 自身: { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; }图片居中:<HTML> <HEAD> <TITLE> New Document </TITLE> <style> .div1{ position:absolute; top: expression(document.body.scrollTop + document.body.clientH 阅读全文
posted @ 2011-04-26 09:09 hen 阅读(336) 评论(0) 推荐(0) 编辑
摘要:ul 水平,行内块放置<style type="text/css">ul.ul_inline {display: inline-block;list-style: none;border: 0;width: 350px;margin: 0;padding: 0;overflow: hidden; /* 超過範圍隱藏 */white-space: nowrap; /* 不斷行 */list-style-type:none;}ul.ul_inline li{display: inline; /* 水平排列 */}ul.ul_inline li a {display: 阅读全文
posted @ 2011-04-20 08:41 hen 阅读(2182) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示