Java Web --HTML(尚硅谷2022版Javaweb)

最新推荐文章于 2024-06-26 15:06:20 发布
最新推荐文章于 2024-06-26 15:06:20 发布
阅读量503 收藏 2
点赞数 1
分类专栏： JavaWeb 文章标签： 前端 java
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ZgaoYi/article/details/123702208
版权 
<html>
	<head>
		<title>这是我的第一个网页</title>
		<meta charset="UTF-8">
	</head>
	<body>
		<!--
		HELLO WORLD!<br/>你好，HTML！
		<p>这里是一个段落</p>
		<p>这里是第二个段落</p>
		<img src="D:\sgg2021\0927_javaweb\1109\02.代码\imgs\girl.jpg" width="57" height="73" alt="这里是一张图片"/>
		<h1>标题一</h1>
		<h2>标题一</h2>
		<h3>标题一</h3>
		<h4>标题一</h4>
		<h5>标题一</h5>
		<h6>标题一</h6>
		-->
		武林高手排行榜:
		<ol type="i" start="3">
			<li>扫地僧</li>
			<li>萧远山</li>
			<li>慕容博</li>
			<li>虚竹</li>
			<li>阿紫</li>
		</ol>
		武林大会人员名单：
		<ul type="circle">
			<li>乔峰</li>
			<li>阿朱</li>
			<li>马夫人</li>
			<li>白世镜</li>
		</ul>

		你是<b><i><u>喜欢</u></i></b>是<b>甜</b>月饼还是<i>咸</i><u>月饼</u>？
		<br/>

		水分子的化学式： H<sub>2</sub>O <br/>
		氧气的化学式： O<sup>2</sup><br/>

		5&lt;10
		10&gt;5
		5&le;10
		10&ge;5
		注册商标 &reg;
		版权符号 &copy;

		<span>赵又廷</span>，夺妻之仇。

		<a href="http://www.baidu.com" target="_self">百度一下</a>




	</body>
</html>

<!--
1)
html语言是解释型语言，不是编译型
浏览器是容错的

2)
html页面中由一对标签组成：<html></html>
<html> 称之为 开始标签
</html>称之为 结束标签
3)
title 表示网页的标题
4)
可以在meta标签中设置编码方式
5)
<br/>表示换行 。br标签是一个单标签。单标签：开始标签和结束标签是同一个，斜杠放在单词后面
6)
p 表示段落标签
7)
img 标签图片标签
	src属性表示图片文件的路径
	width和height表示图片的大小
	alt表示图片的提示
8)
路径的问题：
	1. 相对路径
	2. 绝对路径
9)
h1~h6 : 标题标签
10)
列表标签:
- ol 有序列表
	start 表示从*开始，type 显示的类型：A a I i 1(deafult)
- ul 无序列表
	type disc(default) , circle , square
11) u 下划线 b 粗体  i 斜体

12) 上标 sup   下标 sub

13) HTML中的实体： 小于号 &lt; 大于等于号 &ge; 版权 &copy;

14) span 不换行的块标记

15) a 表示超链接
		href 链接的地址
		target:
			_self 在本窗口打开
			_blank 在一个新窗口打开
			_parent 在父窗口打开
			_top  在顶层窗口打开

16) div 层
-->

在这里插入图片描述

