CSS3秘笈复习:第十一章
1.text-align与vertical-align:
text-align控制水平方向的定位,关键字是left、right、center和justify。
vertical-align控制垂直方向的定位,关键字是top、baseline、middle或bottom。
两者的区别是,vertical-align不会被继承,因此只能直接用到<th>和<td>标签上。
2.控制表格单元之间的空格:CSS提供了border-spacing属性来控制这条间隙。将该属性应用到表格本身,并且如果希望删除浏览器通常会在单元格之间显示的那部分空格,则可以将border-spacing的值设置为0:
table{
border-spacing:0;
}
3.消除双边框:一个单元格的底部边框与下一个单元格的顶部边框叠加在一起,产生了一条比border值粗两倍的直线。消除双边框的最好办法是利用border-collapse属性。它接受两个值:separate和collapse。collapse选项则消除了单元间隔和双边框。
注意:如果将border-collapse属性值设置为collapse,border-spacing就将不起作用。
4.圆角:border-radius属性可以给表格添加圆角。
注意:如果将border-collapse属性设置为collapse,border-radius将不起作用。
5.给行和列定义样式:
通过nth-of-type选择器可以给奇数行和偶数行添加不同的颜色样式:
tr:nth-of-type(odd){background-color:red;}
tr:nth-of-type(even){background-color:blue;}
6.HTML提供了<colgroup>标签和<col>标签,分别表示一组组列和个别的列。表格中的每一行都包含一个<col>标签。
7.隐藏空白的单元格:在表格样式中添加:empty-cells:hide可以隐藏空白的单元格。但是使用了border-collapse属性值为collapse,浏览器将会忽略empty-cells属性。
8.html的表单元素
|
fieldset |
<fieldset>标签用来集中相关的表单问题 |
|
legend |
<legend>标签就在<fieldset>标签的html代码之后,它给一组域提供一个标签。 |
|
text fields |
<input type=”text”>、<textarea>标签都是在表单中创建文本框。这些标签允许在你的浏览器上进行统一的控制。 |
|
buttons |
表单按钮,让访问者提交表单、重填内容,或者触发一些其他的动作。 |
|
drop-down menus |
对于<select>标签创建的下拉菜单,也可以在一定程度上定义样式。 |
|
checkbox和radio button |
大部分浏览器都不允许对这些元素设定格式,但是Opera浏览器可以在复选框或按钮里面设定背景。 |
CSS3秘笈复习:第十一章的更多相关文章
- CSS3秘笈复习:十三章&十四章&十五章&十六章&十七章
第十三章 1.在使用浮动时,源代码的顺序非常重要.浮动元素的HTML必须处在要包围它的元素的HTML之前. 2.清楚浮动: (1).在外围div的底部添加一个清除元素:clear属性可以防止元素包围浮 ...
- CSS3秘笈复习:第九章&第十章
第九章 1.和链接有关的伪类: (1):link,未访问过的链接 (2):visited,已访问过的链接 (3):hover,鼠标悬停链接 (4):active,单击链接时 这四种方式一定要严格按上面 ...
- CSS3秘笈复习:第一章&第二章&第三章
第一章: 1.<cite>标签不仅可以将网页设置为斜体,还能给标题做上标记,使它便于被搜索引擎搜索到. 第二章: 1.import指令链接样式表: CSS本身有一种添加外部样式的方法:@i ...
- CSS3秘笈:第十一章
表格和表单的格式化 1.表格的各种标签提供了许多有用的“钩子”,可以再上面挂CSS样式.如果创建了<th>标签样式,那么每一个列的标题——<th>标签——看起来就有可能与其他的 ...
- CSS3秘笈复习:第六章
第六章 1.文本大写化: text-transform:uppercase; 另外三种选项是:lowercase或capitalize以及none. 2.文本修饰: text-decoration:u ...
- CSS3秘笈复习:第七章
1.边距冲突: 当元素的bottom margin碰到另一个元素的top margin可能会产生一些怪异的计算,浏览器会忽略小的那个值而使用大的值. 2.边距折叠: 假设要在警告框里插入一个标题,并且 ...
- CSS3秘笈:第七章
第七章 margin.padding和border 1.盒模型:四个属性: (1)padding:内容与其边框线之间的空间. (2)border:盒子周围的直线 (3)background-colo ...
- CSS3秘笈:第六章
第六章 文本格式化 1.font-family 属性设置字体.除了指定想要的字体之外还要使用备用字体.例如: p{ font-family:Arial ,Helvetica ,sans-serif; ...
- CSS3秘笈:第五章
第五章 层叠管理样式 1.层叠是决定哪些样式属性要被应用到某一个元素的一套规则. 2.最近的祖先样式胜出:浏览器会采用离相关标签最近的样式. 3.直接应用的样式胜出:任何直接应用于指定标签的样式都战 ...
随机推荐
- SQLServer批量更新
两种写法,暂未知道区别 1. UPDATE aSET a.resblockid = ( SELECT b.resblockId FROM yyy.dbo.yyy b WHERE a.unitId = ...
- Xcode插件推荐
deriveddata-exterminator: A magic button in Xcode to exterminate the current project's DerivedData d ...
- LeetCode 476. Number Complement
Given a positive integer, output its complement number. The complement strategy is to flip the bits ...
- java程序基础
- C#程序基础
- jQuery中操作Ajax方法小结
有时候,越深入去了解一个点,越发觉得自己无知,而之前当自己晓得一两个片面的点还洋洋自得,殊不知,这是多么讽刺 jQery对Ajax操作进行了封装,常见的 ajax()属于最底层的方法,使用频率很高的 ...
- es5 中类的2种基本实现方法
function test(){ this.a = 1; this.func = function(){ // var a = 3;下面的this 取的是上面的1,这个不影响 return this. ...
- CentOS 6.5静态IP的设置(NAT和桥接都适用)
CentOS 6.5静态IP的设置(NAT和桥接都适用) 为了方便,用Xshell来.并将IP设置为静态的.因为,在CentOS里,若不对其IP进行静态设置的话,则每次开机,其IP都是动态变化的,这样 ...
- URLEncode编码和URLDecode解码
String text1 = java.net.URLEncoder.encode("中国" ,"utf-8" ); String text2 = java.n ...
- 2.MyBatis有代理增删改
2.1 创建一个javaweb项目MyBatis_Part1,并创建如下sql脚本 create user holly identified by sys; grant dba to holly; c ...