Javaweb-01.html和css

最新推荐文章于 2024-07-09 19:50:17 发布

鸠叁

最新推荐文章于 2024-07-09 19:50:17 发布

阅读量253

点赞数

文章标签： html css 前端

本文链接：https://blog.csdn.net/edwer93/article/details/124810455

版权

1、html 学习

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-De0p73tU-1652713720130)(media/c5106bae1124db8fea545d2ab7280af3.png)]2、CSS 学习

课堂笔记：

1、B/S 软件的结构

JavaSE C/S Client Server B/S Browser Server

2、前端的开发流程

页面由三部分内容组成！

分别是内容（结构）、表现、行为。

内容（结构），是我们在页面中可以看到的数据。我们称之为内容。一般内容我们使用

html 技术来展示。

表现，指的是这些内容在页面上的展示形式。比如说。布局，颜色，大小等等。一般使用

CSS 技术实现

行为，指的是页面中元素与输入设备交互的响应。一般使用javascript 技术实现。

4、HTML 简介

Hyper Text Markup Language （超文本标记语言）简写：HTML

通过在文本文件中添加标记符，可以告诉浏览器如何显示其中的内容（如：文字如何处理，画面如何安排，图片如何显示等）

5、创建 HTML 文件。

2、在工程下创建 html 页面

第一个 html 示例：

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

6、HTML 文件的书写规范

<html> 表示整个 html 页面的开始

<head> 头信息

<title>标题</title> 标题

</head>

<body> body 是页面的主体内容页面主体内容

</body>

</html> 表示整个 html 页面的结束

Html 的代码注释

7、HTML 标签介绍

标签的格式:

<标签名>封装的数据</标签名>
标签名大小写不敏感。
标签拥有自己的属性。
1. 分为基本属性：bgcolor=“red” 可以修改简单的样式效果
2. 事件属性： οnclick=“alert(‘你好！’);” 可以直接设置事件响应后的代码。
标签又分为，单标签和双标签。
1. 单标签格式： <标签名 /> br 换行 hr 水平线
2. [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ruSSkXYx-1652713720141)(media/c5106bae1124db8fea545d2ab7280af3.png)]双标签格式: <标签名> …封装的数据…</标签名>

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Pz9S7GEw-1652713720142)(media/9c55c18a0f95fc174f725fb5e29f4dff.jpeg)]

标签的语法：

正确：<div><span>早安，尚硅谷</span></div> 错误：<div><span>早安，尚硅谷</div></span>

<hr />

正确：<div>早安，尚硅谷</div> 错误：<div>早安，尚硅谷

<hr />

正确：<br />

错误：<br>

<hr />

正确：<font color=“blue”>早安，尚硅谷</font> 错误：<font color=blue>早安，尚硅谷</font> 错误：<font color>早安，尚硅谷</font>

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-BQuGDTpr-1652713720142)(media/c5106bae1124db8fea545d2ab7280af3.png)]<hr />

正确： <br/>

错误： -->

<hr />

注意事项：

html 代码不是很严谨。有时候标签不闭合，也不会报错。

8、常用标签介绍文档：w3cschool.CHM

、font 字体标签

需求 1：在网页上显示我是字体标签，并修改字体为宋体，颜色为红色。

、特殊字符

需求 1：把 <br> 换行标签变成文本转换成字符显示在页面上常用特殊字符表：

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-1g58pCaR-1652713720144)(media/50d450037a22da0313d494b37417c94b.jpeg)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-XKdk5kkS-1652713720144)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]

、标题标签

标题标签是 h1 到 h6

需求 1：演示标题 1 到标题 6 的

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-HFqESrAd-1652713720145)(media/c5106bae1124db8fea545d2ab7280af3.png)]、超链接（ **** 重点，必须掌握 * ）

在网页中所有点击之后可以跳转的内容都是超连接需求 1：普通的超连接。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-YiW1ytx4-1652713720145)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]

、列表标签

无序列表、有序列表

