本文详细介绍了HTML的基本概念，包括网页的组成、HTML的作用、web标准的三个方面（结构、表现、行为）。强调了标签的语义性和常用标签的使用，如标题、段落、图像、超链接。还涵盖了表格和列表的创建，以及表单元素的使用，如input、select、textarea等，为初学者提供了全面的HTML入门知识。
html初识
一、网页相关概念
1.网页是图片、链接、文字、声音、视频等元素组成, 其实就是一个html文件(后缀名为html)
2.网页生成制作: 有前端人员书写 HTML 文件, 然后浏览器打开,就能看到了网页.
3.HTML: 超文本标记语言, 用来制作网页的一门语言. 有标签组成的. 比如 图片标签 链接标签 视频标签等
二、web标准
结构（网页元素的整理-html），表现（颜色等-css），行为（定义及交互-js）
三、标签的语义
每个标签都有自己的语义，记住标签的语义，把合适的标签放在合适的地方，可以让页面结构更清晰。
四、html基本结构标签
1、<!DOCTYPE html>文档类型声明 （采取什么版本显示网页）位置必须在文档的开头
2、<lang> 定义当前文档的语言 en英语 zh-CN中文
3、charset 字符集 可以通过<meta>标签中的charset属性来定义文档文字类型 （UTF-8万国码）
五、常用标签及字符
1、标题标签：<h1>-<h6>特点：独占一行，大小依次递减，都加粗
2、段落标签：<p></p>特点：文本在一个段落中会根据浏览器窗口的大小自动换行，段落跟段落之间有空隙
3、换行标签：<br/>特点：单标签
4、特殊字符：  ；空格 <；小于号 >；大于号
5、注释：<!--内容-->ctrl+/快捷键
六、文本格式化标签(突出重要性)
1、<strong></strong>或者<b></b>加粗(推荐用strong)
2、<em></em>或者<i></i>倾斜（推荐用em）
3、<del></del>或者<s></s>删除线（推荐用del）
4、<ins></ins>或者<u></u>下划线（推荐用ins）
七、div和span标签
1、<div></div>特点：独占一行 大盒子
2、<span></span>特点：一行上可以有多个 小盒子
八、图像标签
<img src="文件名"/> 注：src是<img>标签的必须属性，用于指定图像文件的路径和文件名
属性：alt 替换文本，图像不能显示时出现
title提示文本，鼠标放在图像上显示的文字
width宽，height高（宽高只设置一个的时候，另一个会等比例变化）
注：属性都要写在图像标签名后面，属性之间没有先后顺序，但属性之间必须有空格
九、html文件路径
1、相对路径：图片相对于HTML页面的位置 同一级只用写图像名 下一级要将保存图像文件夹的名字加上上一级的名字 上一级../文件名
2、绝对路径：从盘符开始到图片名或者网址
十、超链接标签
分类：1、外部链接
2、内部链接，目录文件夹内的相互跳转，直接写文件名
3、空链接<a href ="#"</a>
4、下载链接 地址链接的是文件 xx.exe或者是 zip等压缩包的形式
5、网页元素的链接
6、锚点链接<a herf="#名字"></a> 再去跳转的目标位置标签里设置id名字
表格和列表
一、表格（展示数据）标签
1、<table></table>定义表格的标签
2、<tr></tr>定义表格的行
3、<td></td>定义单元格
4、<th></th>表头单元格标签 加粗居中显示
二、表格属性
align 对齐方式
border 边框
cellpadding 内容与边框的距离
cellspacing 单元格之间的距离
三、表格结构标签
<thead>头部标签 <tbody>主体标签
四、合并单元格
跨行合并（上下） rowspan=""
跨列合并（左右）colspan=""
目标单元格：跨行最上，跨列最左
五、列表（布局）标签
1、无序列表：<ul><li></li></ul>
特点：列表之间没有顺序，<ul>里面只能放<li>,不能放其他标签和文字，<li>里面放什么都可以，带有自己的样式属性可以用css来设置
2、有序列表：<ol><li></li></ol>
特点：跟无序列表一样
3、自定义列表：<dl>
<dt>名词</dt>
<dd>解释名词</dd>
</dl>
六、表单
1、表单（收集用户信息）标签
2、表单域：<form></form>将表单元素信息提交给服务器
属性： action=“url地址” method=“提交方式” name=“表单域名称”
3、input输入表单元素 （收集用户信息）<input type="属性值"/>
①text文本框 ②password密码 ③radio单选按钮（必须有相同的名字，才能实现多选一）
④checkbox复选框（必须有相同的名字）⑤value=“值”
⑥单选按钮和复选按钮可以用checked属性，当页面打开的时候自动勾选
⑦maxlength限制长度 submit提交按钮（可以通过value更改内容） reset重置按钮
⑧button普通按钮，启动js
⑨file文件域（上传文件）
⑩label标签<label for="值">内容</label> <input id="值">将元素进行捆绑
4、select下拉表单元素
①格式：<select><option></option></select>
②selected默认选中
5、textarea文本域表单元素（输入内容较多时）
①格式：<textarea>显示的文字</textarea>
②cols=“”（每行的字数）rows=“”（每列的字数）
扫一扫
2876
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
