html笔记

(❁´◡双辞`❁)*✲ﾟ*

已于 2024-09-23 13:20:38 修改

阅读量968

点赞数 28

文章标签：笔记 html 前端

于 2024-09-23 13:07:17 首次发布

本文链接：https://blog.csdn.net/qq_73986726/article/details/142455213

版权

1.查阅文档推荐网址：

百度：百度一下，你就知道
W3C: w3school 在线教程

2.Web标准

结构，表现，行为，即html, css, javascript(js)

3.vscode中

Ctrl+加号键 Ctrl+减号键可以放大缩小视图

Ctrl+N 新建文件

<!DOCTYPE html>告诉浏览器当前网页用的是HTML5版本

<html lang = "en"> 当前页面采用英文显示

<html lang = "zh-CN"> 中文网站

<meta charset="UTF-8"> 字符集，采用UTF-8保存文字，不写会出现乱码

4.HTML常用标签

1.标题标签

<h1>-<h6> 一个标题独占一行，字号依次变小，依次变细

2.段落标签

<p></p> 段落中的文本会根据浏览器窗口大小自动换行；段落与段落之间有空隙

3.换行标签

<br/> (单标签)

4.水平分割线

<hr>

5.文本格式化标签

加粗<strong></strong>或<b></b>

倾斜<em></em>或<i></i>

删除线<del></del>或<s></s>

下划线<ins></ins>或<u></u>

都推荐使用前者，语义更强烈

6.<div></div> 和<span></span>标签

都是一个盒子，用来装内容

一个div独占一行，但一行可以多个span

7.图像标签

src 是<img>标签的必须属性，指定图像文件的路径或文件名

alt替换文本。图片不能显示的文字

title提示文本鼠标放到图像上显示的文字

width，height,boder设置图像的宽度，高度，边框粗细

只设置宽度或高度时图片会等比例缩放

图片标签中各个属性中间用空格隔开

8.超链接标签

不单独占一行

href 必须属性，指定链接目标的地址

target 指定链接页面的打开方式，_self为默认值，当前页面打开； _blank 新窗口打开

外部链接访问外网以http://开头加上外部地址

内部链接网站内部页面之间的链接

空链接没有确定链接目标时使用 #

下载链接 href里面地址是一个文件或压缩包，会下载这个文件

网页元素链接各种网页元素如文本，图像，表格，音频，视频等都可以添加超链接

锚(mao)点链接点击链接可快速定位到页面某个位置 (1)设置href属性为 #名字的形式 (2)找到目标位置标签，里面添加一个id属性 = 名字

9.注释标签

快捷键Ctrl+/

10.表格标签

<table>

<table>
    <tr>
        <td>单元格中的内容</td>
    </tr>
</table>

<tr> 用于定义表格中的行

<td> 定义表格中的单元格

表头单元格标签 <th> (table head缩写)

表头单元格中的文本内容加粗，居中显示

表格属性要写到table里面

align(left center right) 设置表格对齐方式，默认居左

border 设置表格边框，默认没有边框

cellpadding 像素值单元边沿与其内容之间的空白，默认1像素

cellspacing 像素值单元格之间的空白，默认2像素

width 像素值或百分比规定表格宽度

px可以不写

表头结构标签

<thead> 表格的头部区域

<tbody> 表格的主体区域

合并单元格

1.目标单元格：（写合并代码）

2.合并单元格三部曲：

例题

效果

11.列表标签

无序列表 ul li ul里面只能放li,其他标签和文字都不允许

有序列表 ol li

自定义列表

使用场景:

12.表单标签

在html中，一个完整的表单通常由表单域，表单控件（表单元素）和提示信息3个部分组成

表单域

用form定义一个表单域

form目前不用写属性

表单控件（表单元素）

1.input标签是单标签；一个必须属性type

type属性有：

text,password,radio（单选框）,checkbox（多选框），submit提交按钮（设置value值可以修改提交按钮里面的内容；点击提交按钮可以把form里面的表单元素提交给后台服务器），reset重置按钮，button普通按钮（后期结合js使用），file文件域按钮（上传文件时使用）

name属性：

name是表单元素名字，单选框必须有相同的名字，才能实现多选一；多选框也必须有相同的名字。name的主要作用就是区分不同的表单。

value属性：

规定input的值，只有文本框页面出现效果，其他的都不会显示

checked属性：

checked="checked"

单选按钮和多选按钮可以设置checked属性，当页面打开时可以默认选中这个按钮

maxlength属性：

正整数；规定输入字段中字符的最大长度