需求 1：使用无序，列表方式，把东北 F4，赵四，刘能，小沈阳，宋小宝，展示出来

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-FqJLFpgp-1652713720145)(media/c5106bae1124db8fea545d2ab7280af3.png)]、img 标签

img 标签可以在 html 页面上显示图片。

需求 1：使用 img 标签显示一张美女的照片。并修改宽高，和边框属性

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-NycoJ6Hk-1652713720146)(media/c5106bae1124db8fea545d2ab7280af3.png)][外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-dR32n3ht-1652713720146)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-L05M5FTx-1652713720146)(media/1b354aa76246925b71cc88fc1d5268dc.jpeg)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Yeii7ZNL-1652713720146)(media/c5106bae1124db8fea545d2ab7280af3.png)]需求 1：做一个带表头的，三行，三列的表格，并显示边框

需求 2：修改表格的宽度，高度，表格的对齐方式，单元格间距。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-6slsdvFs-1652713720147)(media/c5106bae1124db8fea545d2ab7280af3.png)][外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-6VN7gHFl-1652713720147)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-JfcREUrn-1652713720147)(media/df57ec4156513d9cdf96356ee0a74384.jpeg)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-wq2WDAMn-1652713720148)(media/c5106bae1124db8fea545d2ab7280af3.png)]需求 1：新建一个五行，五列的表格，第一行，第一列的单元格要跨两列，第二行第一列的单元格跨两行，第四行第四列的单元格跨两行两列。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-kymFeq2w-1652713720148)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Jv2D4rUt-1652713720148)(media/c5106bae1124db8fea545d2ab7280af3.png)]、了解 iframe 框架标签 (内嵌窗口)

ifarme 标签它可以在一个 html 页面上,打开一个小窗口,去加载一个单独的页面.

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-N8eku7s5-1652713720149)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]

、表单标签（ ***** 重点，必须掌握 * ）

什么是表单?

表单就是 html 页面中,用来收集用户信息的所有元素集合.然后把这些信息发送给服务器.

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-jRoBrBDN-1652713720149)(media/ed9114fead50ce0b0ba28ecbfc9b6f09.jpeg)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ehXHibTD-1652713720149)(media/c5106bae1124db8fea545d2ab7280af3.png)]需求 **1:**创建一个个人信息注册的表单界面。包含用户名，密码，确认密码。性别（单选），兴趣爱好（多选），国籍（下拉列表）。

隐藏域，自我评价（多行文本域）。重置，提交。

表单的显示**😗*

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Rf8A5FiB-1652713720150)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]input type=checkbox 是复选框 checked="checked"表示默认选中input type=reset 是重置按钮 value 属性修改按钮上的文本input type=submit 是提交按钮 value 属性修改按钮上的文本input type=button 是按钮 value 属性修改按钮上的文本input type=file 是文件上传域

input type=hidden 是隐藏域当我们要发送某些信息，而这些信息，不需要用户参与，就可以使用隐藏域（提交的时候同时发送给服务器）

select 标签是下拉列表框

option 标签是下拉列表框中的选项 selected="selected"设置默认选中

textarea 表示多行文本输入框（起始标签和结束标签中的内容是默认值）

rows 属性设置可以显示几行的高度

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-f1IxevNd-1652713720150)(media/c5106bae1124db8fea545d2ab7280af3.png)]cols 属性设置每行可以显示几个字符宽度

–>

<form>

用户名称：<input type=“text” value=“默认值”/><br/> 用户密码：<input type=“password” value=“abc”/><br/> 确认密码：<input type=“password” value=“abc”/><br/>

性别：<input type=“radio” name=“sex”/>男<input type=“radio” name=“sex” checked=“checked” />女<br/>

兴趣爱好：<input type=“checkbox” checked=“checked” />Java<input type=“checkbox” />JavaScript<input type=“checkbox” />C++<br/>

国籍：<select>

<option>–请选择国籍–</option>

<option selected=“selected”>中国</option>

<option>美国</option>

<option>小日本</option>

</select><br/>

