常见的页面标签

news2024/9/23 17:23:11

一、基本标签

<p>段落标签</p>             换行且有空行

hn(1-6) 标题标签      <h1>一级标题</h1>         <h2>二级标题</h2>         <h3>三级标题</h3> .....

<br>    <br />     <br/>          换行标签

<hr>    <hr />     <hr/>          分割线标签

<b> 加粗标签</b>                              <strong> 加粗标签</strong>     

<i> 加斜标签</i>                                 <em>加斜标签</em>           

<u>下画线(underline)</u>             <del>中划线(删除)</del>

a<sub>2</sub>        a<sup>2</sup>  

二、块标签和行内标签

<div>标准块标签</div>

<span>标准行内标签</span>

块标签即使设置了宽,也是占据100%宽,别的占不了

行内标签设置了宽也没作用,内容占多少就是多少

三、语义化标签

方便程序员理解代码,大概知道哪一块是干啥的 

如:

四、多媒体标签

1、图片标签

相对路径和网络路径使用较多

如果图片较小,当前页面要经常使用,不更换,就直接放在项目里,即相对路径

绝对路径一般用不到(每个人电脑磁盘文件等不同)

第一个是绝对路径

第二个是相对路径

第三个是网络路径

上面距离不够了,所以展示在下面 

alt属性作用:当图片找不到,加载错误,可以显示alt中的内容

titile属性(大多数标签都有)

当没有alt属性,只有title属性,图片显示不出来时:

alt一个是没有图片的时候显示,一个是有图片的时候光标放上去显示。说明alt和title一般情况里面的文字应该是一样的   即:

2、视频标签

不给值默认是false,不行。值随便写也是true,但是一般都是键=值的形式 

如果觉得键=值麻烦,也可以直接写个controls

 autoplay属性是自动播放,但是有的浏览器禁止自动播放功能

1、流量。要是没打算看视频,但是放了,消耗用户流量

2、吵闹。影响别人

考虑到需要自动播放,则静音播放 muted属性

考虑到兼容问题,做成了很多格式,可以这样书写:

3、音频标签

四、表格标签

tr:table row行

td:table data单元格

语义化标签:

一个跨5列:

一个跨三行:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/735424.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

3.8.使用cuda核函数加速yolov5后处理

目录 前言1. Yolov5后处理2. 后处理案例2.1 cpu_decode2.2 gpu_decode 总结 前言 杜老师推出的 tensorRT从零起步高性能部署 课程&#xff0c;之前有看过一遍&#xff0c;但是没有做笔记&#xff0c;很多东西也忘了。这次重新撸一遍&#xff0c;顺便记记笔记。 本次课程学习精简…

Zabbix自动报表功能

一、简介 从zabbix 5.4体验版本发布时提供了很多新特性&#xff0c;当然现在最新的Zabbix6.0 LTS版本的定时导出PDF报表功能相对稳定&#xff0c;但如果需要满足日常运维报表需求还是有一段比较长的路要走。总而言之相比以前版本此功能可谓是一大突破。可按照Dashboard维度&am…

计网之体系结构(一)

计网之体系结构&#xff08;一&#xff09; 计算机网络概述计算机网络的概念计算机网络的功能计算机网络的发展计算机网络发展第一阶段计算机网络发展第二阶段&#xff08;三级结构&#xff09;计算机网络发展第三阶段&#xff08;多层次ISP结构&#xff09; 概念&#xff0c;功…

Redis常用面试题

Redis为什么执行这么快&#xff1f; 1.基于内存存储实现。 我们都知道内存读写比在磁盘快很多的&#xff0c;Redis基于内存储存实现的数据。相对于数据库存在磁盘的MySql数据库&#xff0c;剩余磁盘I/O的消耗 2.redis是单线程模型的&#xff0c;而单线程避免了CPU不必要的上…

Python 导入引用其他文件的函数(不断更新)

文章目录 构造初始化文件结构&#xff0c;以此为例。【1】导入同目录且同级下其他文件的函数&#xff08;c.py文件导入d.py文件的函数&#xff09;&#xff08;1&#xff09;只引入d.py文件&#xff08;2&#xff09;直接引入函数&#xff08;3&#xff09;引入全部函数 【2】导…

抓包看TCP协议

抓包看TCP协议 前言一、三次握手1.1 为什么需要握手&#xff1f;1.2 为什么需要三次握手&#xff1f; 二、四次挥手2.1 为何需要挥手&#xff1f;2.2 为何需要四次挥手&#xff1f; 三、抓个包看看 后记参考 前言 在计算机的世界中&#xff0c;通信双方的交互一般要通过网络这个…

LVS负载均衡集群 keepalived

目录 1.实现方法 1.故障自动切换 (failover) 2.节点健康状态检查 (health checking) 2.实现LVS负载调度器 节点服务器的高可用(HA) 3.keepalived高可用故障切换原理 4.三个主要模块 5.案例 1.实现方法 1.故障自动切换 (failover) 主…

万字解析帮你深入理解MySQL!!!(事物、视图和索引)

