HTML与CSS基础教程:类选择符与网页框架
需积分: 0 119 浏览量
更新于2024-07-11
收藏 2.86MB PPT 举报
"类选择符-第1章1.2实验指导-Web编程技术"
本实验指导主要关注Web编程中的类选择符以及HTML和CSS的基础应用。类选择符是CSS中用于选择和应用样式的机制,它使得我们可以将特定的样式规则应用到HTML文档中的多个元素上。
首先,类选择符的使用方式是在`<STYLE>`标签内定义一个`.类名`,如`.LITTLERED`或`.LITTLEGREEN`,然后在HTML元素中通过`CLASS`属性引用这个类名,如`<DIV CLASS="LITTLERED">`或`<SPAN CLASS="LITTLEGREEN">`。在这个案例中,`.LITTLERED`定义了文本颜色为红色,字体大小为18像素,而`.LITTLEGREEN`则定义了文本颜色为绿色,同样字体大小为18像素。通过这种方式,我们可以分别对不同的HTML元素应用这些样式。
实验指导涵盖了HTML的基本框架,包括HTML文档的组成部分:头部(`<head>`)、眼睛(`<title>`)、身体(`<body>`)以及整个HTML结构的外围标签`<html>`。头部通常用来放置元数据,如样式表(CSS)和脚本(JavaScript)。眼睛即页面标题,显示在浏览器顶部。身体部分包含用户在页面上实际看到的内容。
HTML网页框架的构成包括:
1. 头部(`<head>`):用于存储元信息,如文档标题(`<title>`)。
2. 眼睛(`<title>`):定义页面的标题,显示在浏览器的标题栏。
3. 身体(`<body>`):存放实际可见的网页内容。
4. 整体框架(`<html>`):包围整个HTML文档。
此外,实验还涉及HTML的常用标记元素,如字体标记(`<FONT>`),用于改变文本的字体、大小和颜色。在案例2-03.htm中,使用了`<FONT>`标签设置了字体为隶书,大小为5,颜色为蓝色,展示了一段文本。
HTML的其他常用标记元素包括:
1. 图片标记(`<img>`):插入图像到网页。
2. 超级链接(`<a>`):创建可点击的链接。
3. 列表(`<ul>`、`<ol>`、`<li>`):无序列表和有序列表。
4. 表格(`<table>`、`<tr>`、`<td>`):用于组织数据。
5. 表单(`<form>`、`<input>`、`<button>`等):用于用户输入和交互。
除了HTML,实验还涵盖了CSS的基础使用,以及JavaScript的基础概念,如变量、数组、表达式、运算符、流程控制语句,以及函数、内置对象、浏览器对象层次和DOM模型的建立和使用。这些知识是Web开发中不可或缺的部分,它们共同协作创建出动态、交互性强的网页。通过实验指导,学生可以逐步掌握Web编程的核心技能。
2024-03-21 上传
2023-06-28 上传
2023-06-28 上传
2023-08-24 上传
2023-05-10 上传
2023-05-10 上传
2023-07-14 上传
2023-12-21 上传
四方怪
- 粉丝: 28
- 资源: 2万+
最新资源
- WPF渲染层字符绘制原理探究及源代码解析
- 海康精简版监控软件:iVMS4200Lite版发布
- 自动化脚本在lspci-TV的应用介绍
- Chrome 81版本稳定版及匹配的chromedriver下载
- 深入解析Python推荐引擎与自然语言处理
- MATLAB数学建模算法程序包及案例数据
- Springboot人力资源管理系统:设计与功能
- STM32F4系列微控制器开发全面参考指南
- Python实现人脸识别的机器学习流程
- 基于STM32F103C8T6的HLW8032电量采集与解析方案
- Node.js高效MySQL驱动程序:mysqljs/mysql特性和配置
- 基于Python和大数据技术的电影推荐系统设计与实现
- 为ripro主题添加Live2D看板娘的后端资源教程
- 2022版PowerToys Everything插件升级,稳定运行无报错
- Map简易斗地主游戏实现方法介绍
- SJTU ICS Lab6 实验报告解析