HTML 基础

于 2022-10-15 19:26:36 发布
阅读量857 收藏 1
点赞数
分类专栏： JavaWeb 文章标签： html 前端 服务器
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_47869348/article/details/127339149
版权

HTML是Hyper Text Markup Language的缩写。意思是**『超文本标记语言』**。

HTML技术通过HTML标签把其他网页、图片、音频、视频等各种多媒体资源引入到当前网页中，让网页有了非常丰富的呈现方式，这就是超文本的含义——本身是文本，但是呈现出来的最终效果超越了文本。

  • html语言是解释性语言，不是编译型语言(Java等)。
  • 浏览器是容错的。

html文件结构

  • <html></html>

    html标签是整个文档的根标签，所有其他标签都必须放在html标签里面。

  • <head></head>

    head标签用于定义文档的头部

  • <body></body>

    body标签定义网页的主体内容

在这里插入图片描述

请求方式

浏览器和服务器之间在互相通信时有大量的**『数据』**需要传输。

由于浏览器和服务器均存在多种不同产品，因此需要一套规范格式来保证彼此之间传输的数据能被理解，发送端按照格式发送数据，接收端按照格式解析数据，实现数据的跨平台传输。这里规范的格式就是应用程序间的通信协议。

HTTP协议的底层就是TCP/IP协议。

HTTP1.1中共定义了八种请求方式：

  • GET
  • POST
  • PUT
  • DELETE
  • HEAD
  • CONNECT
  • OPTIONS
  • TRACE

在HTML标签中，点击超链接是GET方式的请求，提交一个表单可以通过form标签的method属性指定GET或POST请求，其他请求方式无法通过HTML标签实现。

表单

使用form标签来定义一个表单。而对于form标签来说有两个最重要的属性：action和method。

  • action：服务器端接受表单数据的地址
  • method：定义提交表单的请求方式。只有两个可选值：get或post，没有极特殊情况的话使用post即可。

name和value属性：

在各个具体的表单标签中，我们通过**『name属性』来给数据起『名字』，通过『value属性』来保存要发送给服务器的『值』**。

在服务器端使用Map类型来接收请求参数的。具体的是类型是：Map<String,String[]>。

单行文本框
个性签名：<input type="text" name="signal"/><br/>

在这里插入图片描述

密码框
密码：<input type="password" name="secret"/><br/>

在这里插入图片描述

多行文本框
自我介绍：<textarea name="desc"></textarea>

在这里插入图片描述

单选框
你最喜欢的季节是：
<input type="radio" name="season" value="spring" />春天
<input type="radio" name="season" value="summer" checked="checked" />夏天
<input type="radio" name="season" value="autumn" />秋天
<input type="radio" name="season" value="winter" />冬天

在这里插入图片描述

  • name属性相同的radio为一组，组内互斥
  • 当用户选择了一个radio并提交表单，这个radio的name属性和value属性组成一个键值对发送给服务器
  • 设置checked="checked"属性设置默认被选中的radio
多选框
你最喜欢的球队是：
<input type="checkbox" name="team" value="Brazil"/>巴西
<input type="checkbox" name="team" value="German" checked="checked"/>德国
<input type="checkbox" name="team" value="France"/>法国
<input type="checkbox" name="team" value="China" checked="checked"/>中国
<input type="checkbox" name="team" value="Italian"/>意大利

在这里插入图片描述

下拉列表
你喜欢的运动是：
<select name="interests">
    <option value="swimming">游泳</option>
    <option value="running">跑步</option>
    <option value="shooting" selected="selected">射击</option>
    <option value="skating">溜冰</option>
</select>

在这里插入图片描述

  • option标签的标签体是显示出来给用户看的，提交到服务器的是value属性的值。
  • 通过在option标签中设置selected="selected"属性实现默认选中的效果。
按钮
<button type="button">普通按钮</button>
<button type="reset">重置按钮</button>
<button type="submit">提交按钮</button>

在这里插入图片描述

类型功能
普通按钮通过JavaScript绑定单击响应函数
重置按钮点击后将表单内的所有表单项都恢复为默认值
提交按钮点击后提交表单
表单隐藏域
<input type="hidden" name="userId" value="2233"/>

