HTML5基础

1.HTML网页结构

<!DOCTYPE html>

<html>

<head lang="en">

<meta charset="utf-8"/>

<title>我的第一个网页</title>

</head>

<body>

我的第一个网页

</body>

</html>

2.基本标签

|-------------|------------------------------------|--------------------------------------------------|
| 名称 | 标签 | 示例 |
| 标题标签 | <h1>~<h6> | <h1>静夜思</h1> |
| 段落和换行标签 | <p>...</p><br/> | <p>床前明月光<br/>疑是地上霜</p> |
| 水平线标签 | <hr/> | <hr/> |
| 斜体 | <em>...</em> | <em>举头望明月</em> |
| 字体加粗 | <strong>...</strong> | <strong>低头思故乡</strong> |

3.特殊符号

|-----------------|---------------------|---------------------------------------------------------------------------------------------------------------------|
| 特殊符号 | 字符实体 | 示例 |
| 空格 | &nbsp; | <ahref="#">百度</a>&nbsp;|&nbsp; <ahref="#">新浪</a> |
| 大于号**(>)** | &gt; | 如果时间**&gt;晚上6点,就坐车回家** |
| 小于号
(<)** | &lt; | 如果时间
&lt;早上7点,就走路去上学** |
| 引号
(")** | &quot; | **W3C
规范中,HTML的属性值必须用成对的**&quot;引起来 |
| 版权符号
©** | &copy; | &copy;2018课工场 版权所有 |

4.图像标签

语法 <img src="path" alt="text" title="text" width="x" height="y"/>

src图像地址 alt图像的替代文字 width图像宽度 height图像高度

5.链接标签

语法 <a herf="" target="">链接文本或图像</a>

6.超链接的应用

1、页面间链接:A页到B页,网上常见链接

<a href="detail.html" target="_blank">姑娘,欢迎降落在这残酷的世界</a>

2、锚链接:跳至自身固定位置,或A页跳到B页固定位置,需锚标记

创建跳转标记 <a name="marker">乙位置</a>

创建跳转标签 <a herf="#marker">甲位置</a>

3、功能性链接:电子邮件、QQ、MSN等链接

<a href="mailto:ke@kgc.cn">联系我们</a>

7.行内元素与块元素

行元素:无论内容多少,该元素独占一行(h1,p)

块元素:内容撑开宽度,左右都是行内元素的可以排在一行(a,strong,em)

相关推荐
超哥--4 小时前
B站视频内容智能分析系统(九):React 前端与管理面板
前端·react.js·前端框架
Cutecat_7 小时前
视频字幕处理工具横向:提取模式 vs 编辑模式,该如何选择
android·前端·ios·语音识别
qq_422152578 小时前
PDF 加水印工具怎么选?2026 年文档版权保护方案对比
前端·pdf·github
kyriewen8 小时前
手写 Promise.all、race、any:不到 30 行代码,解决并发异步的所有姿势
前端·javascript·面试
brucelee1869 小时前
OpenClaw 浏览器控制(Chrome MCP)完整教程
前端·chrome
ct9789 小时前
React 状态管理方案深度对比
开发语言·前端·react
胡志辉的博客9 小时前
深入浅出理解浏览器事件循环:从一道输出题讲到 Chrome 源码
前端·javascript·chrome·chromium·event loop
代码不加糖9 小时前
js中不会冒泡的事件有哪些?
前端·javascript·vue.js
懂懂tty9 小时前
Vue2与Vue3之间API差异
前端·javascript·vue.js
AI焦点10 小时前
跨越协议鸿沟:Tool Use状态机从Anthropic到OpenAI兼容体系的适配要点
前端·人工智能