2025-11-02 01:17:39 编程来源：ZONE.CI 全球网 0 阅读模式

1、B/S 软件的结构
2、前端的开发流程
3、网页的组成部分
4、HTML 简介
5、创建 HTML 文件。
6、HTML 文件的书写规范
7、HTML 标签介绍
8、常用标签介绍
9、CSS 技术
- 9.1、CSS 技术介绍
- 9.2、CSS 语法规则：
- 9.3、CSS 和 HTML 的结合方式
  - 9.3.1、第一种：
  - 9.3.2、第二种：
  - 9.3.3、第三种：
- 9.4、CSS 选择器
  - 9.4.1、标签名选择器
  - 9.4.2、id 选择器
  - 9.4.3、class 选择器（类选择器）
  - 9.4.4、组合选择器

1、B/S 软件的结构

QQ截图20220226225115.png

2、前端的开发流程

QQ截图20220226225154.png

3、网页的组成部分

页面由三部分内容组成！分别是内容（结构）、表现、行为。内容（结构），是我们在页面中可以看到的数据。我们称之为内容。一般内容我们使用html 技术来展示。表现，指的是这些内容在页面上的展示形式。比如说。布局，颜色，大小等等。一般使用CSS 技术实现行为，指的是页面中元素与输入设备交互的响应。一般使用 javascript 技术实现。

4、HTML 简介

Hyper Text Markup Language （超文本标记语言）简写：HTML HTML 通过标签来标记要显示的网页中的各个部分。网页文件本身是一种文本文件，通过在文本文件中添加标记符，可以告诉浏览器如何显示其中的内容（如：文字如何处理，画面如何安排，图片如何显示等）

5、创建 HTML 文件。

注：Java 文件是需要先编译，再由 java 虚拟机跑起来。但 HTML 文件它不需要编译，直接由浏览器进行解析执行。

6、HTML 文件的书写规范

表示整个 html 页面的开始头信息标题 body 是页面的主体内容页面主体内容表示整个 html 页面的结束

7、HTML 标签介绍

1.标签的格式: <标签名>封装的数据</标签名> 2.标签名大小写不敏感。 3.标签拥有自己的属性。 i. 分为基本属性：bgcolor=“red” 可以修改简单的样式效果 ii. 事件属性： onclick=”alert(‘你好！’);” 可以直接设置事件响应后的代码。 4.标签又分为，单标签和双标签。 i. 单标签格式： <标签名 /> br 换行 hr 水平线 ii. 双标签格式: <标签名> …封装的数据…</标签名> QQ截图20220226225914.png

8、常用标签介绍

在 JavaSE 中路径也分为相对路径和绝对路径. 相对路径:从工程名开始算 绝对路径:盘符:/目录/文件名 在 web 中路径分为相对路径和绝对路径两种 相对路径: . 表示当前文件所在的目录 .. 表示当前文件所在的上一级目录 文件名表示当前文件所在目录的文件,相当于 ./文件名 ./ 可以省略 绝对路径: 正确格式是: http://ip:port/工程名/资源路径 错误格式是: 盘符:/目录/文件名

9、CSS 技术

9.1、CSS 技术介绍

CSS 是「层叠样式表单」。是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

9.2、CSS 语法规则：

QQ截图20220226230615.png 选择器：浏览器根据“选择器”决定受 CSS 样式影响的 HTML 元素（标签）。属性 (property) 是你要改变的样式名，并且每个属性都有一个值。属性和值被冒号分开，并由花括号包围，这样就组成了一个完整的样式声明（declaration），例如：p {color: blue} 多个声明：如果要定义不止一个声明，则需要用分号将每个声明分开。虽然最后一条声明的最后可以不加分号(但尽量在每条声明的末尾都加上分号)

9.3、CSS 和 HTML 的结合方式

9.3.1、第一种：

在标签的 style 属性上设置”key:value value;”，修改标签样式。

9.3.2、第二种：

在 head 标签中，使用 style 标签来定义各种自己需要的 css 样式。格式如下： xxx {Key : value value; } 问题：这种方式的缺点。 1.只能在同一页面内复用代码，不能在多个页面中复用 css 代码。 2.维护起来不方便，实际的项目中会有成千上万的页面，要到每个页面中去修改。工作量太大了。