HTML 入门

最新推荐文章于 2023-05-03 22:19:26 发布
最新推荐文章于 2023-05-03 22:19:26 发布
阅读量113 收藏 1
点赞数
文章标签： java
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45611051/article/details/106788466
版权

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
font size的范围为1-7,font已经快淘汰了

<font size="1-7' face="隶书  " color="red">

在这里插入图片描述

:换行，不是换段
在这里插入图片描述

HTML中常用的转义字符

HTML中常用转义字符

在这里插入图片描述

代码如下：

<html xmlns="http://www.w3.org/1999/html">
<head>
    <title>first.html</title>
    <meta charset="utf-8">
</head>
<body>
<p>&lt;慕课网&gt;是垂直&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;的互联网"IT"技能免费学习网站。</p>
以独家视频教程、在线编程&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;工具、学习计划、问答社区为核心特色。</p>
在这里，你可以找到最好的互联网技术牛人，也可以通过免费的在线公开视频课程学习国内领先的互联网IT技术。</p>
慕课网是垂直的互联网IT技能免费学习网站。以独家视频教程、在线编程工具、学习计划、问答社区为核心特色。</p>
在这里，你可以找到最好的互联网技术牛人，也可以通过免费的在线公开视频课程学习国内领先的互联网IT&copy;技术。</p>
</p>
</body>
</html>

效果如下：

在这里插入图片描述

重点注意

1、转义字符各字符之间不能出现空格。
2、转义字符必须以";“结束。
3、单独的”&"不被认为是转义字符的开始。
4、转义字符区分大小写。

标题一共有6个在这里插入图片描述
最好是只用一对

在这里插入图片描述
在这里插入图片描述
alt是提示信息，当前面的路径不存在时，给用户一个提示

…/表示返回上一级开始进行查找
../表示返回上一级进行查找在这里插入图片描述
第一个表示相对路径，第二个表示绝对路径在这里插入图片描述在这里插入图片描述
在这里插入图片描述
在这里插入图片描述在这里插入图片描述
在这里插入图片描述
锚点可以保证最后的文字内容显示出来。
使用：在同一文件时：a href="#锚点名">段落标签</a>
在另一个文件时：a href="文件名#锚点名">段落标签</a>

在这里插入图片描述

利用id属性实现锚点

利用id属性实现锚点

通过视频中学到了name属性完成锚点

利用视频中源码把name属性修改为ID同样可以实现锚点效果

代码实现方式
在这里插入图片描述

重点总结

同一个网页内部不同位置的锚点实现，无论是使用name属性，
还是id属性在链接href中都必须加上#；

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

表格

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
colspan :合并行
rowspan：合并列
在这里插入图片描述

表单

.
在这里插入图片描述
在这里插入图片描述
get：显示提交
post：隐式提交
在这里插入图片描述
隐藏域：在这里插入图片描述
在这里插入图片描述
普通列表框：
在这里插入图片描述
caption设置表名

HTML常用标签，表单联系1

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>注册表单</title>
</head>
<body>
	<form action="" method="">
		<label>请输入用户名：</label>
			<input type="text" name="" id=""><br>
		<label>请输入密码：</label>
			<input type="password" name="" id="" ><br>
		<label>请再次输入密码：</label>
			<input type="password" name="" id=""><br>
		<label>性别:</label>
			<input type="radio" name="xb" id="" value="0">男
			<input type="radio" name="xb" id="" value="1">女<br>
		<label>爱好:</label>
			<input type="checkbox" name="" value="1">旅游
			<input type="checkbox" name="" value="2">篮球
			<input type="checkbox" name="" value="3">足球
			<input type="checkbox" name="" value="4">上网<br>
		<label>生日：</label>
			<select>
				<option value="1995">1995</option>
				<option value="1996">1996</option>
				<option value="1997">1997</option>
				<option value="1998">1998</option>
				<option value="1999">1999</option>
				<option value="2000">2000</option>
				<option value="2001">2001</option>
			</select>年
			<select>
				<option value="1">1</option>
				<option value="2">2</option>
				<option value="3">3</option>
				<option value="4">4</option>
				<option value="5">5</option>
				<option value="6">6</option>
			
			</select>月
			<select>
				<option value="1">1</option>
				<option value="2">2</option>
				<option value="3">3</option>
				<option value="4">4</option>
				<option value="5">5</option>
				<option value="6">6</option>
			
			</select>日<br>
		<input type="button" name="" value="普通按钮">
		<input type="submit" name="" value="提交按钮"><br>
		<textarea rows="20" cols="50">多行文本框</textarea>	
	</form>
</body>
</html>

HTML常用标签、表格、表单练习2：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
		<h1>注册信息</h1>
	<table width="" ="100" align="center" bgcolor="#f2f2f2">
		<tr>
			<td>用户名：</td>
			<td><input type="text" name="" id="" placeholder="请输入用户名">
			</td>
		</tr>
		<tr>
			<td>
				密码：
			</td>
			<td>
				<input type="password" name="" id="" placeholder="请输入密码">
			</td>
		</tr>
		<tr>
			<td>
				确认密码：
			</td>
			<td>
				<input type="password" name="" id="" placeholder="请重新输入密码">
			</td>
		</tr>
		<tr>
			<td>
				上传照片：
			</td>
			<td><input type="file" name="" id=""></td>
		</tr>

	</table>
