Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场

HTML5

作者头像
roydonGuo
发布于 2022-11-02 07:16:03
发布于 2022-11-02 07:16:03
3.3K00
代码可运行
举报
文章被收录于专栏:postsposts
运行总次数:0
代码可运行

一、基础认识

浏览器:网页运行,显示平台、五大浏览器

浏览器渲染引擎

不同浏览器遵循一个Web标准

二、HTML

(Hyper Text Markup Lanuage)==>超文本标记语言

注释:

标签:

双标签:

eg:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<strong>自体加粗</strong>
  • 单标签:不可包裹内容

排版标签

标题标签:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<h1>一级标题</h1>
<h2>二级标题</h2>
。。。。。
<h6>六级标题</h6>

段落标签:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<p>段落内容。。。</p>

若(。・・)ノvsCode段落标签中内容过多,可ALT + Z自动换行

换行标签:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<br>

水平线标签:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<hr>

文本格式化标签

媒体标签

图片标签

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<img src="路径" alt="替换文本(src失效显示)" title="鼠标悬停提示文本">

更多属性:width、height(只设置一个会保持原图比例,两个都设置自定义图片比例)

路径:

  1. 相对路径:(当前文件)
  • 同级文件:
  • 引用下级文件:

<img src="./images/图片.jpg">

  • 引用上级文件:<img src="../目标文件.gif">
  1. 绝对路径:

目录下的绝对位置,可直接到达目标位置,通常==从盘符开始==的路径

音频标签(双标签):

常见属性:

目前此标签支支持三种格式:==MP3、Wav、Ogg==

视频标签:(常见属性见音频标签)

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<video src="" controls></video>

连接标签

href=”#”表示空链接,还没有确定目标页面

属性:

  • target:(打开网页的形式)

列表标签

无序(点),有序(序号),自定义列表

无序列表

有序列表

自定义列表

表格

标题标签,caption表格大标题

常见属性:

表单标签

input

常用属性:

单选功能:

checked默认选中(也适用于多选)

文件上传功能:多文件上传属性:multiple

按钮功能:需要在同一域下<form></form>

按钮加value属性,显示按钮文字显示

button

(双标签)

select

下拉菜单,selected默认选中

textarea

文本域标签,(简介输入框)

实际开发会使用CSS

label

场景:不止点按钮触发,点按钮对应的文字也会触发

语义化标签

无语义布局标签

有语义布局标签

html5新版本加入,和<div>一致

字符实体


表格案例

表单案例


