CSS设计彻底研究
这本书不错,详细介绍了CSS的相关知识,对初学者和想进一步学习的人都有帮助。
相关笔记:
行内样式>ID样式>类样式>标记样式
font-weight:bold;
font-size:30px;
text-decoration:underline;
<em>强调标签
盒子模型:
给出2个值,前者表示上下,后者为左右
给出3个值,前者上,中间左右,后者为下
给出4个值,上,右,下,左
div 块级元素 block
span 行内元素 inline
border-style:solid;
border-width
border-color
border:2px black solid;
font-family:宋体;
text-align:center;
盒子定位:
1.static 默认,按照标准流
2.relative 相对定位
3.absolute 绝对定位
4.fixed 以游览器窗口为基准
display:inline
:block
:none
float:left;
clear:right;
position:relative;
left:30px;
top:30px;
line-height:18px;
:1.5 表示倍数
background:url(。。。.gif) no-repeat
background-image:url(...gif)
background-repeat:repeat-x;
overflow:scroll;
<!--[if lte IE6]>
<![endif]-->
border-collapse:collapse;
IE6不支持非链接元素hover伪类
onmouseover
onmouseout
CSS核心基础
第0课《CSS�
相关文档:
今天做一个功能,根据select元素选择的不同selectedIndex项,显示一个表格里指定的tr项。
首先:$("#table tr:gt(0)").css("display","none"); 这个没问题,当要显示的时候.css("display","block"),在FF中布局一下就乱掉了。试了几次都是如此,想了一下,是不是在 ......
彻底弄懂CSS盒子模式(DIV+CSS)
非常好的DIV布局原理与实例教程,对WEB标准布局有兴趣的朋友可以看看以下内容:
Web标准,彻底弄懂CSS盒子模式一:DIV布局快速入门
Web标准,彻底弄懂CSS盒子模式二:导航栏实例详解
Web标准,彻底弄懂CSS盒子模式三:浮动的表演和清除的自述[1]
Web标准,彻底弄懂CSS盒子模式三:浮动的表演和清除 ......
CSS对浏览器的兼容性有时让人很头疼,或许当你了解当中的技巧跟原理,就会觉得也不是难事,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于web2.0的过度,请尽量用xhtml格式写代码,而且DOCTYPE 影响 CSS 处理,作为W3C的标准,一定要加 DOCTYPE声名.
CSS技巧
1.div的垂直居中问题
vertical-align:middl ......
1.在页面HEAD中引入一个特殊的CSS
<link rel="stylesheet" type="text/css" href="${contextPath}/styles/print.css" media="print" />
2.在print.css中通过将页面中显示的区域DISPLAY设置为NONE,打印区域设定DISPLAY为BLOCK
另外可以加入一个特殊的CSS来控制分页效果
. ......
1.div的垂直居中问题
vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然
后插入文字,就垂直居中了。缺点是要控制内容不要换行
2. margin加倍的问题
设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。解决方
案是在这个div里面加上display:inline;
例如:
<#div ......