<html>
	<head>
		<title>表格标签的学习</title>
		<meta charset="UTF-8">
		
	</head>
	<body>
		<table border="1" width="600" cellspacing="0" cellpadding="4">
			<tr align="center">
				<th>姓名</th>
				<th>门派</th>
				<th>成名绝技</th>
				<th>内功值</th>
			</tr>
			<tr align="center">
				<td>乔峰</td>
				<td>丐帮</td>
				<td>少林长拳</td>
				<td>5000</td>
			</tr>
			<tr align="center">
				<td>虚竹</td>
				<td>灵鹫宫</td>
				<td>北冥神功</td>
				<td>15000</td>
			</tr>
			<tr align="center">
				<td>扫地僧</td>
				<td>少林寺</td>
				<td>七十二绝技</td>
				<td>未知</td>
			</tr>
		</table>
		<hr/>
		<table border="1" cellspacing="0" cellpadding="4" width="600">
			<tr>
				<th>名称</th>
				<th>单价</th>
				<th>数量</th>
				<th>小计</th>
				<th>操作</th>
			</tr>
			<tr align="center">
				<td>苹果</td>
				<td rowspan="2">5</td>
				<td>20</td>
				<td>100</td>
				<td><img src="imgs/del.jpg" width="24" height="24"/></td>
			</tr>
			<tr align="center">
				<td>菠萝</td>
				<td>15</td>
				<td>45</td>
				<td><img src="imgs/del.jpg" width="24" height="24"/></td>
			</tr>
			<tr align="center">
				<td>西瓜</td>
				<td>6</td>
				<td>6</td>
				<td>36</td>
				<td><img src="imgs/del.jpg" width="24" height="24"/></td>
			</tr>
			<tr align="center">
				<td>总计</td>
				<td colspan="4">181</td>
			</tr>
		</table>
	</body>
</html>
<!--
17) 表格	table
	行		tr
	列		td
	表头列	th

	table中有如下属性（虽然已经淘汰，但是最好了解一下）
	- border：表格边框的粗细
	- width:表格的宽度
	- cellspacing：单元格间距
	- cellpadding：单元格填充

	tr中有一个属性： align -> center , left , right 

	rowspan : 行合并
	colspan : 列合并

-->

在这里插入图片描述

<html>
	<head>
		<title>表单标签的学习</title>
		<meta charset="UTF-8">
		
	</head>
	<body>
		<form action="demo04.html" method="post">
			昵称：<input type="text" value="请输入你的昵称"/><br/>
			密码：<input type="password" name="pwd"/><br/>
			性别：<input type="radio" name="gender" value="male"/>男
	  			  <input type="radio" name="gender" value="female" checked/>女<br/>
			爱好：<input type="checkbox" name="hobby" value="basketball"/>篮球
				  <input type="checkbox" name="hobby" value="football" checked/>足球
				  <input type="checkbox" name="hobby" value="earth" checked/>地球<br/>
			星座：<select name="star">
					<option value="1">白羊座</option>
					<option value="2" selected>金牛座</option>
					<option value="3">双子座</option>
					<option value="4">天蝎座</option>
					<option value="5">天秤座</option>
				  </select><br/>
			备注：<textarea name="remark" rows="4" cols="50"></textarea><br/>
			<input type="submit" value=" 注 册 "/>
			<input type="reset" value="重置"/>
			<input type="button" value="这是一个普通按钮"/>
		</form>
	</body>
</html>
<!--
18) 表单	form

19) input type="text" 表示文本框 ， 其中 name属性必须要指定，否则这个文本框的数据将来是不会发送给服务器的
	input type="password" 表示密码框
	input type="radio" 表示单选按钮。需要注意的是，name属性值保持一致，这样才会有互斥的效果;可以通过checked属性设置默认选中的项
	input type="checkbox" 表示复选框。name属性值建议保持一致，这样将来我们服务器端获取值的时候获取的是一个数组
	select 表示下拉列表。每一个选项是option，其中value属性是发送给服务器的值 , selected表示默认选中的项
	textarea 表示多行文本框（或者称之为文本域）,它的value值就是开始结束标签之间的内容
	input type="submit" 表示提交按钮
	input type="reset" 表示重置按钮
	input type="button" 表示普通按钮

-->

在这里插入图片描述

<html>
	<head>
		<title>表单标签的学习</title>
		<meta charset="UTF-8">
		
	</head>
	<body>
		<h1><font color='red'>注册成功</font></h1>
	</body>
</html>
<!--
18) 表单	form

19) input type="text" 表示文本框 ， 其中 name属性必须要指定，否则这个文本框的数据将来是不会发送给服务器的
	input type="password" 表示密码框	

-->

在这里插入图片描述

<html>
	<head></head>
	<frameset rows="20%,*" > <!-- frameborder="no" -->
		<frame src="frames/top.html"/>
		<frameset cols="15%,*">
			<frame src="frames/left.html"/>
			<frameset rows="80%,*">
				<frame src="frames/main.html"/>
				<frame src="frames/bottom.html"/>
			</frameset>
		</frameset>
	</frameset>
