HTML总结

简介: 块级元素各占据一行,垂直方向排列;块级元素以新行开始,以换行结束。内联元素在显示时通常不会以新行开始,相邻的行内元素会排列在同一行例,直到一行排不下才会换行。块级元素可以包含行内元素和块级元素。行内元素不能包含块级元素。行内元素与块级元素属性的不同,主要是盒模型属性上:行内元素设置width无效,height无效,其宽度随元素的内容而变化,margin上下无效,padding上下无效。块级元素可以设置宽、高,盒模型各属性也均能成功设置。

注释

<!—要注释的内容-->


基本标签

标题标签:<h1>-<h6>


段落标签:<p>


换行标签:<br/>


水平线:<hr/>


预定义格式文本:<pre>


注:重点学习HTML特殊符号、HTML文本格式化便签


a标签

href属性

外部链接:点击访问京东


<a href="http://www.jd.com”>京东</a>


内部链接:点击访问项目内部html网页


<a href="new file.html”>内部网页</a>


锚点链接:点击跳转到当前页面的锚点“works”处


<a href="#works>主要作品</a>


锚点链接:点击跳转到index.html页面的锚点“works”处


<a href="index.html#works>主要作品</a>


target属性

_blank表示在新窗口中打开链接


_self 默认,表示在当前窗口打开链接。


a元素的常用CSS伪类

a:link{}用于设置超链接点击之前的样式;


a:visited{}用于设置超链接被访问过之后的样式;


a:hover{}设置鼠标悬停在标签上的样式;


a:active{}设置鼠标点击标签但不松手时的样式。


表格

重点学习基本语法,理解跨行、跨列表格单元格 https://cxzy.oszine.com/caixun/7hqv7RXNqx.html?=aliyunhttps://www.qqkjcj.com/xykyqzyxshkjrjmykbz.html?=aliyunhttps://ljkc.yushengbang.com/zsjf/JCUEdFhx51.html?=aliyunhttps://ljkc.yushengbang.com/cczs/KggNHZROVo.html?=aliyun


表单

<form>标签:用于定义表单,<form>标签有两个比较重要的属性:    


action属性:定义表单的提交地址。通常,表单会被提交到Web服务器上的网页,如果该属性值省略,则会提交到当前页面。


method属性:规定在提交表单时所用的HTTP方法(GET或者POST).


<Input>标签:常用的表单输入标签,其输入类型包括:text(文本域)、password(密码域)、radio(单选按钮)、checkbox(复选框)、button(按钮)、submit(提交按钮)等。


块级元素和内联(行内)元素

块级元素

<h1>-<h6>、<p>、<div>、<ul>、<ol>、<li>、<table>、<form>等


内联(行内)元素

<a>、<img>、<input>、<span>、<strong>、<button>等。 https://cxfx.nuochengzx.com/zhaiquan/93WEyM2mir.html?=aliyunhttps://jmgc.nuochengzx.com/xinyong/k2GZ7fP1Lh.html?=aliyunhttps://hcx.twitdw.com/zhengxin/83W2Shkw04.html?=aliyunhttps://cdh.twitdw.com/pingtai/SrQGGTKDA3.html?=aliyun


区别

块级元素各占据一行,垂直方向排列;块级元素以新行开始,以换行结束。内联元素在显示时通常不会以新行开始,相邻的行内元素会排列在同一行例,直到一行排不下才会换行。

块级元素可以包含行内元素和块级元素。行内元素不能包含块级元素。

行内元素与块级元素属性的不同,主要是盒模型属性上:行内元素设置width无效,height无效,其宽度随元素的内容而变化,margin上下无效,padding上下无效。块级元素可以设置宽、高,盒模型各属性也均能成功设置。

头部元素

<link>标签

定义文档与外部资源之间的关系,最常用于连接样式表。链接样式表的基本语法: <link rel="stylesheet"  href="URL">。