</body>
</html>
半墓尘沙゜
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
HTML入门学习和简单使用
辰伏的博客
12-25 671
html 1. 网页 网页的构成 html ：编写网页 css ：美化网页 javascript ：动态效果 2. html概述 超文本标记语言 标签 属性 3. 基本语法 3.1 标签 3.2 嵌套 3.3 2.1 文本相关 2.2 图片 2.3 超链接 2.4 表单标签
HTML入门
weixin_42230478的博客
07-10 319
HTML概述： HTML：Hyper Text Markup Lanuage 超文本标记语言 超文本：比普通文本功能更加强大，可以添加各种样式 标记语言：通过一组标签，来对内容进行描述.&lt;关键字&gt; 是有浏览器来解释执行 常用标签： &lt;h1&gt;标题标签（取值范围1~6） &lt;/h1&gt;    换行标签&lt;br/&gt;  &lt;b&gt;加粗标签&l...
HTML入门标签
10-11
比较详细的HTML标签，常用到的标签都包括在内了。新手可以看看
学习html入门
12-24
学习HTML入门，首先要理解其基本结构和语法。 HTML由两大部分构成：头部（Head）和主体（Body）。头部不直接显示在页面上，但包含了许多对网页整体至关重要的元数据，如标题（Title）、字符编码（Character Set）、...
html入门学习.zip
01-01
html入门学习html入门学习html入门学习 html入门学习html入门学习html入门学习html入门学习 html入门学习html入门学习html入门学习html入门学习html入门学习 html入门学习html入门学习html入门学习 html入门学习html...
HTML 入门资料Demo
最新发布
01-23
HTML 入门手册(一)：https://shuaici.blog.csdn.net/article/details/135680716 HTML 入门手册(二)：https://shuaici.blog.csdn.net/article/details/135698613 HTML 英文全称 " HyperText Mark-up Language " , ...
HTML入门学习及笔记.zip
01-01
HTML入门学习及笔记HTML入门学习及笔记HTML入门学习及笔记HTML入门学习及笔记 HTML入门学习及笔记HTML入门学习及笔记HTML入门学习及笔记HTML入门学习及笔记 HTML入门学习及笔记HTML入门学习及笔记HTML入门学习及笔记...
html入门之—一天快速掌握
jishublog
08-12 190
编外话 如果你对html一无所知，还苦恼与html如何入门，笔者很建议你学习下这篇文章，可以让你快速掌握html，如果你已经是html的高手，那么也希望您给我以更好的建议。 概要 HTML俗称超文本标记语言，是Hyper TextMarkup Language的缩写，是用于描述网页文档的一种标记语言。网页文件本身只是一种文本文件，我们通过在文本文件中添加标记符号，可以告诉浏览器如何显...
HTML基础知识
m0_47256105的博客
12-13 267
文章目录网页的组成部分HTML介绍基本HTML页面介绍htmlheadtitlebodymetah1~h6HTML其他标签p标签a标签其他自结束标签HTML语法规范 网页的组成部分 一个网页由三部分构成：结构，表现还有行为 结构：HTML描述页面的结构 表现：CSS用于控制页面中元素的样式 行为：JavaScript用于相应用户操作 HTML介绍 • 它负责网页的三个要素之中的结构。 • HTML使用标签的形式来标识网页中的不 同组成部分。 • 所谓超文本指的是超链接，使用超链接可 以让我们从一个页面跳转到
html 入门（合集）
快乐程序猿的博客
02-11 307
一、静态页面和动态页面 判断页面是否动态页面或静态页面的标准在于：是否与服务器进行交互，不是具有“会动”的元素（如视频、Flash等）的页面就叫动态页面。 静态页面绝大部分由4类元素组成：文本、图形、多媒体文件（视频音频）和超链接。 二. 段落与文字1. 标题标签h1~h6 A. 一个页面中只能有一个h1，但可以有多个h2到h6。从h1到h6，级别越来越低，也就是字体越来越小。2. ...
html入门教程
打代码是一天，不打代码也是一天
03-17 4195
dl > < dt > 名词 < dd > 描述 …… < dl > < dt > 名词 < dd > 描述 …… < dt > 名词 < dd > 描述 …… < dl > < dt > 名词 < dd > 描述 ……
HTML入门教程
乐于探索,乐于奉献,追求极致,向往生活
09-02 738
初学前端内容，首先要学的当然是H5喽！目前HTML版本一直在演化，迭代；在了解HTML之前我们应该了解下基于Internet内容；Internet-（网）：由若干台电脑、手机、平板 通过 网线(WIFI) 连接起来的结构。 基于Internet上的程序         1、C / S 结构：Client / Server          特点：必须通过指定的客户端软件才能访问服务器端的一种...
HTML基础入门
程序员阿龙的博客
08-11 917
Java后端学习——HTML入门
HTML入门（详细）
热门推荐
qq_63525426的博客
05-03 2万+
HTML（全称为“超文本标记语言”）是一种用于创建Web页面的标记语言。它是Web开发的基础，允许开发者定义页面的结构、内容和样式。HTML使用一些标记或“标签”来描述文本和媒体内容的结构和格式，这些标签可以指示网页浏览器如何显示内容，包括标题、段落、列表、超链接、图像、音频、视频等等。HTML还可以与其他Web技术（如CSS和JavaScript）结合使用，以实现更复杂和交互性的Web应用程序。这篇文章只是介绍HTML的基础标签的使用。
html入门学习
付某人的博客
04-25 229
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&lt...
HTML入门：从基础到实践
"这是一份由浅入深的HTML入门教材，旨在帮助初学者掌握HTML的基础知识，包括HTML文档的基本结构和字符实体的使用。" 在Web程序开发中，HTML（超文本标记语言）是构建网页内容的核心语言。HTML文件本质上是包含一...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值