HTML简单了解和基础知识记录

参考视频

html的用途

超文本标记语言(英语:HyperText Markup Language,简称:HTML),用来显示网页的文字和框架结构,可以认为是网页的骨架。

标签/元素

用于定义文字图片连接等,分为双标签和单标签。
双标签格式:<标签名字> 标签修饰的内容 </标签名字>;例如

html 复制代码
<p>这是一个段落</p>
<h1>这是一个一级标题</h1>

单标签:<标签名字 内容>,有些有内容有些没有

html 复制代码
<input type="text">  //一个输入
<br> //换行
<br> //一条分割横线

主要写的内容是标签内的内容

常用的小知识

c 复制代码
//都是双标签,修改段落P中字体的标签
字体加粗:b ;斜体:i; 下划线:u; 删除线:s

//列表标签
无序列表ul;其中包含多个列表标签li
有序列表ol:其中包含多个列表标签li

//表格标签
表格table,
属性,border(表格边框线宽度赋值一个字符形式)
第一行标签th //table header
行标签tr //table row
列标签 td   //table data

//a标签和img标签都不会自动换行!!
//把标签包含的内容,连接到其他路径
连接标签 a
href属性,定义连接url,当是  #  时表示不跳转
target属性,打开连接的方式,在新窗口或本页等打开

//图片标签
图片标签img
属性src,路径或图片链接
alt ,用于图片替换文本,图片无法显示的时候
with,图片宽度
height,图片高度

//分割块
div 并无意义就是为了分开整体结构布局

//没有特殊元素的标签
span,不独占一行,为了把文本内容包装起来,方便css和js修改

//表单标签
form标签
label双标签,标识input
	for属性,后面跟id名字,为了作用那个id
包含input标签,单标签,
	type属性,text,password(非明文显示)等;
	placeholder属性,默认显示的内容提示
	value属性,实际填充值
	radio属性,勾选
	name属性,是gender时,表示radio单选
action属性
	表单向那个ufl提交,使用#表示只是占位不跳转

标签的属性

语法规则

c 复制代码
<标签名字 属性名称='属性值'> ,,,</标签名字> //属性值使用英文的单引号或双引号都行

属性名称 不区分大小写,但属性值区分大小写 ,适用于大部分html属性,下面的属性配合CSS批量修改标签形式

块元素和行内元素

就是标签是不是独占一行,下个标签自动换行行内元素不能包含块元素

常见块标签(独占一行):div,p,h1,ul ,table,form等

常见的a,img strong等

相关推荐
用户0595401744629 分钟前
LLM对话记忆测试踩坑实录:手工回归30分钟,自动化后2分钟发现3个隐藏Bug
前端·css
Ashley的成长之路2 小时前
前端性能优化实战手册·第2篇:资源加载策略全解
前端·性能优化·资源加载·http/3·性能优化实战·资源加载优化
浅水壁虎2 小时前
vue基础(第二章 )
前端·javascript·vue.js
界面开发小八哥2 小时前
界面控件DevExtreme v26.1新版亮点——支持Angular 22
前端·javascript·angular.js·devexpress·ui开发·devextreme
Getflare2 小时前
前端 + UI 设计 + AI:这不是三个工种,是一个新三角能力模型(附自检清单)
前端·人工智能·ui
oil欧哟2 小时前
我做了一个 Vibe Coding 术语学习站:VibeHub
前端·ai·agent·独立开发·vibe coding
审小匠OpenCPAi3 小时前
银行流水核查怎么自动化?单边匹配、双向勾稽与图聚类异常检测的工程对比
java·前端·人工智能·python·审计
Revolution613 小时前
一个公共表格组件,是怎么一步步失控的
前端·前端工程化
腻害兔3 小时前
【若依项目-产品经理视角】RuoYi-Vue-Pro 源码拆解:CRM 客户关系模块深度解析——从线索到回款,一套完整的 B2B 销售闭环是怎么搭的?
java·前端·javascript·vue.js·产品经理·ai编程