jsp2024.3.21(4) html基础

一、实验目的

1、html 文件的基本结构；

2、html 的常用标记；

<HTML>

<HEAD>

   ……

</HEAD>

<BODY>

 ……

</BODY>

</HTML>

二、实验项目内容（实验题目）

HTML常用标记

1．<!DOCTYPE> 标签

2. <head> 标签

3．<font> 标签 字体、大小、字号等

4．<h>标题标签 标题h1-h6

5．p标签 段落

6．文本区域标记 area

7．列表标记 dl结合 <dt>和 <dd> ; ul结合<li>

8．框架标记（frameset）

9．body标记

10．table表格标记 <tr><th>  <tr> <td>

11．链接和加载

12．Input、button等文本、按钮标签

完成以下例题并将网页的运行结果截图保存到实验报告中。

 

三、源程序（实验步骤/实验过程/算法）(newfile是例二，newfile2是例三，newfile3是例四，newfile4是例五，newfile5是例六，newfile6是例七，newfile7是例八

例2

<%@ page language="java" contentType="text/html; charset=utf-8"

    pageEncoding="utf-8"%>

<!DOCTYPE html>

<html>

<head>

<meta  http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>示例代码</title>

<head>

<body>

<h1>文本格式标签</h1>

<p>&lt;p&gt;标签标识段落文本</p>

</body>

</html>

例3

<%@ page language="java" contentType="text/html; utf-8"

    pageEncoding="utf-8"%>

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title>示例代码</title>

</head>

<body>

<p>例如，针对下面这个一元二次方程:</p>

<p><i>x</i><sup>2</sup>-<b>5</b><i>x</i>+<b>4</b>=0</p>

<p>我们使用<big> <b>分解因式法</b></big>来演示解题思路如下:</p>

<p><small>由:</small>(<i>x</i>-1)(<i>x</i>-4)=0</p>

<p><small>得:</small><br /><i>x</i><sub>1</sub>=1<br >

   <i>x</i><sub>2</sub>-4</p>

</body>

</html>

例4

<%@ page language="java" contentType="text/html; charset=utf-8"

    pageEncoding="utf-8"%>

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" >

<title>示例代码</title>

</head>

<body>

<h1>解一元二次方程</h1>

<p>一元二次方程求解有4种方法:</p>

<ul>

   <li>直接开平方法</li>

   <li>配方法</li>

   <li>公式法</li>

   <li>分解因式法</li>

</ul>

</body>

</html>

例5

<%@ page language="java" contentType="text/html; charset=utf-8"

    pageEncoding="utf-8"%>

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title>示例代码</title>

</head>

<body>

<h1>成语词条列表</h1>

<dl>

<dt>知无不言,言无不尽</dt>

<dd>知道的就说,要说就毫无保留。</dd>

<dt>智者千虑,必有一失</dt>

<dd>不管多聪明的人，在很多次的考虑中,也一定会出现个别错误。</dd>

</dl>

</body>

</html>

例6

<%@ page language="java" contentType="text/html; charset=utf-8"

    pageEncoding="utf-8"%>

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>示例代码</title>

</head>

<body>

<a href "http://www.baidu.com/"">去百度搜索</a>

</body>

</html>

例7

<%@ page language="java" contentType="text/html; charset=utf-8"

    pageEncoding="utf-8"%>

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>示例代码</title>

</head>

<body>

   <table summary="ASCII是英文American Standard Code for Information

   Interchange的缩写。ASCII编码是目前计算机最通用的编码标准。因为计算机只能接受数字信息，

   ASCII编码将字符转换为数字来表示，以便计算机能够接受和处理。">

   <caption>ASCHI字符集(节选)</caption>

  

   <tr>

   <th>十进制</th>

   <th>十六进制</th>

   <th>字符</th>

   </tr>

  

   <tr>

   <td>9</td>

   <td>9</td>

   <td>TAB(制表符)</td>

   </tr>

  

   <tr>

   <td>10</td>

   <td>A</td>

   <td>换行</td>

   </tr>

  

   <tr>

   <td>13</td>

   <td>D</td>

   <td>回车</td>

   </tr>

  

</table>

</body>

</html>

例8

<%@ page language="java" contentType="text/html; charset=utf-8"

    pageEncoding="utf-8"%>

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset-utf-8" />

<title>示例代码</title>

</head>

<body>

<form id="forml" name="forml" method="post" action="">

<P>单行文本域:<input type="text" name="textfield" id="textfield" ></p>

<P>密码域:<input type="password" name="passwordfield" id="passwordfield" ></p>

<p>p多行文本域:<textarea name="textareafield" id="textareafield"></textarea></p>

<p>复选框:复选框1<input name="checkbox 1" type="checkbox" value=""/>

      复选框2<input name="checkbox2" type="checkbox" value一""/>

</p>

<p>单选按钮:

   <input name-"radiol" type="radio" valuc=""/>按钮1

   <input name="radio2" type="radio" valuc=""/>按钮2

   </p>

<p>下拉菜单:

   <sclect name="selectlist">

   <option value-"1">选项1</option>

   <option value—"2">选项2</option>

   <option value-"3">选项3</option>

   </select>

</p>

<p>

<input type="submit" name-"button" id="button" value="提交" />

</p>

</form>

</body>

</htm>

四、实验分析、总结

例2

例3

例4

例5

例6

例7

例8

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：/a/475785.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

C语言数据在内存中的存续：一篇文章让你秒懂基础！

C语言数据在内存中的存续：一篇文章让你秒懂基础！

JAMES别扣了-CSDN博客 &#x1f495;在校大学生一枚。对IT有着极其浓厚的兴趣 ✨系列专栏目前为C语言初阶、后续会更新c语言的学习方法以及c题目分享. &#x1f60d;希望我的文章对大家有着不一样的帮助&#xff0c;欢迎大家关注我&#xff0c;我也会回关&#xff0c;大家一起交…
阅读更多...
LeetCode 热题 100 | 堆（一）

LeetCode 热题 100 | 堆（一）

目录 1 什么是堆排序 1.1 什么是堆 1.2 如何构建堆 1.3 举例说明 2 215. 数组中的第 K 个最大元素 2.1 子树大根化 2.2 遍历所有子树 2.3 弹出栈顶元素 2.4 完整代码 菜鸟做题&#xff0c;语言是 C 1 什么是堆排序 1.1 什么是堆 堆的定义和分类&#xff…
阅读更多...
为什么Hashtable不允许插入nuIl键和null值？

为什么Hashtable不允许插入nuIl键和null值？

1、典型回答 浅层次的来回答这个问题的答案是&#xff0c;JDK 源码不支持 Hashtable 插入 value 值为 null&#xff0c;如以下 JDK 源码所示&#xff1a; 也就是 JDK 源码规定了&#xff0c;如果你给 Hashtable 插入 value 值为 null 就会抛出空指针异常。 并且看上面的 JDK …
阅读更多...
如何搭建DolphinScheduler服务并结合内网穿透公网远程任务调度

如何搭建DolphinScheduler服务并结合内网穿透公网远程任务调度

文章目录 前言1. 安装部署DolphinScheduler1.1 启动服务 2. 登录DolphinScheduler界面3. 安装内网穿透工具4. 配置Dolphin Scheduler公网地址5. 固定DolphinScheduler公网地址 前言 本篇教程和大家分享一下DolphinScheduler的安装部署及如何实现公网远程访问&#xff0c;结合内…
阅读更多...
Stable Diffusion WebUI 生成参数：宽度/高度/生成批次/每批数量/提示词相关性/随机种子

Stable Diffusion WebUI 生成参数：宽度/高度/生成批次/每批数量/提示词相关性/随机种子

本文收录于《AI绘画从入门到精通》专栏&#xff0c;专栏总目录&#xff1a;点这里。 大家好&#xff0c;我是水滴~~ 本文将继续了解 Stable Diffusion WebUI 的生成参数&#xff0c;主要内容有&#xff1a;宽度、高度、生成批次、每批数量、提示词相关性、随机种子。希望能对你…
阅读更多...
大模型主流微调训练方法总结 LoRA、Adapter、Prefix-tuning、P-tuning、Prompt-tuning 并训练自己的数据集

大模型主流微调训练方法总结 LoRA、Adapter、Prefix-tuning、P-tuning、Prompt-tuning 并训练自己的数据集

大模型主流微调训练方法总结 LoRA、Adapter、Prefix-tuning、P-tuning、Prompt-tuning 概述 大模型微调（finetuning）以适应特定任务是一个复杂且计算密集型的过程。本文训练测试主要是基于主流的的微调方法：LoRA、Adapter、Prefix-tuning、P-tuning和Prompt-tuning，并对…
阅读更多...
STM32驱动CC1101时的正确配置和一些遇到的坑

STM32驱动CC1101时的正确配置和一些遇到的坑

项目背景 由于项目需要用到CC1101-Q1，所以买了CC1101的模块和驱动底板，插电脑上一发一收。串口调试助手查看接收端的数据，测试正常。 然后想用STM32来驱动其中的一块CC1101模块作为发送端，和另一个买来的接收端测试通信。找到一份STM32驱动CC1101Demo代码，分为软件模拟S…
阅读更多...
Certum代码签名证书

Certum代码签名证书

代码签名证书是一种数字证书&#xff0c;用于验证软件开发者身份和保证软件完整性的技术。它的作用在于确保软件在传输和安装过程中没有被篡改或损坏&#xff0c;并且确认软件来自可信的开发者。通过代码签名证书&#xff0c;用户可以更放心地下载和安装软件&#xff0c;降低安…
阅读更多...
【Linux】文件描述符 - fd

【Linux】文件描述符 - fd

文章目录 1. open 接口介绍1.1 代码演示1.2 open 函数返回值 2. 文件描述符 fd2.1 0 / 1 / 22.2 文件描述符的分配规则 3. 重定向3.1 dup2 系统调用函数 4. FILE 与 缓冲区 1. open 接口介绍 使用 man open 指令查看手册&#xff1a; #include <sys/types.h> #include …
阅读更多...
AI系统性学习06—开源中文语言大模型

AI系统性学习06—开源中文语言大模型

1、ChatGLM ChatGLM-6B的github地址&#xff1a;https://github.com/THUDM/ChatGLM-6B ChatGLM-6B 是一个开源的、支持中英双语的对话语言模型&#xff0c;基于 General Language Model (GLM) 架构&#xff0c;具有 62 亿参数。结合模型量化技术&#xff0c;用户可以在消费级…
阅读更多...
透视未来工厂：山海鲸可视化打造数字孪生新篇章

透视未来工厂：山海鲸可视化打造数字孪生新篇章

在信息化浪潮的推动下&#xff0c;数字孪生工厂项目正成为工业制造领域的新宠。作为一名山海鲸可视化的资深用户&#xff0c;我深感其强大的数据可视化能力和数字孪生技术在工厂管理中的应用价值&#xff0c;同时我们公司之前也和山海鲸可视化合作制作了一个智慧工厂项目&#…
阅读更多...
OceanBase生产环境安装部署的最优实践

OceanBase生产环境安装部署的最优实践

关于生产环境&#xff0c;为了尽量确保性能和稳定性&#xff0c;我们比较建议采用标准化的配置进行部署&#xff0c;例如接下来会提到的服务初始化、日志管理和数据分盘等关键步骤。而在非生产环境中&#xff0c;如果条件满足&#xff0c;同样建议遵循规范部署的原则。 前期准备…
阅读更多...
项目实战-开发工具入门/基本框架搭建/项目初始化/引入组件库

项目实战-开发工具入门/基本框架搭建/项目初始化/引入组件库

上周更新完了之前vue3的shopping项目&#xff0c;接下来&#xff0c;将会开启一个新的项目&#xff0c;效果是类似于移动端的一个伙伴匹配项目&#xff0c;今天这篇文章从需求分析到架构设计再到项目初始化&#xff0c;基本框架搭建几个部分来为大家详细介绍。 从这个项目开始…
阅读更多...
YOLOV5 改进：替换backbone为Swin Transformer

YOLOV5 改进：替换backbone为Swin Transformer

1、前言 本文会将YOLOV5 backbone更换成Swin Transformer 具体为什么这样实现参考上文：YOLOV5 改进：替换backbone（MobileNet为例）-CSDN博客 这里只贴加入的代码 训练结果如下： 2、common文件更改 在common文件中加入下面代码： 这里是swin transformer的实现，参考：…
阅读更多...
VMware部署银河麒麟遇到的问题记录

VMware部署银河麒麟遇到的问题记录

1. 解决VMware Workstation安装VMware Tools显示灰色的办法 1.关闭虚拟机； 2.在虚拟机设置分别设置CD/DVD、CD/DVD2和软盘为自动检测三个步骤； 3.再重启虚拟机，灰色字即点亮。 2.Linux安装vmTool
阅读更多...
Pytest接口自动化测试框架搭建模板

Pytest接口自动化测试框架搭建模板

auto_api_test 开发环境: Pycharm 开发语言&版本: python3.7.8 测试框架: Pytest、测试报告: Allure 项目源码Git地址 项目目录结构 api – 模仿PO模式, 抽象出页面类, 页面类内包含页面所包含所有接口, 并封装成方法可供其他模块直接调用config – 配置文件目录data…
阅读更多...
打造高效自动化渗透测试系统：关键步骤与实践

打造高效自动化渗透测试系统：关键步骤与实践

随着当前网络安全威胁的不断扩展与升级&#xff0c;开展渗透测试工作已经成为广大企业组织主动识别安全漏洞与潜在风险的关键过程。然而&#xff0c;传统的人工渗透测试模式对测试人员的专业能力和经验水平有很高的要求&#xff0c;企业需要投入较大的时间和资源才能完成。在此…
阅读更多...
品牌纷纷推出“穷鬼套餐”的原因竟然有这些？

品牌纷纷推出“穷鬼套餐”的原因竟然有这些？

被大众戏称为“千元店”的山姆也开穷鬼套餐了&#xff1f;&#xff1f;该套餐包括1.59公斤售价21.9元的鸡蛋、7个装售价23.9元的原味贝果以及16片装售价59.8元的瑞士卷。 穷鬼套餐最开始是麦当劳和肯德基的推出的概念&#xff0c;由麦当劳推出的11随心配、肯德基超值午餐等。为…
阅读更多...
python（django）之产品后台管理功能实现

python（django）之产品后台管理功能实现

1、添加新项目 在命令行输入以下代码 python manage.py startapp prroduct 2、添加路径和代码结构 在新项目目录下admin.py中加入以代码 from .models import Product class ProductAdmin(admin.ModelAdmin):list_display [product_name, product_desc,producter,created_…
阅读更多...
CC-DefineTag：一个简单好用的标签组件，支持自动换行、自适应高度，且可设置行数、标签文字颜色等属性

CC-DefineTag：一个简单好用的标签组件，支持自动换行、自适应高度，且可设置行数、标签文字颜色等属性

CC-DefineTag&#xff1a;一个简单好用的标签组件&#xff0c;支持自动换行、自适应高度&#xff0c;且可设置行数、标签文字颜色等属性 摘要&#xff1a; 在前端开发中&#xff0c;标签组件是常见的UI组件之一&#xff0c;用于显示一组相关的标签。然而&#xff0c;传统的标签…
阅读更多...
最新文章

Copyright @ 2022~2023