1.表格的制作

1、表格元素–<table>

表格中的行–<tr>

表格中的列–<td>

表格中的表头–【居中/加粗】

table标记的边框–border

table标记的宽度–width

table标记的高度–height

table标记的水平对齐方式–align

table标记的表格背景色–bgcolor

上篇文章主要介绍了CSS样式更改篇中的字体设置Font&边框Border设置，这篇文章分享列表、表格和轮廓，一起来看看吧。

1.列表List

1).列表的类型

<ul style='list-style-type:square'><li></li></ul>
none      无标记
disc      实心圆
circle    空心圆
square    实心方块
decimal   数字
none      无

本节我们来学习边框样式，主要包括如何设置边框的宽度、边框的颜色、边框的样式等。当我们给某个元素设置边框时，可以分为上下左右四个边框，既可以同时设置四个边框的样式，也可以分开设置四个边框的样式。

关于边框样式的四个属性：

border-width

border-width 属性用于设置边框的宽度，也就是边框的粗细。

常用属性值如下所示：

我们一般会使用 length 作为 border-width 属性的属性值，即设置边框的粗细为多少像素，例如 1px、2px、3px 等。border-width 属性可以同时为所有边框设置宽度，也可以单独地为每个边框设置宽度。

一、背景属性

• background-color：设置背景颜色。
• background-image：设置背景图片。
• background-repeat：设置背景重复方式。
• background-position：设置背景图位置。

在网页中，边框随处可见，任何块元素和行内元素都可以设置边框属性。例如，div元素可以设置边框，img元素也可以设置边框，table元素也可以设置边框，span元素同样也可以设置边框等等。

目标

• 设置边框的三要素
• 简写边框法
• 单独设置边框

一个元素的边框，同时设置

一、多重边框[1]

背景知识：box-shadow，outline
鉴于使用场景的多元化，多重边框的设计越来越多，以往可以借助 border-image 属性应付一下，但是这个在css 代码层面并不是很灵活。现在我们借助 box-shadow 和 outline 两个属性来分别实现多重边框。
1、box-shadow 方案
思路：利用 box-shadow 的第四个参数（扩张半径）的大小，多重投影

元素的边框 (border) 是围绕元素内容和内边距的一条或多条线。

CSS border 属性允许你规定元素边框的样式、宽度和颜色。

边框样式

border-style属性用来定义边框的样式。

border-style的值：

盒模型是CSS布局的基础，理解它的每个组成部分对于创建整洁、响应式的网页至关重要。本文将深入探讨盒模型的四个主要组成部分：边距（Margin）、边框（Border）、填充（Padding）和内容（Content），并解释它们如何共同工作来创建网页布局。

盒模型概述

在CSS中，盒模型是一种用于设计和布局的概念模型，它将HTML元素视为一个盒子。这个盒子包括了元素的内容、内边距、边框和外边距。理解盒模型对于控制元素的大小和在页面上的位置至关重要。

本次，我们来讲解应用 CSS 来装饰表格。