发表于: 2019-01-01 22:26:11

1 659


今天完成的事情:

1.学习了html的表格元素:

表格由table标签来定义,每个表格均有若干行(由tr标签定义),每行被分割为若干单元格(由td标签定义)。

字母td指标表格数据,及数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等。


2.html表格边框属性如果不定以,表格将不显示边框。


3.表格表头使用th标签进行定义。 大多数浏览器会把表头显示为粗体居中的文字。


4.bootstrap4 框架也支持表格的应用:

通过.table类来设置基础表格的样式,同个添加.table-striped类,将可以在tbody内的行上看到条纹。

.table-bordered类可以为表格添加边框,.teble-hover类可以为表格的每一行添加鼠标悬停效果。通过使用.table-dark类可以为表格添加黑色背景。

联合使用.table-dark和.table-striped类可以创建黑色的条纹表格。

联合使用.table0dark和.table-hover类可以设置黑色背景表格的鼠标悬停效果。

通过指定意义的颜色类可以为表格的行或者单元格设置颜色

类名描述
.table-primary蓝色: 指定这是一个重要的操作
.table-success绿色: 指定这是一个允许执行的操作
.table-danger红色: 指定这是可以危险的操作
.table-info浅蓝色: 表示内容已变更
.table-warning橘色: 表示需要注意的操作
.table-active灰色: 用于鼠标悬停效果
.table-secondary灰色: 表示内容不怎么重要
.table-light浅灰色,可以是表格行的背景
.table-dark深灰色,可以是表格行的背景

在bootstrap 4中,.thead-tark类用于给表格头添加黑色背景,.thead-light类用于给表格头添加灰色背景。

.table-responsive 类用于创建响应式表格:在屏幕小于992px时会创建水平滚动条,如果可视区域大于992px则不显示滚动条。


明天计划的事情:

1.使用表格元素制作最后一个页面的职业介绍部分。


遇到的困难:

1.在写第二个页面的文字部分时,每段首行的前两个文字缩进,自己用了空格来完成。

之后查了一遍html的资料,才想起来有一个文本首行缩进的功能。


收获:

1.学习了表格元素,并尝试着制作了一个表格。



返回列表 返回列表
评论

    分享到