本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022-08-24,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
房上的猫:HTML5基础
一.W3C标准  1)W3C标准不是某一个标准,而是一系列的标准的集合,一个网页主要由三部分组成,即结构(Structure),表现(Presentation)和行为(Behavior)  2)不很严谨的说"结构","表现","行为"分别对应了三种非常常用的技术,即HTML,CSS,JavaSxript.也就是说HTML用来决定结构和内容,CSS用来设定网页的表现样式,JavaSpcript用来控制网页的行为  3)W3C标准包括结构化标准语言(HTML,XML),表现标准语言(CSS),行为标准(DOM,
房上的猫
2018/03/14
1.7K0
HTML结构
在 IDEA 中创建文件 xxx.html , 直接输入 ! , 按 tab 键, 此时能自动生成代码的主体框架.
半截诗
2025/03/08
1760
从头学前端-HTML简介
网页基本都是通过浏览器访问;网页主要有图片,文字、链接、视音频等元素组成;使用不同的标签引入元素;最终生成的文件和展示的方式一般都是html或htm文件;
JQ实验室
2022/10/24
1.3K0
【学习笔记】HTML5
HTML5 本文为我观看遇见狂神说的讲解视频的个人学习笔记,侵删。 基本信息 <!--DOCTYPE:用的是什么规范(告诉浏览器),默认html--> <!DOCTYPE html> <html lang="en"> <!--网页头部--> <head> <!-- meta 描述性标签,描述网站的一些信息--> <!-- 常做SEO--> <meta charset="UTF-8"> <meta name="keywords" content="Livinfly, WA">
Livinfly
2022/10/26
7770
【web前端】web前端设计入门到实战第一弹——html基础精华
同级路径: 直接写图片名 或者./+图片名 下级路径: 写文件夹名字 + 图片名 上级路径: 先到上一文件夹 到上一级目录 …/ 当看到目标文件时再进入再找图片名 属性名:title 属性值:提示文本 当鼠标悬停是才显示的文本
洁洁
2023/10/19
2960
关于行、块元素的讲解以及HTML5元素的分类
继上周我们讲解了所有常用的CSS选择器以及CSS选择器的优先级。到目前为止,你是不是觉得静态页面布局简单了很多,而不是单单使用类名选择器(虽然很好用)来操作了。通过其它选择器的配合使用,页面布局显得不再那么让人“捉急”。但是有不少人在这个时候遇到了问题,多种多样的标签给我们的布局操作带来了一定的难度,因其种类繁多,大家在使用的时候出现了“选择困难症”。为此,今天的这篇文章主要为大家讲解网页中常用的标签以及它又是如何进行分类的。 本文内容概要: 1 行元素的使用 2 块元素的使用 2 行、块元素的特性区别 4
HTML5学堂
2018/03/13
2.8K0
关于行、块元素的讲解以及HTML5元素的分类
HTML--HTML入门篇(我想10分钟入门HTML,可以,交给我吧)
        HTML称为超文本标记语言,是一种标识性的语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字,图形、动画、声音、表格、链接等。
风骨散人Chiam
2020/10/28
1.2K0
Web阶段:第一章:HTML语言
需求1:使用无序,列表方式,把东北F4,刘能、赵四、宋小宝、小沈阳 ,展示出来 举例:
Java廖志伟
2022/11/28
9940
HTML基础
作用:为文本添加特殊格式,以突出重点。常见的文本格式:加粗、倾斜、下划线、删除线等。
777nx
2023/10/18
2270
HTML基础
HTML入门完全指南:从零开始构建你的第一个网页
每个网页都会有一个基本的结构标签(也称为骨架标签),页面内容也是在这些基本标签上写
IsLand1314
2025/03/08
6210
HTML入门完全指南:从零开始构建你的第一个网页
HTML知识点概括——一篇文章带你完全掌握HTML
label标记可以连接其他元素(常用于与button,checkbox,radio等点击性标签使用)
秋落雨微凉
2022/10/25
1.8K0
HTML知识点概括——一篇文章带你完全掌握HTML
HTML入门
概述 HTML 教程 | 菜鸟教程 (runoob.com) 骨架标签 HTML常用标签 HTML常用标签可分为一下几类: 排版标签、图片标签、超链接标签、表格标签、列表标签、表单标签 标题标签 标题标签一共有6个,h1~h6, h1是─级标题,最大;h6是六级标题,最小 align align是标题的重要属性,能够决定标题中文字的显示位置 <h1>标题标签一共有6个</h1> <h2>align属性可以设置文本对齐方式</h2> <h3>align有三个可选值:left、center、right<
Breeze.
2022/06/27
3.1K0
HTML入门
HTML 基础
作用:为文本添加特殊格式,以突出重点。常见的文本格式:加粗、倾斜、下划线、删除线等。
张哥编程
2024/12/07
1410
HTML 基础
2-HTML的标签
<video src="" controls="controls"></video>
达达前端
2020/05/18
1.1K0
【HTML5】html5开篇基础(2)
图像标签注意点: 1.图像标签可以拥有多个属性,必须写在标签名的后面。 2.属性之间不分先后顺序,标签名与属性、属性与属性之间均以空格分开。 3.属性采取键值对的格式,即 key=“value" 的格式,属性 =“属性值”
E绵绵
2024/09/24
3240
【HTML5】html5开篇基础(2)
HTML第一天
HTML第一天 Web标准: 结构HTML 样式CSS 行为JavaScript ---- 注释: 快捷键ctrl+/ 为代码添加的具有解释性、描述性的信息,主要用来帮助开发人员理解代码 ---- 标签的分类: 双标签:例如:p h strong 单标签:例如:img br hr ---- 标签的关系: 1、嵌套关系(父子) 2、并列关系(兄弟) ---- 1、标题标签 h1~h6 独占一行,并且从h1~h6文字逐渐减小 2、段落标签 p (独占一行,段落之间存在间隙) 3、换行标签 br (单标签,让
小城故事
2023/02/27
3060
HTML第一天
HTML 标签介绍
ii. 事件属性: οnclick="alert('你好!');" 可以直接设置事件响应后的代码。
一个风轻云淡
2022/11/15
1.9K0
HTML 标签介绍
HTML
HTML是 HyperText Mark-up Language 的首字母简写,意思是超文本标记语言,超文本指的是超链接,标记指的是标签,是一种用来制作网页的语言,这种语言由一个个的标签组成,用这种语言制作的文件保存的是一个文本文件,文件的扩展名为html或者htm,一个html文件就是一个网页,html文件用编辑器打开显示的是文本,可以用文本的方式编辑它,如果用浏览器打开,浏览器会按照标签描述内容将文件渲染成网页,显示的网页可以从一个网页链接跳转到另外一个网页。
py3study
2020/01/16
1.6K0
前端系列教学 - HTML基础
作为还在慢慢前端学习路上的一位自学者。我以写教程文章的方式来整理自己对于知识的理解,同时也希望能够把自己的理解作为一个分享。希望能够和大家共同进步,如有任何纰漏的话,希望大家多多指正。感谢万分!
罐装汽水Garrik
2018/05/23
7.3K4
前端系列教学 - HTML基础
【JavaEE初阶】HTML
前端代码的运行环境是浏览器,浏览器就像Java中的JVM一样,浏览器可以解析html,css,js等代码中的内容,根据代码去后构造前端页面。
xxxflower
2023/10/16
2640
【JavaEE初阶】HTML
相关推荐
房上的猫:HTML5基础
更多 >
LV.0
这个人很懒,什么都没有留下~
作者相关精选
换一批
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验