html学习笔记

最新推荐文章于 2024-10-09 11:42:00 发布

Serendipity``

最新推荐文章于 2024-10-09 11:42:00 发布

阅读量109

点赞数

分类专栏：前端学习文章标签： html 学习

本文链接：https://blog.csdn.net/tu_gou/article/details/127108884

版权

前端学习专栏收录该内容

2 篇文章 0 订阅

订阅专栏

本文介绍了HTML的基本标签，包括标题、段落、图像、超链接、表格、列表和表单等。重点讲解了如何使用<div>和<span>进行布局，以及<img>和<a>标签的属性。还详细阐述了表格的结构和样式调整，以及列表的类型和用法。此外，探讨了表单元素如<input>、<select>和<textarea>的用途和属性，以及如何利用<label>提高用户体验。

摘要由CSDN通过智能技术生成

<!DOCTYPE html> document type

<h1>-<h6> 标题标签 h：head

<p> 段落标签 p：paragraph

<br /> 换行标签 br：break

<strong>或<b> 加粗

<em>或<i> 倾斜

<del>或<s> 删除线

<ins>或<u> 下划线

布局标签

<div> 一行只能放一个，大盒子

<span> 一行可以放多个，小盒子

<img src="图像url" /> 图像标签

图像标签的属性：

Src 图片路径必须属性

Alt 文本替换文本，当图像加载不出来时显示的文字

Title 文本提示文本，鼠标放在图像上显示的文字

Width height border 像素设置图像的宽、高、边框粗细宽度高度修改一个的时候，另一个随之等比例的缩放

<a> anchor 超链接标签从一个页面跳转到另一个

<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>

Href 连接目标url地址

Target 页面打开方式 _self位默认值，_blank位在新窗口中打开方式

空链接：href=”#”

若链接里是一个文件或者压缩包，会直接下载这个文件

网页中的各种元素如文本图像等都可以添加超链接

锚点链接：点击链接，可以快速定位页面的位置

在链接文本的href属性中，设置属性值为#名字的形式：<a href=#two>第二集</a>

找到目标位置标签，里面添加一个id的属性=刚才的名字，<h3 id="two">第二季介绍</h3>

注释  ctrl+/

特殊字符：空格:  大于号：> 小于号：<

表格标签：<table>

<tr>

<td>单元格内容</td>

</tr>

<table>

展示数据

表头单元格标签：<th> 表头中元素加粗居中 table head

表格属性：（写到<table …>省略号处）

属性	属性值	含义
align	Left center right	对齐方式
Border	1 ""	边框有无 “”为默认
Cellpadding	像素值	默认1像素，单元格内文字与边框间距
Celllspacing	像素值	默认2像素，单元格间距
Width/height	像素值/百分比	宽/高

表格结构标签：分为表头、表格主体 <thead。 <tbody>

合并单元格：方式：跨行：rowspan=“合并个数” 最上侧

跨列：colspan=“合并个数” 最左侧

删除多余的单元格

列表标签：无序列表：<ul> ------只能嵌套<li>

<li> 列表项 </li> -----可以放任何元素

</ul>

有序列表：<ol> ------只能嵌套<li>

<li> 列表项 </li> -----可以放任何元素

</ol>

自定义列表：<dl> ------只能嵌套<li>

</dl>

表单标签：表单域、表单控件、提示信息

表单域：<form action="url" method="提交方式" name="表单名"></form> ----将信息提供给服务器

表单控制： input 输入 select 下拉 textarea 文本域

input：<input type="属性值"> 单标签

属性值	作用
Text	文本框
Password	密码字段，掩盖
Radio	单选按钮
Checkbox	复选框（多选方框）
Name	表单元素名字
Value	表单元素值，在文本框内显示
Submit	提交按钮，将表单提交到服务器，用value更改按钮中的文字信息
Reset	重置表单
Button	点击按钮
File	上传文件
Placeholder