当前位置: 首页 > news >正文

【HTML5学习笔记1】html标签(上)

web标准(重点)

w3c

构成:结构、表现、行为,结构样式行为相分离

结构:网页元素整理分类 html

表现:外观css

行为:交互 javascript

html标签

1.html语法规范

1)

所有标签都在<>内

且一般成对出现(双标签) <html></html>(开始结束

单标签<br />很少

2)标签关系

包含 (嵌套

<head>

<title> </title>

</head>

并列

<head> </head>

<body> </body>


<html>
<head> </head>

<body> </body>

</html>
2.html基本结构标签

1)第一个html网页

骨架标签

<html><head><title>我的第一个页面</title>    </head><body>月薪过万</body>
</html>

3.开发工具

vscode

输入感叹号 !

1)插件

auto rename tag 自动同步修改标签

one dark pro 主题颜色

格式化代码

设置-正在格式化 打开

open inbrowser 预览页面

live server 实时预览

vscodeicons 文件图标主题

easyless

会了吧 陌生单词

2)快捷键

shift alt 下箭头 直接复制整行

ctrl d 修改同样的部分

ctrl alt 上下箭头 添加多个光标

ctrl g 跳转行数

3)vscode骨架标签代码解释

<!DOCTYPE>文档类型声明标签,用的是什么版本的html

lang=“en"定义当前文档显示的、”zh-cn“ 中文网站

<meta charset = "utf-8">字符集

4.html常用标签

1)标签语义

标题标签:6个网页标题h1-h6

<h1>一级标题</h1>	

段落标签:<p>

<p>段落</p>

换行标签:<br />

2)案例 :新闻

3)文本格式化标签

加粗、斜体等

4)<div>、<span>没有语义

就是一个盒子,用来方东西的

div divsion表示分割分区。单独占一行 ,大盒子

span表示跨度、跨距离。一行可以放很多个。小盒子

5)图片标签

<img src=""/>

src是img标签的必须属性,用于指定图像文件的路径和文件名

alt 图片无法显示的时候用文本替换

title 提示文字 鼠标经过图片时显示的文字

height

width 一般只修改高或者宽的一个

broder 边框

标签除了src要在最前面之外其他没有要求

6)图像标签和路径

文件夹 img

相对路径、

绝对路径

7)超链接标签(重点

1链接的语法格式

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

属性:

href-指定连接目标的url地址

target-指定连接页面的打开方式,_self默认,__blank新窗口打开

2链接分类

外部链接:百度等

内部链接:自己写的网页

空连接:没有确定链接目标时,<a href="#">首页</a> (占位置)

下载链接:如果href里面地址是一个文件或者压缩包,会下载这个文件

网页元素链接:图片 文字 表格 音频都可以

锚点链接:快速定位跳转页面某个位置

<a herf="#名字"> 名字</a>要进行链接的位置
<h3 id="名字"> 它的名字</h3>目标标签位置

5.html中的注释和特殊字符

1)注释

<!-- 注释 -->

2)特殊字符

http://www.dtcms.com/a/194657.html

相关文章:

  • mac M芯片运行docker-desktop异常问题
  • Protobuf——Protocol Buffer详解(1)
  • 基于 Flink 的实时推荐系统:从协同过滤到多模态语义理解
  • 【Python CGI编程】
  • 网络安全基础第11-13集
  • 香橙派Zero3跨网络音乐服务系统搭建与内网穿透技术应用实践
  • GESP2025年3月认证C++二级( 第三部分编程题(1)等差矩阵)
  • 深入剖析Spring Boot参数校验:实现原理、自定义注解组件与国际化多语言实践
  • allure报告自定义logo和名称
  • 网络安全-等级保护(等保) 2-5-1 GB/T 25070—2019 附录B (资料性附录)第三级系统安全保护环境设计示例
  • 深入解析Shell脚本编程:从基础到实战的全面指南
  • 高效便捷的文字识别方案与解析
  • 将 Element UI 表格元素导出为 Excel 文件(处理了多级表头和固定列导出的问题)
  • rocketmq 环境配置[python]
  • 7-15 计算圆周率
  • 增量学习:机器学习领域中的资源高效利用秘籍
  • 大语言模型 09 - 从0开始训练GPT 0.25B参数量 补充知识之数据集 Pretrain SFT RLHF
  • C++23 中的 ranges::fold_left:范围折叠算法
  • C语言进阶-数组和函数
  • 深入解析Spring Boot与微服务架构:从入门到实践
  • 智能呼叫系统中的NLP意图理解:核心技术解析与实战
  • Android 中 打开文件选择器(ACTION_OPEN_DOCUMENT )
  • 基于React的高德地图api教程005:圆形标记的绘制、删除、修改
  • 0-INViT:一个具有不变嵌套视图Transformer的可推广路由问题求解器(code)(未完)
  • GDB 高级调试技术深度解析
  • 【Python+flask+mysql】网易云数据可视化分析(全网首发)
  • STM32F103经SPI总线向写Micro SD卡
  • 怎么使用python进行PostgreSQL 数据库连接?
  • Web性能优化的未来:边缘计算、AI与新型渲染架构
  • WebMvcConfigurer介绍-笔记