自我评价：<textarea rows=“10” cols=“20”>我才是默认值</textarea><br/>

<input type=“reset” value=“abc” />

<input type=“submit”/>

</form>

</body>

表单格式化**😗*

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-JKxtOhwY-1652713720150)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]<td> 用户密码：</td>

</tr>

<tr>

</tr>

<tr>

<td>

<input type=“radio” name=“sex”/>男

<input type=“radio” name=“sex” checked=“checked” /> 女

</td>

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-FAbLxcGZ-1652713720151)(media/c5106bae1124db8fea545d2ab7280af3.png)]</tr>

<tr>

<td>

<input type=“checkbox” checked=“checked” />Java

<input type=“checkbox” />JavaScript

<input type=“checkbox” />C++

</td>

</tr>

<tr>

<td>

<select>

<option>–请选择国籍–</option>

<option selected=“selected”>中国</option>

<option>美国</option>

<option>小日本</option>

</select>

</td>

</tr>

<tr>

<td><textarea rows=“10” cols=“20”>我才是默认值</textarea></td>

</tr>

<tr>

<td align=“center”><input type=“submit”/></td>

</tr>

</table>

</form>

</body>

表单提交细节**😗*

<body>

<!–

form 标签是表单标签

action 属性设置提交的服务器地址

method 属性设置提交的方式 GET(默认值)或 POST

表单提交的时候，数据没有发送给服务器的三种情况：

1、表单项没有 name 属性值

2、单选、复选（下拉列表中的 option 标签）都需要添加 value 属性，以便发送给服务器

3、表单项不在提交的 form 标签中

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-hoMUxXGG-1652713720151)(media/c5106bae1124db8fea545d2ab7280af3.png)]GET 请求的特点是：

1、浏览器地址栏中的地址是：action 属性[+?+请求参数] 请求参数的格式是：name=value&name=value

2、不安全

3、它有数据长度的限制

–>

POST 请求的特点是：

1、浏览器地址栏中只有 action 属性值

2、相对于 GET 请求要安全

3、理论上没有数据长度的限制

<form action=“http://localhost:8080” method=“post”>

<input type=“hidden” name=“action” value=“login” />

<h1 align=“center”>用户注册</h1>

<table align=“center”>

<tr>

<td>

<input type=“text” name=“username” value=“默认值”/>

</td>

</tr>

<tr>

</tr>

<tr>

<td>

<input type=“radio” name=“sex” value=“boy”/>男

<input type=“radio” name=“sex” checked=“checked” value=“girl” />女

</td>

</tr>

<tr>

<td>

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-WiaAW5Oe-1652713720151)(media/c5106bae1124db8fea545d2ab7280af3.png)][外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-yH4H4siL-1652713720152)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]其他标签

需求 1：div、span、p 标签的演示

HTML 最后的练习 2,：创建登录的表单，包含用户名，密码框输入。并结合 table 标签排版。让它看上去整齐点

9、CSS 技术文档**:CSS2.0.chm**

、CSS 技术介绍

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Q4bhLpFk-1652713720152)(media/c5106bae1124db8fea545d2ab7280af3.png)]CSS 是「层叠样式表单」。是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。
、CSS 语法规则：

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Q4d4OSKM-1652713720152)(media/94995e73e6445bd69c7e39960361493b.jpeg)]

选择器：浏览器根据“选择器”决定受CSS 样式影响的HTML 元素（标签）。

属性 (property) 是你要改变的样式名，并且每个属性都有一个值。属性和值被冒号分开，并由花括号包围，这样就组成了一个完整的样式声明（declaration），例如：p {color: blue}

多个声明：如果要定义不止一个声明，则需要用分号将每个声明分开。虽然最后一条声明的最后可以不加分号(但尽量在每条声明的末尾都加上分号)

例如：

color:red;

font-size:30px;

}

注：一般每行只描述一个属性

CSS 注释：/*注释内容*/

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ofrrEbJX-1652713720153)(media/c5106bae1124db8fea545d2ab7280af3.png)]、CSS 和 HTML 的结合方式
1. 、第一种：

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