<meta>标签

提供关于HTML文档的元数据。例如作者、日期和时间、网页描述、关键词、页面刷新等。如:


<meta name="description" content="信息参数" /> 用于描述网页


<meta name="keywords" content="信息参数" /> 用于描述网页关键词


<meta name="author" content="信息参数"> 用于描述网页作者


<meta http-equiv="content-type" content="text/html; charset=信息参数" /> 用于提供HTTP协议的响应头报文


<meta http-equiv="refresh" content="30" url="网址参数"> 用于规定页面刷新时间为30s。

————————————————

相关文章
|
5天前
|
缓存 人工智能 安全
GPT-5.6 Terra与GPT-5.5性能实测:成本减半后的跑分对比与快速迁移指南
GPT-5.6 Terra 的定价为每百万 token 输入 2.50/输出 15。GPT-5.5 则是 5/ 30。Terra 的每一项费率,包括 $0.25/M 的缓存读取,都恰好是 GPT-5.5 的一半,因此在任何工作负载组合下,Terra 都固定 便宜 2.0x。以每天 10 万次请求、3K token 提示词计算,大约是 Terra 每天 2,000,GPT−5.5每天 4,000,即每月约 60,000对 120,000。问题在于:OpenAI 没有发布任何针对 Terra 的编码基准。那个著名的 91.9% Terminal-Bench 数字是 Sol 在 Ul
|
12天前
|
存储 关系型数据库 MySQL
云数据库自研存储引擎:阿里云 PolarDB 相比开源 MySQL 性能提升数倍
云数据库自研存储引擎已成为云原生数据库竞争的核心技术高地。阿里云 PolarDB 通过 X-Engine 高压缩存储、PolarStore 用户态 IO + RDMA、IMCI 列存 HTAP 三大自研引擎组合,配合物理日志、跨节点 Buffer Pool 共享、Parallel Query 五大优化,实现写性能 6 倍、压缩 3-5 倍、AP 加速 100 倍、IO 延迟 -80% 的全面超越,让客户存储成本下降 65%、DBA 人力节省 80%。
454 114
|
5天前
|
人工智能 缓存 JSON
刚刚 GPT-5.6 发布,吊打 Claude 5 和 Grok 4.5?一手实测来啦!
GPT-5.6 刚发布,跑分号称超越 Fable 5,真的假的?附一手实测,让 3 个最强 AI 编程模型 GPT-5.6 Sol、Claude Fable 5、Grok 4.5 在 Cursor 里同时一把梭开发网页游戏,看看最新模型到底谁更能打。
311 0
|
5天前
|
存储 人工智能 JSON
Qwen 本地部署搭配 ComfyUI 生成 AI 漫剧完整实操指南(小白零基础可落地,零成本无限生成+角色一致性天花板)
2026全网最优本地漫剧流水线:零成本、离线运行、角色统一、低配(8G显卡)可跑。融合Qwen本地大模型+ComfyUI双引擎,实现剧本生成→分镜绘图→动态成片全自动,隐私安全、无审核限流,新手30分钟上手,日更无忧。(239字)
|
28天前
|
Linux 程序员 数据格式
【2026最新】Notepad++下载、安装和使用一篇搞定(附中文版安装包)
Notepad++ 是一款免费开源、轻量高效的 Windows 文本编辑器,支持 C/Python/HTML 等 80+ 语言语法高亮、代码折叠、正则替换、编码转换及插件扩展,专为程序员与文本处理用户打造,完美替代系统记事本。(239字)
|
2天前
|
缓存 UED 开发者
Codex109天重置23次,明天还要再送一次
Codex近109天完成23次额度重置,7月14日将迎来第24次。Tibo高频响应用户反馈:优化GPT-5.6高消耗问题、补发失效福利、调整重置时间——形成“反馈→回应→修复→补偿”正向闭环,彰显以用户为中心的产品哲学。(239字)
421 11