通过表单隐藏域设置的表单项不会显示到页面上，用户看不到。但是提交表单时会一起被提交。用来设置一些需要和表单一起提交但是不希望用户看到的数据，例如：用户id等等。

片云天共远
关注
专栏目录
html标签的action属性,html form标签的action属性是什么意思？又有哪些用法？（附实例）...
weixin_42469315的博客
06-07 3830
本篇文章主要的介绍HTML form表单标签的action属性的用法，用法介绍和实例等都在里面，现在让我们一起来看吧首先我们先来介绍一下关于HTML form标签的action属性的意思：form标签的action属性是一个表单当中必须的属性，action属性规定当提交表单时，向何处发送表单数据。先看个第一个关于form标签action属性的实例：下面的表单拥有两个输入字段以及一个提交按钮，当提交...
HTML基础模板
qq_61690596的博客
07-18 2100
HTML基本模板，每个基础元素的内容和作用
html中表单的action属性作了什么?
u010563350的博客
11-05 5360
国内一堆人垃圾，说每到点子上。 本文属于作者我结合国外的博客加上自己的专业知识理解。 <form action=”URL”></form> 知道参数是URL。 那么，什么是URL？ 我讲个故事。 以前的一群科学家们在用美国二战时留下的网络时，想搞1个分布式系统。当时想的是制造这样一种网络，可以让人点一下，就可以访问位于某个Ip的机器的资源。由于这种点一下点一下的方式，（你可以把鼠标放到1个超链接上，看到鼠标变成了抓手模样）实在是太棒了。于是好多不搞计算机的也加入近来，他们也让自己的
html（1）——HTML中表单action属性的作用
木子 旭的博客
11-30 2672
表单的作用图 用户在界面表单输入的信息，被封装在Request对象中发送到服务器中相应的后台程序中。
HTMl总结(4)
WildKingxue的博客
08-13 269
一.HTML<div>和<span> HTML 可以通过 <div> 和 <span>将元素组合起来。 大多数 HTML 元素被定义为块级元素或内联元素。 1.HTML<div>元素 HTML <div> 元素是块级元素。 它可用于组合其他 HTML 元素。可以包含其他的html元素在当前div中显示---容器元素。 div元素前后会自动换行。 div是在当前网页中的一块空白区域，与css一起使用，可以用来制作网页的布局，
HTML基础练习题
热门推荐
weixin_50108821的博客
09-23 1万+
第一题 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>嘿嘿嘿</title> </head> <body> <table border="1" cellspacing="0" cellpadding="0"> <tr align="center">
HTML基础
weixin_42337982的博客
08-11 2812
前端面试题——html基础
《Web程序设计基础R》实验报告---HTML基础
一只小鹿的博客
12-21 4826
一、实验目的 1．掌握常用的HTML语言标记； 2．利用文本编辑器建立HTML文档，制作简单表单页面。 二、实验环境 计算机、Windows10 操作系统 三、实验内容、源码及运行结果 1．  实验内容 在文本编辑器“记事本”中输入如下的HTML代码程序，以文件名sy1.html保存，并在浏览器中运行。（请仔细阅读下列程序语句，理解每条语句的作用） 源程序清单如下： 1. <html> 2. <head> 3. <title>Example</title&
HTML基础网页布局代码写法
m0_51826406的博客
03-07 8823
W3C标准 W3C World Wide Web Consortium 万维网联盟 中立性技术标准机构 W3C标准包括 结构化标准语言（HTML XML） 表现标准语言（CSS） 行为标准（DOM ECMAScript） 在idea创建一个工程 开始学习HTML基础 <!--注释 DOCTYPE：告诉浏览器我们使用什么规范 --> <!DOCTYPE html> <html lang="en"> <!-- head代表网页头部 --> <hea
html action属性,HTML: <input> formaction 属性
weixin_32445333的博客
06-04 378
在线示例一个带有两个提交按钮的HTML表单(可以提交到不同的 action )：示例html>HTML:formaction属性-基础教程网(nhooo.com)Firstname:Lastname:测试看看 ‹/›浏览器兼容性IEFirefoxOperaChromeSafariInternet Explorer 10、Firefox、Opera、Chrome 和 Safar...
ASP.NET MVC 中＠Html.Partial，＠Html.Action，＠Html.RenderPartial，＠Html.RenderAction差别
glacier12的博客
10-28 781
对这四个的差别做一个总结，清理一下思路，便利今后应用： 1、带有Render的办法返回值是void，在办法内部进行输出；不带的返回值类型为MvcHtmlString，所以只能如许应用：     ＠Html.Partial 对应 ＠{Html.RenderPartial（....）;}     ＠Html.Action 对应 ＠{Html.RenderAction（....）;}
【转】HTML-form中action的填写
akuxia的博客
11-23 3189
关于form的action路径填写 一：可以是相对路径： 1、action="<%=request.getContextPath() %>/html/index.html" <%=request.getContextPath() %>表示回到应用的根目录下，再加上相对路径 2、action="/html/index.html" 表示在服务器的根目录下搜索html/index.html /表示根目录 3、action="index.html" 表示在当前目录下搜索 二
使用html 的a标签连接action的方法
cracker_c博客
05-06 2526
原文链接 <a href="<s:url action="blogList"/>">XXXX</a>即可 更简单的写法是 <a href="blogDelete.action?id=XXX">直接写就行了 如果这个Action在struts里面声明的时候有命名空间如/user 那么写成<a href="user/blogD...
HTML <form> 标签的 action 属性
sfcyyc的专栏
04-12 2369
定义和用法 必需的 action 属性规定当提交表单时，向何处发送表单数据。 实例 下面的表单拥有两个输入字段以及一个提交按钮，当提交表单时，表单数据会提交到名为 "form_action.asp" 的页面： action="form_action.asp" method="get"> First name: Last name:
@Html.Action()
weixin_30505043的博客
03-20 613
背景 在这里主要想谈下mvc，最初几年都是用的webform，作为一个资深傻瓜程序员多年，后来到处听说mvc，终于在某天下定决心实验下mvc，其实关键还是在于easyui，因为它的请求数据方式和mvc正好吻合了。这也是我最终抛弃webform的原因了。以下这个知识点是看一个同事如此使用，纪念以下。 知识点 使用方法：@Html.Action(action, controller)加...
html标签的action属性,htmlform标签的action属性是什么意思？又有哪些用法？（附实例）...
weixin_39581739的博客
06-07 428
本篇文章主要的介绍HTML form表单标签的action属性的用法，用法介绍和实例等都在里面，现在让我们一起来看吧首先我们先来介绍一下关于HTML form标签的action属性的意思：form标签的action属性是一个表单当中必须的属性，action属性规定当提交表单时，向何处发送表单数据。先看个第一个关于form标签action属性的实例：下面的表单拥有两个输入字段以及一个提交按钮，当提交...
Html.Action与Html.RenderAction的用法与区别：RenderAction要写在代码中！！！1
sym218的专栏
08-19 6919
 Action是执行单独的控制器并且显示结果，Action与RenderAction不同的是，Action返回的是字符串,而RenderAction是写入响应流，因此RenderAction是要写在代码中： @Html.Action("test") @{ Html.RenderAction("test"); } 下面来介绍怎样具体实现Html.Action： 1.
html form表单提交action和url跳转到action有什么区别.
836811384
11-04 1237
form表单的action 与url跳转是不一样的： form表单可以给后台传递数据，在后台直接可以用request对象去向前台请求数据。 form表单传递数据有两种方式： method="post":这是传递大量数据时用的，在数据传递之前会先将数据打包，因此这种传递数据的方式会效率会比较慢，但是穿过的数据都能正确解析，因此传中文不会有乱码。 method="get"：以URL传递的，...
HTML基础入门与开发环境选择
HTML基础知识详解 在IT开发领域中，HTML（HyperText Markup Language）扮演着核心角色，它是网页制作的基础。本文将深入探讨JavaWeb开发中的两种主要模式——C/S（客户端/服务器）和B/S（浏览器/服务器），以及HTML...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值