需求 1：分别定义两个 div、span 标签，分别修改每个 div 标签的样式为：边框 1 个像素，实线，红色。

问题：这种方式的缺点？

如果标签多了。样式多了。代码量非常庞大。
1. 可读性非常差。
  1. Css 代码没什么复用性可方言。

、第二种：

在 head 标签中，使用 style 标签来定义各种自己需要的 css 样式。格式如下：

xxx {

Key : value value;

}

需求 1：分别定义两个 div、span 标签，分别修改每个 div 标签的样式为：边框 1 个像素，实线，红色。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-OAFpCSis-1652713720153)(media/c5106bae1124db8fea545d2ab7280af3.png)]<div>div 标签 1</div>

Css 注释 /* 这是 css 的代码注释 */

问题：这种方式的缺点。

只能在同一页面内复用代码，不能在多个页面中复用 css 代码。
维护起来不方便，实际的项目中会有成千上万的页面，要到每个页面中去修改。工作量太大了。

、第三种：

把 css 样式写成一个单独的 css 文件，再通过 link 标签引入即可复用。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Ap62k1Ia-1652713720153)(media/c5106bae1124db8fea545d2ab7280af3.png)]使用 html 的 <link rel=“stylesheet” type=“text/css” href=“./styles.css” /> 标签导入 css 样式文件。

1、css 文件内容：

html 文件代码：

、CSS 选择器

、标签名选择器

标签名选择器的格式是：标签名{

属性：值;

}

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-rVVdZ2je-1652713720154)(media/c5106bae1124db8fea545d2ab7280af3.png)]标签名选择器，可以决定哪些标签被动的使用这个样式。

需求 1：在所有 div 标签上修改字体颜色为蓝色，字体大小 30 个像素。边框为 1 像素黄色实线。并且修改所有 span 标签的字体颜色为黄色，字体大小 20 个像素。边框为 5 像素蓝色虚线。

示例代码：

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-RyZfnYUD-1652713720154)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]

、id 选择器

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-cXzxu6IR-1652713720154)(media/c5106bae1124db8fea545d2ab7280af3.png)]id 选择器的格式是：

#id 属性值{

属性：值;

}

id 选择器，可以让我们通过 id 属性选择性的去使用这个样式。

需求 1：分别定义两个 div 标签，

第一个 div 标签定义 id 为 id001 ，然后根据 id 属性定义 css 样式修改字体颜色为蓝色，字体大小 30 个像素。边框为 1 像素黄色实线。

第二个 div 标签定义 id 为 id002 ，然后根据 id 属性定义 css 样式修改的字体颜色为红色，字体大小 20 个像素。边框为 5 像素蓝色点线。

示例代码：

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-TApaiY5h-1652713720155)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-4pW0egT7-1652713720155)(media/c5106bae1124db8fea545d2ab7280af3.png)]、class 选择器（类选择器）

class 类型选择器的格式是：

**.**class 属性值{

属性：值;

}

class 类型选择器，可以通过 class 属性有效的选择性地去使用这个样式。

需求 1：修改 class 属性值为 class01 的 span 或 div 标签，字体颜色为蓝色，字体大小 30 个像素。边框为 1 像素黄色实线。需求 2：修改 class 属性值为 class02 的 div 标签，字体颜色为灰色，字体大小 26 个像素。边框为 1 像素红色实线。

<div class=“class01”>div 标签 class01</div>

<span class=“class01”>span 标签 class01</span>

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-WhQt3rSN-1652713720155)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]<!DOCTYPE html>

<html>

<head>

<meta charset=“UTF-8”>

<title>class 类型选择器</title>

<style type=“text/css”>

.class01{

color: blue; font-size: 30px;

border: 1px solid yellow;

}

.class02{

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-6IzJc2rN-1652713720156)(media/c5106bae1124db8fea545d2ab7280af3.png)]color: grey; font-size: 26px;

