【前端】制作一个简单的网页（2）
| 单标签组成的元素 这类标签不需要内容产生效果，通常表示对网页的某种行为，它们不用标记任何内容，开始即是结束。 比如，<hr>标签的作用是在网页中添加一条分割线，它仅包含开始标签，是一个单标签元素。 |
|
有时我们还需要为元素添加更多的信息，解决诸如下面的问题：
这个元素的颜色是什么？
元素内容使用了哪一种语言？
元素展示了哪一张图片?
...
此时，我们可以在标签中添加属性。
属性
定义
HTML 属性（或简称为属性）能够为 HTML 标签提供一些额外信息。
隐喻
若把HTML标签比作商品的吊牌，属性就是吊牌上用来描述商品的附加信息。
| 属性可以为网页元素提供更多信息， 它总是以属性名/值对的形式出现。 右边展示了网页中常见的两个属性。 |
|
HTML 属性有很多，大致可以分为下面两种类型：
通用属性：适用于大部分或者所有 HTML 标签；
专用属性：只适用于一个或者几个特定的 HTML 标签。
我们会在后面的课程中陆续学习每个属性的用法与分类。
| 设置属性的位置 一个标签可以没有属性，也可以有一个或多个属性。 属性需要设置在开始标签后，并使用空格与标签名分开，格式为<标签名 属性1 属性2>。 |
|
| 属性的结构 通常情况下，HTML属性由属性名与属性值两个部分组成，结构为属性名="属性值"。 需要注意的是，属性值中的内容需要放在一对引号中。 |
|
一个基本的HTML文档。
右图展示了一个简易的网页，它会在屏幕中显示：
“第一个网页”。
| HTML 文档的最外层结构由两个元素确定： 第一个元素是：DOCTYPE； 第二个元素是：HTML。 | |
| <!DOCTYPE html> <!DOCTYPE html>是一个特殊的标签，总是放在HTML文档的第一行。 它的作用是让浏览器明白其处理的是HTML文档。 doc - document - 文件； type - 类型； | |
| <html> 紧跟着<!DOCTYPE html>的是HTML元素的开始标签。 html 是根元素，它告诉浏览器网页从<html>开始，到</html>结束。 也就是说，网页的所有内容都放在html元素中。 | |
| 有时你会发现<html>标签中设定了一个名为lang的属性，它用来告诉浏览器这是“网页使用的语言”。 比如，"en" 表示这个网页的主要语言是英文。 当浏览器识别到你常用的语言（比如中文）与lang中的语言不一致，会自动询问你是否需要翻译网页内容。 当浏览器识别到你常用的语言（比如中文）与lang中的语言不一致，会自动询问你是否需要翻译网页内容。 |  |
相关文章：
【前端】制作一个简单的网页（2）
单标签组成的元素 这类标签不需要内容产生效果，通常表示对网页的某种行为，它们不用标记任何内容，开始即是结束。 比如，<hr>标签的作用是在网页中添加一条分割线，它仅包含开始标签，是一个单标签元素。…...
OpenAI Canvas：提升编程与写作效率的全新工作界面
随着人工智能技术的飞速发展，大语言模型（LLM）不仅限于生成文本，还能逐步扩展至编程、设计等任务的支持。近期，OpenAI 推出了一个名为 Canvas 的全新功能，专门用于协助用户进行编程和写作。这一功能与 Claud…...
将SpringBoot的Maven项目打成jar包和war包
先需要明确的是，该项目打包的形态是可执行的jar包，还是在tomcat下运行的war包。 springboot自带的maven打包 1.创建一个springboot web项目 1.api控制层HelloWorld.java RestController RequestMapping("/hello") public class HelloWorld …...
【Iceberg分析】Spark与Iceberg集成之常用存储过程
文章目录 Spark与Iceberg集成之常用存储过程调用语法调用样例表快照管理快照回滚根据snapshotid进行回滚根据timestamp进行回滚 设置表当前生效的快照 表元数据管理设置快照过期时间清除孤岛文件重写数据文件运用参数示例optionsGeneral OptionsOptions for sort strategyOptio…...
[旧日谈]关于Qt的刷新事件频率，以及我们在Qt的框架上做实时的绘制操作时我们该关心什么。
[旧日谈]关于Qt的刷新事件频率，以及我们在Qt的框架上做实时的绘制操作时我们该关心什么。 最近在开发的时候，发现一个依赖事件来刷新渲染的控件会导致程序很容易异常和崩溃。 当程序在运行的时候，其实软件本身的负载并不高，所以…...
云上考场小程序+ssm论文源码调试讲解
2 关键技术简介 2.1 微信小程序 微信小程序，简称小程序，英文名Mini Program，是一种全新的连接用户与服务的方式，可以快速访问、快速传播，并具有良好的使用体验。 小程序的主要开发语言是JavaScript，它与…...
城域网——IP城域网、城域以太网、光城域网
一、城域网 1、城域网（Metropolitan Area Network，MAN）：一个城市范围内所建立的计算机通信网。 2、分布式队列双总线（Distributed Queue Dual Bus，DQDB）：即IEEE802.6，由…...
华为Eth-trunk链路聚合加入到E-trunk实现跨设备的链路聚合
一、适用场景（注：e-trunk与eth-trunk是2个不同的概念） 1、企业中有重要的server服务器业务不能中断的情况下，可将上行链路中的汇聚交换机，通过eth-trunk链路聚合技术，实现链路故障后，仍有可用的…...
【网络安全】JSONP劫持原理及攻击实战
未经许可，不得转载。 文章目录 JSONP简介JSONP工作原理JSONP劫持Callback可定义问题JSONP简介 JSONP（JavaScript Object Notation Padding）是一种用于绕过浏览器同源策略限制的技术，使得网页可以从不同域名的服务器请求数据。由于浏览器的同源策略限制，网页通常只能向与其…...
VR全景摄影的拍摄和编辑软件推荐
随着虚拟现实技术的不断进步，VR全景摄影逐渐成为商业、娱乐和教育等多个领域中的重要工具。通过专业的设备与软件，摄影师能够创作出沉浸式的360度全景作品，为观众提供身临其境的视觉体验。在这篇文章中，我们将介绍VR全景摄影的相关…...
linux：使用sar诊断问题
使用sar诊断问题 1. CPU 使用情况2. 内存与交换3. 磁盘 I/O 活动4. 网络 I/O 活动5. 进程与上下文切换6. 系统调用与文件活动7. 电源管理8. 延迟分析9. 系统全局统计10. 查看历史记录11. 特定时间段12. 自动定时采样其他参数：使用实例： sar（S…...
CUDA编程技巧（不断搜集更新）
1 使用位运算替换部分乘法或除法 位移操作主要适用于无符号整数，对于带符号数的位移，特别是负数，可能会导致问题，如果你需要对负数执行除法或者乘法，最好谨慎使用位移运算。 1.1 替换除法 当需要将一个数除以 2、4、…...
云计算（第二阶段）：mysql后的shell
第一章：变量 前言 什么是shell Shell 是一种提供用户与操作系统内核交互的工具，它接受用户输入的命令，解释后交给操作系统去执行。它不仅可以作为命令解释器，还可以通过脚本完成一系列自动化任务。 shell的特点 跨平台：…...
Debian12离线部署Mysql全网最详细教程
一、下载安装所需要的库 1、所需要的库 # 所需要的库有 libc6_2.36-9deb12u8_amd64.deb libgcc-s1_12.2.0-14_amd64.deb libstdc6_12.2.0-14_amd64.deb gcc-12-base_12.2.0-14_amd64.deb psmisc_23.6-1_amd64.deb libnuma1_2.0.18-1_amd64.deb libmecab2_0.996-14b14_amd64.d…...
文本生成视频技术：艺术与科学的交汇点
在人工智能技术的飞速发展下，文本生成视频（Text-to-Video）技术已经成为现实。这项技术能够根据文本描述生成相应的视频内容，极大地拓展了内容创作的边界。本文将从三个主要方面对文本生成视频技术进行深入探讨：技术能达…...
【Windows】【DevOps】Windows Server 2022 采用WinSW将一个控制台应用程序作为服务启动（方便）
下载WinSW 项目地址： GitHub - winsw/winsw: A wrapper executable that can run any executable as a Windows service, in a permissive license. 下载地址： https://github.com/winsw/winsw/releases/download/v2.12.0/WinSW-x64.exe 参考配置模…...
OpenAI董事会主席Bret Taylor的Agent公司Sierra：专注于赋能下一代企业用户体验
本文由readlecture.cn转录总结。ReadLecture专注于音、视频转录与总结，2小时视频，5分钟阅读，加速内容学习与传播。 视频来源 youtube: https://www.youtube.com/watch?vriWB5nPNZEM&t47s 大纲 介绍 欢迎与介绍 介绍Bret Taylor&#x…...
【linux】信号（下）
8. 阻塞信号 (一)信号其他相关常见概念 实际执行信号的处理动作称为信号递达(Delivery)信号从产生到递达之间的状态,称为信号未决(Pending)进程可以选择阻塞 (Block )某个信号被阻塞的信号产生时将保持在未决状态,直到进程解除对此信号的阻塞,才执行递达的动作(即被阻塞的信…...
Notepad++ 初学者指南
引言 对于初学者来说，选择合适的编程工具很重要，特别是考虑到易用性和计算机资源的需求。 虽然集成开发环境（IDE）如 Eclipse、IntelliJ IDEA 和 Visual Studio 提供了许多强大的功能，但对于刚开始学习编程的人来说&a…...
Web Socket 使用详解
在信息爆炸的时代，用户对网页的期待早已超越了静态内容的展示。实时聊天、股票报价、协同编辑等功能的实现，都离不开服务器与客户端之间持续、高效的数据交互。传统的HTTP请求-响应模型难以满足这种需求，而WebSocket的出现，为构建…...
多场景 OkHttpClient 管理器 - Android 网络通信解决方案
下面是一个完整的 Android 实现，展示如何创建和管理多个 OkHttpClient 实例，分别用于长连接、普通 HTTP 请求和文件下载场景。 <?xml version"1.0" encoding"utf-8"?> <LinearLayout xmlns:android"http://schemas…...
关于iview组件中使用 table , 绑定序号分页后序号从1开始的解决方案
问题描述：iview使用table 中type: "index",分页之后 ，索引还是从1开始，试过绑定后台返回数据的id, 这种方法可行，就是后台返回数据的每个页面id都不完全是按照从1开始的升序，因此百度了下，找到了…...
Yolov8 目标检测蒸馏学习记录
yolov8系列模型蒸馏基本流程，代码下载：这里本人提交了一个demo:djdll/Yolov8_Distillation: Yolov8轻量化_蒸馏代码实现 在轻量化模型设计中，**知识蒸馏（Knowledge Distillation）**被广泛应用，作为提升模型…...
springboot整合VUE之在线教育管理系统简介
可以学习到的技能 学会常用技术栈的使用 独立开发项目 学会前端的开发流程 学会后端的开发流程 学会数据库的设计 学会前后端接口调用方式 学会多模块之间的关联 学会数据的处理 适用人群 在校学生，小白用户，想学习知识的 有点基础，想要通过项…...
排序算法总结（C++）
目录 一、稳定性二、排序算法选择、冒泡、插入排序归并排序随机快速排序堆排序基数排序计数排序 三、总结 一、稳定性 排序算法的稳定性是指：同样大小的样本 **（同样大小的数据）**在排序之后不会改变原始的相对次序。 稳定性对基础类型对象…...
【Linux】Linux 系统默认的目录及作用说明
博主介绍：✌全网粉丝23W，CSDN博客专家、Java领域优质创作者，掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域✌ 技术范围：SpringBoot、SpringCloud、Vue、SSM、HTML、Nodejs、Python、MySQL、PostgreSQL、大数据、物…...
比较数据迁移后MySQL数据库和OceanBase数据仓库中的表
设计一个MySQL数据库和OceanBase数据仓库的表数据比较的详细程序流程，两张表是相同的结构，都有整型主键id字段，需要每次从数据库分批取得2000条数据，用于比较，比较操作的同时可以再取2000条数据，等上一次比较完成之后，开始比较，直到比较完所有的数据。比较操作需要比较…...
CMS内容管理系统的设计与实现：多站点模式的实现
在一套内容管理系统中，其实有很多站点，比如企业门户网站，产品手册，知识帮助手册等，因此会需要多个站点，甚至PC、mobile、ipad各有一个站点。 每个站点关联的有站点所在目录及所属的域名。 一、站点表设计…...
基于小程序老人监护管理系统源码数据库文档
摘 要 近年来，随着我国人口老龄化问题日益严重，独居和居住养老机构的的老年人数量越来越多。而随着老年人数量的逐步增长，随之而来的是日益突出的老年人问题，尤其是老年人的健康问题，尤其是老年人产生健康问题后&…...
Vue 实例的数据对象详解
Vue 实例的数据对象详解 在 Vue 中，数据对象是响应式系统的核心，也是组件状态的载体。理解数据对象的原理和使用方式是成为 Vue 专家的关键一步。我将从多个维度深入剖析 Vue 实例的数据对象。 一、数据对象的定义方式 1. Options API 中的定义 在 Options API 中，使用 …...