html总结

最新推荐文章于 2024-10-04 06:11:34 发布
最新推荐文章于 2024-10-04 06:11:34 发布
阅读量152 收藏 3
点赞数 2
文章标签： html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/YJY131248/article/details/118276199
版权

文章目录


前言：

华中农业大学公共管理学院web程序设计与开发期末复习整理
代码环境：vscode

html概念

html：Hyper Text Markup Language，超文本标记语言。是一种用于网页制作的排版语言，是web最基本的构成元素。

标记

分为单一标记和成对标记。单一标记是只要一个标记就能完成所要的功能；成对标记是需要两个标记组合才能完成所需功能。

一些常用的标记：

在这里插入图片描述

标记的属性：标记需要各种属性来制作各种效果。例如下方代码，其中的font是标记，size和color是属性，hello world是受影响的文本：

<font size=4 color=red>hello world</font>

html的注释使用方式

<--! 这里是注释 -->

特殊字符的使用

  • 以“&”开始
  • 以“;”结束
  • 中间是特定字符：Lt表示小于号、Gt表示大于号、Quot表示双引号

html文件结构

<--! html文件结构 -->
<html>
	<head>
	    <title>这里是文件名</title>
	</head>
<body>
    这里是正文
</body>
</html>

body的属性

  • background：参数为文件名，网页的背景图像
  • bgcolor：参数为颜色，网页的背景色
  • text：参数为颜色，文本颜色
  • link：参数为颜色，未被访问过的超文本链接的颜色，默认是蓝色
  • vlink：参数为颜色，被访问过的超文本链接的颜色，默认是蓝色
  • alink：参数为颜色，设置超文本链接被访问瞬间的颜色，默认为蓝色
<body background="123.jpg" text="red" link="blue" vlink="red">
	……
</body>

标题

<html>
	<head>
		<tltle>
			标题的使用
		</title>
	</head>
	<body>
		<h1>标题一</h1>
		<h2>标题二</h2>
		<h3 align=left>标题三</h3>
		<h3 align=center>标题四</h3>
		<h3 align=right>标题五</h3>
		<h>标题六</h>
	</body>
</html>

结果如下：
在这里插入图片描述

锚点

<a href="地址"> 热点文字 </a>
<a href="#记号名"> 热点文字 </a>
<a href="mailto:E-mail地址"> 邮件地址 </a>

表格

<table border=1 width=50% height=40% cellspacing=1 cellpadding=1>
	<caption align=center valign=top>标题</caption>
	<tr><th colspan=2>表头1</th><th>表头2</th></tr>
	<tr><td rowspan=2>数据1</td><td>数据2</td><td>数据3</td></tr>
	<tr><td>数据4</td><td>数据5</td></tr>
</table>

结果如下：
在这里插入图片描述

图像

<img src="图像文件名" alt="简单说明" width=100 height=100 border="边框宽度" align="center">

音频视频

<EMBED SRC="地址">

框架

用来向浏览器窗口中装载多个html文件
综合实例：
index.html

<html>
<head>
<title>帧标志的综合示例</title>
</head>
<frameset cols="25%,*">
<frame src="menu.html" scrolling="no" name="Left">
<frame src="page1.html" scrolling="auto" name="Main">
<noframes>
<body>
<p>对不起，您的浏览器不支持“帧”！</p>
</body>
</noframes>
</frameset>
</html>

menu.html

<html>
<head>
<title>目录</title>
</head>
<body>
<p><font color="#FF0000">目录</font></p>
<p><a href="page1.html" target="Main">链接到第一页</a></p>
<p><a href="page2.html" target="Main">链接到第二页</a></p>
</body>
</html>

page1.html

<html>
<head>
<title>第一页</title>
</head>
<body bgcolor=red>
<p align="center"><font color="#8000FF"size=7>这是第一页！</font></p>
</body>
</html>

page2.html

<html>
<head>
<title>第二页</title>
</head>
<body bgcolor=blue>
<p align="center"><font color="#FF0080"size=7 >这是第二页！</font></p>
</body>
</html>