border: 1px solid red;

}

</style>

</head>

<body>

<!–

–>

<div class=“class02”>div 标签 class01</div>

<div class=“class02”>div 标签</div>

<span class=“class02”>span 标签 class01</span>

<span>span 标签 2</span>

</body>

</html>

、组合选择器

组合选择器的格式是：

选择器 1，选择器 2，选择器 n{

属性：值;

}

组合选择器可以让多个选择器共用同一个 css 样式代码。

<div class=“class01”>div 标签 class01</div> <br />

需求 1：修改 class=“class01” 的div 标签和 id=“id01” 所有的 span 标签，字体颜色为蓝色，字体大小 20 个像素。边框为 1 像素黄色实线。

示例代码：

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-d7m7r7pz-1652713720156)(media/c5106bae1124db8fea545d2ab7280af3.png)]、常用样式：

1、字体颜色color：red；

颜色可以写颜色名如：black, blue, red, green 等

颜色也可以写 rgb 值和十六进制表示值：如 rgb(255,0,0)，#00F6DE，如果写十六进制值必须加#

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-v9FzBD89-1652713720156)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]

2、宽度

width:19px;

宽度可以写像素值：19px；也可以写百分比值：20%；

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-xEeXGIWj-1652713720161)(media/c5106bae1124db8fea545d2ab7280af3.png)]3、高度

height:20px;

高度可以写像素值：19px；也可以写百分比值：20%；

4、背景颜色

background-color:#0F2D4C

4、字体样式：

color：#FF0000；字体颜色红色font-size：20px; 字体大小

5、红色 1 像素实线边框

border：1px solid red;

7、DIV 居中

margin-left: auto; margin-right: auto;

8、文本居中：

text-align: center;

9、超连接去下划线

text-decoration: none;

10、表格细线

table {

border: 1px solid black; /*设置边框*/ border-collapse: collapse; /*将边框合并*/

}

td,th {

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-oKOOdO56-1652713720162)(media/c5106bae1124db8fea545d2ab7280af3.png)]border: 1px solid black; /*设置边框*/

}

11、列表去除修饰

ul {

list-style: none;

}

示例代码：

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-FF5XbLrm-1652713720162)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]border: 1px red solid;

}

text-decoration: none;

}

ul{

}

list-style: none;

</style>

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-eUwqnaCq-1652713720163)(media/c5106bae1124db8fea545d2ab7280af3.png)]</head>

<body>

<ul>

</ul>

<table>

<tr>

</tr>

</table>

<a href="http://www.baidu.com">百度</a>

<div>我是 div 标签</div>

</body>

</html>

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-iPAJP3ex-1652713720163)(media/c5106bae1124db8fea545d2ab7280af3.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-dJbn9iuw-1652713720163)(media/c5106bae1124db8fea545d2ab7280af3.png)][外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-aVR9KRbj-1652713720164)(media/a374acb97ce237879ffa278d8aa8058c.jpeg)]
id**;

}

text-decoration: none;

}

ul{

}

list-style: none;

</style>

[外链图片转存中…(img-eUwqnaCq-1652713720163)]</head>

<body>

<ul>

</ul>

<table>

<tr>

</tr>

</table>

<a href="http://www.baidu.com">百度</a>

<div>我是 div 标签</div>

</body>

</html>

[外链图片转存中…(img-iPAJP3ex-1652713720163)]

[外链图片转存中…(img-dJbn9iuw-1652713720163)][外链图片转存中…(img-aVR9KRbj-1652713720164)]

鸠叁

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Javaweb-01.html和css

1、html 学习[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-De0p73tU-1652713720130)(media/c5106bae1124db8fea545d2ab7280af3.png)]2、CSS 学习课堂笔记：1、B/S 软件的结构JavaSE C/S Client Server B/S Browser Server2、前端的开发流程页面由三部分内容组成！分别是内容（结构）、表现、行为。内容（结构），是我们在页面中可以看到的数据。我们称之为内容
复制链接

扫一扫