</html>

<!--
frameset 表示页面框架 ， 这个标签已经淘汰，了解，不需要掌握
frame表示框架中的具体页面引用

iframe

-->

在这里插入图片描述

<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		这里是demo06页面的内容！！
		<iframe src="frames/top.html"/>
	</body>
</html>

<!--
frameset 表示页面框架 ， 这个标签已经淘汰，了解，不需要掌握
frame表示框架中的具体页面引用

iframe 在一个页面嵌入一个子页面



总结：
1.HTML是解释型的文本标记语言，不区分大小写
2.html,head,title,meta,body,br,p,hr,div,table,form,u,i,b,sup,sub,&nbsp;,span,ul,ol,li,tr,td,th,h1-h6,a,input,select,textarea,img
2-1. html , head , title , meta , body , br , ul , ol , h1-h6 , a , img , &nbsp;, p , div , span
2-2. table tr , th , td 
2-3. form(action='' , method='post') input type='text,pasword,radio,checkbox,submit,button,reset"   <select> , <textarea>



-->

在这里插入图片描述

ZgaoYi
关注
专栏目录
尚硅谷2022Javaweb学习笔记（个人总结）
03-24
尚硅谷2022Javaweb学习笔记（个人总结）
尚硅谷全新JavaWeb教程，企业主流javaweb技术栈【学习笔记】二
qq_43668996的博客
03-21 2118
1.创建SAXReader对象2.解析XML获取Document对象：需要传入要解析的XML文件的字节输入流3.获取文档的根标签4.获取标签的子标签//获取所有子标签//获取指定标签名的子标签ListsonElementList = rootElement.elements("标签名");
尚硅谷全新JavaWeb教程，企业主流javaweb技术栈【学习笔记】一
qq_43668996的博客
03-09 2006
慢慢更新~视频笔记。
尚硅谷全新JavaWeb教程，企业主流javaweb技术栈【学习笔记】四
最新发布
qq_43668996的博客
06-26 523
一 部分代码： https://download.csdn.net/download/qq_43668996/89066620二 部分代码： https://download.csdn.net/download/qq_43668996/8909402。
尚硅谷Java-web(全新技术栈,全程实战)：Servlet技术
zhu0000007的博客
12-20 1029
默认情况下，第一次请求时，tomcat 才会去实例化，初始化，然后再服务，这样的好处是什么： 提高系统的启动速度，只有创建对象，就是说有请求，才创建 servlet 对象。3： 我们已经知道了servlet是线程不安全的，给我们的启发是：尽量的不要在 servlet 中定义成员变量。2：请求消息头中包含了很多客户端需要告诉服务器的信息，比如：我的浏览器型号、版本、我能接收的内容的类型、我给你发的内容的类型、内容的长度等等。当容器关闭时，其中的所有的 servlet 实例会被销毁，调用销毁方法。
Java_Web：尚硅谷JavaWeb项目代码
02-16
【Java Web：尚硅谷JavaWeb项目代码】 Java Web是一种基于Java技术的Web应用程序开发平台，它允许开发者构建动态、交互式的互联网应用。尚硅谷是一家知名的IT培训机构，他们提供的JavaWeb项目代码是学习者掌握Web...
尚硅谷全新JavaWeb教程，企业主流javaweb技术栈 中代码
04-07
JavaWeb开发是Java编程领域的一个重要分支，主要涉及构建基于Web的交互式应用程序。尚硅谷推出的全新JavaWeb教程聚焦于企业主流技术栈，旨在帮助开发者掌握实际工作中所需的关键技能。本教程涵盖了Tomcat服务器、...
尚硅谷JavaWeb项目微头条代码
04-27
【标题】"尚硅谷JavaWeb项目微头条代码" 涉及的是一个基于JavaWeb的开发实践，其中可能包括了完整的项目结构和配置文件。这个项目可能是为了教学或实际应用目的，让学生或开发者了解如何使用JavaWeb技术进行实际的...
JavaWEB_atguigu_TongGang:尚硅谷--佟刚--JavaWEB--视频教程
05-01
在这个“尚硅谷--佟刚--JavaWEB--视频教程”中，我们可以期待深入学习JavaWeb的核心概念和技术。 1. **Servlet与JSP**：作为JavaWeb开发的基础，Servlet是Java语言编写服务器端应用程序的标准接口，用于生成动态...
webpack5基础
学过的东西，讲不出来等于没学。
05-21 471
前言 为什么需要打包工具？ 开发时，我们会使用框架（React、Vue），ES6 模块化语法，Less/Sass 等 css 预处理器等语法进行开发。 这样的代码要想在浏览器运行必须经过编译成浏览器能识别的 JS、Css 等语法，才能运行。 所以我们需要打包工具帮我们做完这些事。 除此之外，打包工具还能压缩代码、做兼容性处理、提升代码性能等。 有哪些打包工具？ Grunt Gulp Parcel Webpack Rollup Vite … 目前市面上最流量的是 Webpack，所以我们主要以 Webpa
尚硅谷最新前端全部资源视频
07-10
尚硅谷最新前端全部资源视频 包含项目视频和小程序全部整合有笔记资源
三层架构思想：MVC
weixin_46245201的博客
04-11 371
文章目录1. 图示 1. 图示
Java web 2022跟学尚硅谷书城项目完整开源分享
心向阳光的天域的博客
12-16 1603
Java web 2022跟学尚硅谷书城项目完整开源分享
Java web 2022跟学尚硅谷(一) 前端基础
心向阳光的天域的博客
12-04 358
Java web 2022跟学尚硅谷(一) 前端基础
（尚硅谷）JavaWeb新版教程01-HTML
qq_42148002的博客
05-13 1337
1、名词解释 HTML 是 Hyper Text Markup Language 的缩写。意思是『超文本标记语言』。 2、超文本 HTML 文件本质上是文本文件，而普通的文本文件只能显示字符。但是 HTML 技术则通过 HTML 标签把其他网页、图片、音频、视频等各种多媒体资源引入到当前网页中，让网页有了非常丰富的呈现方式，这就是超文本的含义——本身是文本，但是呈现出来的最终效果超越了文本。 ...
尚硅谷2022 javaweb网上书城
kinbridge的专栏
06-04 999
尚硅谷网上书城项目，自定义实现bean注入和DispatcherServlet工具，使用java8新特性parameters反射获取参数名，前端使用thymeleaf+vue
【尚硅谷】JavaWeb
白羊座的橙子
07-27 1352
什么是xml？xml是可扩展的标记性语言。
2022尚硅谷最新JavaWeb知识点
m0_62641005的博客
03-14 2256
用户使用浏览器 发送Http Request 比如index.html 发送到Server服务器 然后服务器端就会发Http Response 很多的HTML代码 返回到用户的浏览器 由浏览器显示 HTML High-text mark language 超文本标记语言-决定页面显示什么 CSS cascading style sheets 层叠样式表（决定页面内容的美观程度） JS Java script 脚本语言 页面特效 简单的text笔记的HTML后缀的简单页面 <html&
2020尚硅谷JavaWeb（一）：前端部分
MyWang的博客
09-03 1102
JavaWeb一、JavaScript1、引入js2、变量3.关系（比较运算）4.逻辑运算5.数组6.函数定义（重点）6.1 函数定义的两种方式6.2 函数的arguments隐形参数7. JS中的自定义对象7.1 Object形式的自定义对象7.2 {}花括号形式的自定义对象8. js中的事件8.1 常用的事件8.2 事件的注册8.3 onload事件8.4 onclick事件8.5 onblur事件8.6 onsubmit事件 一、JavaScript 1、引入js JS是弱类型语言（类型可变） 特点
尚硅谷JavaWeb全套学习笔记及资源分享
资源摘要信息:"本篇文档提供了尚硅谷JavaWeb学习笔记的配套资源，适用于希望深化Java开发知识的学员。尚硅谷作为知名的IT教育机构，其JavaWeb课程涵盖了从基础到高级的Java Web开发技能。这些学习笔记是该课程的重要...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值