结果：

动态字幕

基本格式：

<marquee align="top/middle/bottom" bgcolor="颜色" width=x height=y direction="left/right" loop=i/-1/infinite behavior="scroll/side/alternate" hspace=m vspace=n scrollamount=n scrolldelay=n> 字幕文字 </marquee>

其中：

  • direction：文字滚动的方向
  • loop：循环次数
  • behaviour：scroll设置文字单向流动 side设置文字到达边界停止 alternate文字到达边界反向流动
  • hspace：水平方向空白像素数
  • vspace：垂直方向空白像素数

在这里插入图片描述

表单

form属性：

  • action：处理程序的程序名，参数是用来接收变淡信息的url
  • method：定义处理程序从表单中获得信息的方式，参数为GET/POST
  • target：指定目标窗口和目标帧。参数：当前窗口_self，父级窗口_parent，顶层窗口_top，空白窗口_blank

写入标记input:

  • type:text、password、submit、checkbox（复选框）、radio（单选按钮）、reset（重设按钮）、button
  • value:用来保存用户的输入和选择。服务器通过调用输入区域的value属性值来获得该区域的数据
  • name:用来输入域名。便于用户墙出当前作的选择和输入的内容保存的位置。只有含有域名的数据才会发送到服务器端

select和option标记

  • select标记：双标记，创建一个下拉列表框或可以复选的列表框，用于form标记对之间
<SELECT Name="select_name" Multiple Size="n"></SELECT>
  • option标记：双标记，指定列表框中的一个选项，用在SELECT标记对之间,selected表示默认选项
    在这里插入图片描述
    文本区域：
    用在form标记对内部，textarea
    在这里插入图片描述
