HTML页面属性：有序列表与列表样式

需积分: 3 199 浏览量更新于2024-08-16 收藏 1.15MB PPT 举报

该资源主要介绍了网页制作中的页面属性，特别是HTML中的列表类型以及相关属性，包括背景颜色、背景图片、文本的项目列表（有序列表、无序列表、缩进式列表）、设置页面边距、文字属性、链接和标题等基本概念。网页制作中的页面属性是构建网页视觉效果和布局的关键部分。以下是对这些知识点的详细说明： 1. **背景颜色**：通过在HTML中使用`<body>`标签内的`bgcolor`属性，可以设置网页的背景颜色。例如，`<body bgcolor="blue">`将背景设为蓝色。在现代网页设计中，更常见的是使用CSS来设置背景颜色，如`body { background-color: blue; }`。 2. **背景图片**：可以使用CSS的`background-image`属性为页面设置背景图片，例如`body { background-image: url("image.jpg"); }`。同时，还可以通过`background-repeat`, `background-position`和`background-size`等属性控制图片的重复、位置和大小。 3. **文本的项目列表**： - **有序列表(OL)**：使用`<ol>`标签创建有序列表，每个列表项用`<li>`标签包裹。默认数字排序，可以通过`type`属性更改排序方式，如`type="a"`表示小写字母排序，`type="A"`表示大写字母排序，`type="i"`和`type="I"`则为罗马数字排序。 - **无序列表(UL)**：使用`<ul>`标签创建无序列表，通常以圆点表示。`<li>`标签同样用于列表项。可以通过`type`属性改变列表符号，如`type="circle"`（空心圆点），`type="square"`（实心正方形），`type="disc"`（实心圆点）。 - **缩进式列表(DL)**：使用`<dl>`标签创建定义列表，`<dt>`定义术语，`<dd>`定义术语的描述。 4. **设置页面的边距**：在CSS中，可以使用`margin`属性设置页面或元素的外边距，例如`body { margin: 20px; }`将页面边距设为20像素。 5. **设置文字的属性**：可以使用CSS控制文字的颜色、大小、字体等。例如，`color`属性设置文字颜色，`font-size`设置字体大小，`font-family`指定字体。 6. **链接(A)**：使用`<a>`标签创建超链接，如`<a href="http://www.example.com">链接文本</a>`。`href`属性定义链接的目标地址。 7. **标题(H1-H6)**：`<h1>`到`<h6>`标签用于创建不同级别的标题，`<h1>`是最高级别，`<h6>`是最小级别。此外，HTML中的其他基本标记和语法包括： - **段落(P)**：`<p>`标签用于创建段落。 - **换行(BR)**：`<br>`是换行标签，用于在文本中插入一个换行。 - **水平线(HR)**：`<hr>`标签插入一条水平线。 - **字体样式**：`<b>`（加粗），`<i>`（斜体），`<u>`（下划线）。 - **字体粗细(BIG, SMALL)**：`<big>`使文字变大，`<small>`使文字变小。 - **分区显示(DIV)**：`<div>`标签用于分组HTML元素，便于应用样式。 - **段落标题(H1-H6)**：用于创建不同层次的标题，常用于文档结构化。 - **列表(OL, UL, LI)**：有序列表、无序列表和列表项。 HTML语法基本遵循开始标记和结束标记的模式，如`<tag>`...`</tag>`。某些标记如`<br>`和`<img>`是空标记，没有结束标签。理解并熟练运用这些基本元素和属性，可以帮助开发者创建功能完整、布局美观的网页。

巴黎巨星岬太郎

粉丝: 18
资源: 2万+

HTML页面属性：有序列表与列表样式

天天生鲜前端页面-网页制作代码类资源

HTML5培训技术分享 定位属性、列表的高级应用及带有图片列表的网页制作（中）

网页设计与制作-网页制作语言HTML.pptx

网页设计与制作任务2-网页的基本页面实现.doc

《计算机应用基础2-网页制作》(完整).pdf

《计算机应用基础2-网页制作》(完整)资料.pdf

HTML5培训技术分享 定位属性、列表的高级应用及带有图片列表的网页制作（下）

HTML5培训技术分享 定位属性、列表的高级应用及带有图片列表的网页制作（上）

网页制作指南：页面属性与HTML基础

网页制作：掌握页面属性与特殊符号的应用

最新资源

HTML5培训技术分享定位属性、列表的高级应用及带有图片列表的网页制作（中）

HTML5培训技术分享定位属性、列表的高级应用及带有图片列表的网页制作（下）

HTML5培训技术分享定位属性、列表的高级应用及带有图片列表的网页制作（上）