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秘笈复习:第十一章的更多相关文章

  1. CSS3秘笈复习:十三章&十四章&十五章&十六章&十七章

    第十三章 1.在使用浮动时,源代码的顺序非常重要.浮动元素的HTML必须处在要包围它的元素的HTML之前. 2.清楚浮动: (1).在外围div的底部添加一个清除元素:clear属性可以防止元素包围浮 ...

  2. CSS3秘笈复习:第九章&第十章

    第九章 1.和链接有关的伪类: (1):link,未访问过的链接 (2):visited,已访问过的链接 (3):hover,鼠标悬停链接 (4):active,单击链接时 这四种方式一定要严格按上面 ...

  3. CSS3秘笈复习:第一章&第二章&第三章

    第一章: 1.<cite>标签不仅可以将网页设置为斜体,还能给标题做上标记,使它便于被搜索引擎搜索到. 第二章: 1.import指令链接样式表: CSS本身有一种添加外部样式的方法:@i ...

  4. CSS3秘笈:第十一章

    表格和表单的格式化 1.表格的各种标签提供了许多有用的“钩子”,可以再上面挂CSS样式.如果创建了<th>标签样式,那么每一个列的标题——<th>标签——看起来就有可能与其他的 ...

  5. CSS3秘笈复习:第六章

    第六章 1.文本大写化: text-transform:uppercase; 另外三种选项是:lowercase或capitalize以及none. 2.文本修饰: text-decoration:u ...

  6. CSS3秘笈复习:第七章

    1.边距冲突: 当元素的bottom margin碰到另一个元素的top margin可能会产生一些怪异的计算,浏览器会忽略小的那个值而使用大的值. 2.边距折叠: 假设要在警告框里插入一个标题,并且 ...

  7. CSS3秘笈:第七章

    第七章  margin.padding和border 1.盒模型:四个属性: (1)padding:内容与其边框线之间的空间. (2)border:盒子周围的直线 (3)background-colo ...

  8. CSS3秘笈:第六章

    第六章  文本格式化 1.font-family 属性设置字体.除了指定想要的字体之外还要使用备用字体.例如: p{ font-family:Arial ,Helvetica ,sans-serif; ...

  9. CSS3秘笈:第五章

    第五章  层叠管理样式 1.层叠是决定哪些样式属性要被应用到某一个元素的一套规则. 2.最近的祖先样式胜出:浏览器会采用离相关标签最近的样式. 3.直接应用的样式胜出:任何直接应用于指定标签的样式都战 ...

随机推荐

  1. 开子线程下载图片,回到主线程刷新UI步骤

    -(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event { [NSThread detachN ...

  2. C#扩充类

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  3. Objective-C Runtime 运行时之五:协议与分类(转载)

    Objective-C中的分类允许我们通过给一个类添加方法来扩充它(但是通过category不能添加新的实例变量),并且我们不需要访问类中的代码就可以做到. Objective-C中的协议是普遍存在的 ...

  4. qwt的安装与使用

    qwt简介 QWT,全称是Qt Widgets for Technical Applications,是一个基于LGPL版权协议的开源项目, 可生成各种统计图. 具体介绍,可参看官方网址:http:/ ...

  5. strut2配置文件属性介绍

    mystruts.xml配置文件属性介绍 1.package标签的中的namespace属性 <package name="default" extends="st ...

  6. Vimperator技巧

    Vimperator技巧 什么是Vimperator?Firefox的一个插件,模拟vim操作. 1. 用]]打开"下一页"链接,[[打开"上一页"Vimper ...

  7. 2、表单form

    只要使用input,就用form,使用方法是在所有的input之外加一个总的form双标签 切记给每个input都加name,提交表单时同时会提交name属性 input可以做的事:文本框.密码框.单 ...

  8. 通过反射获取所有的Action 一般用于权限管理

    public IList<ActionPermission> GetAllActionByAssembly() { var result = new List<ActionPermi ...

  9. 4天html总结

  10. centos 安装cacti监控

    CentOS 6下Cacti搭建文档 安装依赖关系 yum -y install mysql-devel httpd php php-pdo php-snmp php-mysql lm_sensors ...