HTML基础知识全梳理:注释、属性、网页结构与元素类型
需积分: 5 28 浏览量
更新于2024-09-07
收藏 3KB TXT 举报
"html梳理"
HTML(HyperText Markup Language)是一种用于创建网页的标准标记语言,它在Web开发中扮演着至关重要的角色。本文将对HTML的关键知识点进行详细梳理,包括注释、属性、网页结构、字符编码、元素类型以及功能元素如表格和表单。
### 注释
在HTML中,注释是用来解释代码的,不会被浏览器解析执行。单行注释以`<!-- -->`包裹,多行注释则使用`/* */`。
### 元素
HTML元素由开始标签、内容和结束标签组成。例如`<div id='one'>helloworld</div>`,其中`div`是元素名,`id='one'`是属性,`helloworld`是内容。元素可以包含其他元素,如内部的`<div>`和`<span>`。
### 属性
- **核心属性**:如`id`、`class`、`title`和`style`,它们在很多元素上都通用。
- **特有属性**:根据元素不同,有些特定的属性,如`a`元素的`href`和`target`,`img`元素的`src`和`alt`。
- **H5拓展属性**:以`data-`开头的自定义属性,用于存储额外的数据。
### 网页结构
HTML文档通常由`<!DOCTYPE>`声明开始,声明文档类型。接着是`<html>`元素,分为`<head>`和`<body>`两部分。`<head>`包含元信息,如`<title>`定义页面标题,`<meta>`设置字符编码(如`charset=utf-8`)。`<body>`是网页内容的主要区域。
### 元素类型
#### 块元素
块元素如`<div>`、`<p>`、`<h1>`至`<h6>`、`<html>`、`<body>`、`<ul>`、`<li>`等,它们默认占据一整行,并且宽度默认为100%。块元素可设置宽高,常用于构建页面布局。
#### 行内元素
行内元素如`<span>`、`<a>`、`<img>`、`<strong>`等,它们在同一行内显示,宽度和高度由内容决定,不能直接设置宽高。行内元素不能包含块元素,但块元素可以包含行内元素。
#### 功能元素
- **表格**:`<table>`元素用于创建表格,`<caption>`定义表格标题,`<thead>`、`<tbody>`和`<tfoot>`分别表示表头、主体和页脚,`<tr>`定义行,`<th>`定义表头单元格,`<td>`定义普通单元格。
- **表单**:HTML表单允许用户输入数据,主要元素包括`<form>`、`<input>`(多种类型如文本、密码、提交按钮等)、`<select>`(下拉菜单)、`<option>`(下拉菜单的选项)、`<textarea>`(多行文本输入)和`<label>`(与输入控件关联的标签)。
以上内容仅为HTML基础知识点的简要概述,实际使用时还需要了解更复杂的布局技巧、事件处理、表单验证以及与CSS和JavaScript的交互等方面的知识。HTML5引入了许多新的语义化元素,如`<header>`、`<nav>`、`<article>`等,这些元素增强了页面的可读性和可访问性,让网页结构更加清晰。
431 浏览量
2010-03-24 上传
670 浏览量
194 浏览量
2024-10-18 上传
2024-07-31 上传
105 浏览量
2024-03-18 上传
2023-06-05 上传
「已注销」
- 粉丝: 0
- 资源: 1
最新资源
- git-sizer:为Git存储库计算各种大小指标,并标记可能导致问题的指标
- 电影评论
- Right-Click Search IMDb-crx插件
- 易语言超级列表框首字母排序
- a-A-Homewoks
- Varnish-Directadmin:Directadmin 的清漆缓存
- Eco Search-crx插件
- 易语言超级列表框选择多项内容
- 新建文件夹_海洋_motherw78_海图
- Burst Search-crx插件
- rpush:从任何子reddit向专用的Pushbullet频道发送近乎实时的更新
- 培训项目:仅用于培训
- dtmoney
- 基于戴维南模型_扩展卡尔曼_SOC估算_soc卡尔曼_soc卡尔曼_电池SOC估算_电池SOC_SOC估算
- xcode-git-cfbundleversion:使用短的 Git 修订字符串更新 Info.plist 文件中的 CFBundleVersion
- express-swagger-example:用于演示Express API文档的示例项目