看风结种子
关注
HTML 知识点总结
m0_57202083的博客
08-12 2502
HTML实例 <!DOCTYPE html> <!-- 注:<!DOCTYPE>标签没有结束标签! --> <html><!-- 元素是 HTML 页面的根元素 --> <head><!-- (头部部分) --> <meta charset="utf-8"> <title>显示在浏览器标题栏中的标题</title> </head> <body>&.
HTML学习内容总结
qq_48681023的博客
07-10 2272
HTML学习总结
HTML总结
weixin_41350225的博客
11-25 692
HTML总结HTML文本标签标题普通文本标签段落标签文章标签文章中的节标签布局标签图片显示超链接标签框架标签列表标签无序列表有序列表定义列表表格标签表单标签位于form内的一些标签label标签input标签Value属性多行文本域textarea标签下拉框select标签H5表单相关emailurlnumberrangecolor日期选择器Input上新增的属性requiredpatternfo...
HTML总结（一）
qq_46071321的博客
05-26 217
首先，先来了解什么是HTML。 HTML指的是超文本标记语言，它是用来描述网页的一种语言。 HTML不是一种编程语言，而是一种标记语言。 标记语言是一套标记标签。 所谓超文本，有两层含义： 1.它可以加入图片、声音、动画、多媒体等内容（超越了文本限制）。 2.它还可以从一个文件跳转到另一个文件，与世界各地主机的文件链接（超级链接文本）。 一、HTML语法规范 标签关系 双标签关系可以分为两类：包含关系（父子关系）和并列关系（兄弟关系） (1）包含关系（父子关系） <head> <title
HTML总结【详细】
CYL_2021的博客
03-18 2721
什么是HTML？ HTML 是 HyperText Markup Language（超文本标记语言）的缩写，它是用于创建网页 的标准标记语言。HTML 使用标记标签来描述网页，由浏览器来解析，即使用 HTML 来建 立 Web 站点，通过 Web 浏览器读取 HTML 文档，并以网页的形式显示出来。 一.网页.html页面主要内容 <!-- 文档类型声明，作用就是告诉浏览器使用那种HTML版本来显示网页，下面是HTML5 --> <!DOCTYPE html> 用来定义当前文档.
HTML总结思维导图,HTML总结思维导图
11-03
HTML总结思维导图,HTML总结思维导图
HTML精心总结
07-31
根据w3c的HTML学习精心总结 w3c的HTML总结 HTML学习资源
HTML 知识点总结
01-02
HTML 知识点总结 HTML 知识点总结 HTML 知识点总结 HTML 知识点总结
Html学习的代码及总结.zip
01-01
Html学习的代码及总结Html学习的代码及总结Html学习的代码及总结 Html学习的代码及总结Html学习的代码及总结Html学习的代码及总结 Html学习的代码及总结Html学习的代码及总结Html学习的代码及总结 Html学习的代码及...
html5学习总结
Nemo的笔记本
04-12 1894
语言设置：&lt;body lang="en"&gt;快捷键设置（使用Alt+所设字母）：&lt;input type="text" name="txt" value="" accesskey="G"/&gt;作用：使用alt+G直接跳到文本框里Tab切换（常用登录帐密切换）：&lt;a href="http://www.baidu.com" acc
html总结与理解，自己的心得
chen983234416的博客
11-14 9178
    首先什么是html，它用来做什么，他有什么用 html是个缩写，全名为HyperText  Markup Language，中文名字叫做，超文本链接语言，是用来做静态网页的，也是做动态网页的基础，作用的话就是做个标记，用来让浏览器解析，最后显示出页面。     接下来我解释下什么叫做超文本，什么叫做标记，什么叫做语言，什么叫做静态网页，动态网页，什么是浏览器解析标记 1、超文本：顾名...
HTML总结——页面内容的表现
哈哈哈哈的博客
10-27 2557
一、HTML的基本结构 &lt;html&gt;         &lt;head&gt; &lt;/head&gt;//内含：&lt;title&gt;&lt;meta&gt;&lt;link&gt;&lt;style&gt;&lt;script&gt;&lt;base&gt;等结构         &lt;body&gt;&lt;
html中的文本标签(含标签的实现案例)
2301_76862031的博客
10-01 825
html中常用的标签h,p,hn,hr,br,font,time,mark,cite,特殊字符标签，图像标签
【前端开发入门】html快速入门
qbbmnnnnnn的博客
09-29 1111
本篇介绍html的相关内容，包含文档流的概念以及块级元素和行内元素等。同时强调了有关代码编写习惯性问题。
XHTML 简介
最新发布
wjs2024的博客
10-04 274
XHTML作为一种严格的、基于XML的标记语言，为网页设计和开发提供了良好的可读性、可维护性和扩展性。尽管HTML5已成为当前主流的网页标记语言，但XHTML在特定领域仍然具有广泛的应用价值。
【CSS/HTML】左侧固定，右侧自适应的布局方式理解margin负值理论
mengran_code的博客
09-29 713
简单解释下flex: 0 0 200px的用处，flex属性是flex-grow, flex-shrink 和 flex-basis的简写，默认值为0 1 auto。如果一个项目的flex-grow属性为2，其他项目都为1，则前者占据的剩余空间将比其他项多一倍。它的默认值为auto，即项目的本来大小。如果一个项目的flex-shrink属性为0，其他项目都为1，则空间不足时，前者不缩小。flex-shrink属性定义了项目的缩小比例，默认为1，即如果空间不足，该项目将缩小。是固定宽度的div脱离文档流。
HTML的修饰(CSS) -- 第三课
ZxVSaccount的博客
10-01 946
前面我们已经了解了html的一些基本使用方法,我们再写html代码的时候不可避免的会改变其中的一些样式,而这就有一种专门的方式用来修饰html编写的网页的样式,它就是css!本节主要介绍了css 的基本用法和属性,内容较多,多多练习,熟能生巧!
HTML常用标签总结及用法实例
经过一段时间的学习，对于HTML也有了基础的认识。在网页基本结构中，一个HTML网页最基本由网页头...希望通过对HTML常用标签的总结和学习，能够帮助大家更好地理解和应用HTML标签，为日后的网页开发工作打下坚实的基础。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值