今日金句 每一个不曾起舞的日子&#xff0c;都是对生命的辜负 文章目录 一、事物1.1 概述1.2 语法1.3 代码验证1.4 事务的四大特征1.5 事务并发问题1.5.1 四种隔离级别1.5.2 何为脏读&#xff0c;幻读&#xff0c;不可重复读&#xff1f; 二、视图2.1 概念2.2 视图与数据表的区…

pytest参数化的多种使用技巧

前言 unittest单元测试框架使用DDT进行数据驱动测试&#xff0c;那么身为功能更加强大且更加灵活的Pytest框架怎么可能没有数据驱动的概念呢&#xff1f;其实Pytest是使用pytest.mark.parametrize装饰器来实现数据驱动测试的&#xff0c;那么今天我们就简单来说说在它是如何进…

代码随想录算法训练营 个人总结

训练营周期&#xff1a;2023/5/10 - 7/8&#xff0c;共计60天 LeetCode记录&#xff1a; 参加训练营之前&#xff0c;就有想刷LeetCode的想法&#xff0c;一方便没有头绪地不知道按什么顺序刷题&#xff0c;另一方面也没有找到很好的讲解材料&#xff0c;都是自己看LeetCode页面…

Notepad++ - 只需一张图教你如何将字符串“\n”替换成换行

问题描述 今天在一个响应体日志返回换行在字符串中&#xff0c;没想到我输入 \n&#xff0c;原本是直接给我出换行效果&#xff0c;结果它也就给我返回 \n&#xff0c;那怎么分析日志啊&#xff1f;&#xff01; 解决方案 还得是万能的 Notepad&#xff0c;直接看图说话

协同过滤 springboot+vue基于java的个性化图书推荐系统_1k4p4

在飞速发展的信息时代&#xff0c;随着网络学习的的普及&#xff0c;大量的学习平台和大量的图书数量迅速膨胀&#xff0c;使得学生在进行网络学习时面临“数据爆炸”和“数据过载”的情况&#xff0c;无法寻找到适合自己的图书。在面对着越来越多的图书资源&#xff0c;如何快…

【开源软件治理】MITRE : 开源软件

定义&#xff1a; 开源软件&#xff08;OSS&#xff09;是一种商业软件&#xff0c;只需同意遵守附带的 OSS 许可证即可获得全部所有权&#xff0c;无需立即进行第三方验证。同意 OSS 许可证允许个人、公司或政府实体根据需要尽可能频繁和广泛地复制、分发和运行 OSS 应用程序&…

【Redis】秒杀业务设计、悲观锁与乐观锁

1 全局ID生成器 一些情境下&#xff0c;使用数据库的ID自增将会产生一些问题。 一方面&#xff0c;自增ID规律性明显&#xff0c;可能被猜测出来并产生一些漏洞另一方面&#xff0c;当数据量很大很大很大时&#xff0c;单表数据量可能会受到限制&#xff0c;需要分表&#xf…

【Linux指令集】---cp指令(超详细)

个人主页&#xff1a;平行线也会相交 欢迎 点赞&#x1f44d; 收藏✨ 留言✉ 加关注&#x1f493;本文由 平行线也会相交 原创 收录于专栏【Linux专栏】&#x1f388; 本专栏旨在分享学习Linux的一点学习心得&#xff0c;欢迎大家在评论区讨论&#x1f48c; 演示环境&#xff1…

cmake include命令

目录 cmake include命令 CMAKE_CURRENT_LIST_DIR: CMAKE_CURRENT_LIST_FILE: CMAKE_CUEERNT_LIST_LINE: demo top CMakeLists.txt test.cmake subDir下的 CMakeLists.txt 结果: cmake include命令 include()命令也是将一个新的cmake内容引入当前cmake内容中. 格式: …

JVM理论(一)基础概念

JVM概述 JVM就是二进制字节码的运行环境,负责装载字节码到其内存,解释/编译为对应平台上的机器指令执行,每条java指令在java虚拟机规范中都有详细定义,包括如何取、处理操作数等;JVM特点如下 一次编译,到处运行&#xff08;各CPU的架构不同的情况下JVM为了实现跨平台,字节码指…

删除链表的倒数第 N 个结点——力扣19

题目描述 法一&#xff09;计算链表长度 class Solution { public:int getLength(ListNode* head){int len0;while(head){len;head head->next;}return len;}ListNode* removeNthFromEnd(ListNode* head, int n) {int len getLength(head);ListNode* dummy new ListNode …

汽车架构解析:python解析Autosar架构的ARXML

文章目录 前言一、Container-I-PDU概念引入二、以文本形式读取ARXML文件三、解析Frame的基本参数四、解析Frame中的PDU五、解析PDU中的Signals六、解析Signal中的初始值和长度七、解析Signal中的起始位置八、解析Signal中的枚举值或公式九、解析ARXML总结 前言 Autosar架构下a…

什么是人工智能?

人工智能基本定义&#xff1a; 人工智能&#xff08;Artificial Intelligence&#xff09;&#xff0c;英文缩写为AI。 它是研究、开发用于模拟、延伸和扩展人的智能的理论、方法、技术及应用系统的一门新的技术科学。人工智能是新一轮科技革命和产业变革的重要驱动力量。 人工…