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

前端开发:HTML常见标签

1.注释标签

注释不会显示在界面上 . 目的是提高代码的可读性 .
ctrl + / 快捷键可以快速进行注释 / 取消注释 .    <!-- 我是注释 -->

 2.标题标签

有六个 , h1 - h6. 数字越大 , 则字体越小
<h1> hello </h1>        //我们所写的csdn的格式中的标题一到标题6,就是如此;
<h2> hello </h2>
<h3> hello </h3>
<h4> hello </h4>
<h5> hello </h5>
<h6> hello </h6>

3.段落标签 

如果一段文本直接调在html上的时候,他不会划分段落,必须使用段落标签;字符串string类型中的回车会被解析成空格

<p>这是一个段落</p>        //将文本内容划分为一段一段的;

 4.换行标签

<br/> 是规范写法 . 不建议写成 <br>
br 是 break 的缩写 . 表示换行
br 是一个单标签 ( 不需要结束标签 )
br 标签不像 p 标签那样带有一个很大的空隙 .也就是行间距很小

 5.格式标签

加粗 : strong 标签 和 b 标签
倾斜 : em 标签 和 i 标签
删除线 : del 标签 和 s 标签
下划线 : ins 标签 和 u 标签
<strong> strong 加粗 </strong>
<b> b 加粗 </b>
<em> 倾斜 </em>
<i> 倾斜 </i>
<del> 删除线 </del>
<s> 删除线 </s>
<ins> 下划线 </ins>
<u> 下划线 </u>

6.图片标签

img标签必须带有src(sorce—源的意思)属性,表示图片的路径;

<img src = "./rose.jpg" >
采用绝对路径或相对路径
alt: 替换文本 . 当文本不能正确显示的时候 , 会显示一个替换的文字 .
title: 提示文本 . 鼠标放到图片上 , 就会有提示 .
width/height: 控制宽度高度 . 高度和宽度一般改一个就行 , 另外一个会等比例缩放 . 否则就会图片失衡.
border: 边框 , 参数是宽度的像素 . 但是一般使用 CSS 来设定
<img src = "rose.jpg" alt = "图片加载失败 " title = " 这是一朵鲜花 " width = "500px" height = "800px"
border = "5px" >
使用绝对路径来搞网络上的资源
<img src = "https://images0.cnblogs.com/blog/130623/201407/300958475557219.png"
alt = "" >        //这个只是例子,我的此图片可能过期
1. 属性可以有多个 , 不能写到标签之前
2. 属性之间用空格分割 , 可以是多个空格 , 也可以是换行
3. 属性之间不分先后顺序
4. 属性使用 " 键值对 " 的格式来表示 .

7.超链接标签

<a href = "http://www.baidu.com" target="_self" > 百度 </a>
href: 必须具备 , 表示点击后会跳转到哪个页面 .
百度是将超链接放到这两个字里,我们在网页上点新闻会自动跳转也是这个原理;
target: 打开方式 . 默认是 _self. 如果是 _blank 则用新的标签页打开 .那个下滑线是必须的
外部链接:
<a href = "http://www.baidu.com" target="_self" > 百度 </a>
内部链接 : 网站内部页面之间的链接 . 写相对路径即可 .
<a href = "2.html" > 点我跳转到 2.html </a>
空链接 : 使用 # href 中占位
<a href = "#" > 空链接 </a>
下载链接 : href 对应的路径是一个文件 . ( 可以使用 zip 文件 )
<a href = "test.zip" > 下载文件 </a>//是.zip会直接下载,.txt会打开;
网页元素链接 : 可以给图片等任何元素添加链接 ( 把元素放到 a 标签中
<a href = "http://www.sogou.com" >
<img src = "rose.jpg" alt = "" >
</a>
锚点链接 : 可以快速定位到页面中的某个位置
<a href = "#one" > 第一集 </a>
<p id = "one" > 第一集剧情 <br> </p>
<p id = "two" > 第二集剧情 <br> </p>
禁止 a 标签跳转 :
<a href="javascript:void(0) ; "> 或者 <a href="javascript: ; ">

相关文章:

前端开发:HTML常见标签

1.注释标签 注释不会显示在界面上 . 目的是提高代码的可读性 . ctrl / 快捷键可以快速进行注释 / 取消注释 . <!-- 我是注释 --> 2.标题标签 有六个 , 从 h1 - h6. 数字越大 , 则字体越小 <h1> hello </h1> //我们所写的csdn的格式中的标题一…...

【机器学习】主动学习-增加标签的操作方法-样本池采样(Pool-Based Sampling)

Pool-Based Sampling Pool-based sampling 是一种主动学习&#xff08;Active Learning&#xff09;方法&#xff0c;与流式选择性采样不同&#xff0c;它假设有一个预先定义的未标注样本池&#xff0c;算法从中选择最有价值的样本进行标注&#xff0c;以提升模型的性能。这种…...

【Rust自学】11.9. 单元测试

喜欢的话别忘了点赞、收藏加关注哦&#xff0c;对接下来的教程有兴趣的可以关注专栏。谢谢喵&#xff01;(&#xff65;ω&#xff65;) 11.9.1. 测试的分类 Rust把测试分为两类&#xff0c;一个是单元测试&#xff0c;一个是集成测试。 单元测试比较小也比较专注&#xff…...

深入理解Web存储机制:Cookie、SessionStorage与LocalStorage的区别

文章目录 前言一、Cookie简介二、SessionStorage简介三、LocalStorage简介四、三者之间的比较五、最佳实践建议结语 前言 随着Web应用程序变得越来越复杂&#xff0c;开发者需要更有效的办法来管理客户端数据。Cookie、SessionStorage和LocalStorage是三种常用的Web存储机制&a…...

SpringBoot之BeanDefinitionLoader类源码学习

该类的作用 Spring 框架中用于加载和解析 Bean 定义的工具类。它主要用于从不同的资源&#xff08;如 XML 文件、注解、Java 配置类等&#xff09;中读取 Bean 定义&#xff0c;并将这些定义注册到 Spring 的 BeanFactory 或 ApplicationContext 中 基本属性 //指定的资源pri…...

【芯片封测学习专栏 -- 2D | 2.5D | 3D 封装的区别和联系】

请阅读【嵌入式开发学习必备专栏 Cache | MMU | AMBA BUS | CoreSight | Trace32 | CoreLink | ARM GCC | CSH】 文章目录 Overview线键合&#xff08;wire-bonding&#xff09;封装FOWLP2D封装2.5D 封装硅通孔(TSV)硅中介层无TSV的2.5D 3D封装 Overview 我们先要了解一下&…...

从硬件设备看Linux

一、介绍 DM3730通过各种连接方式连接了各种设备&#xff0c;输入输出设备根据不同的类型大体可 以分为电源管理、用户输人、显示输出、图像采集、存储以及无线设备等。我们可以将DM 3730与这些设备的数据接口分为总线和单一的数据接口总线。总线的显著特点是单个总线上可以连…...

open3d+opencv实现矩形框裁剪点云操作(C++)

&#x1f451;主页&#xff1a;吾名招财 &#x1f453;简介&#xff1a;工科学硕&#xff0c;研究方向机器视觉&#xff0c;爱好较广泛… ​&#x1f4ab;签名&#xff1a;面朝大海&#xff0c;春暖花开&#xff01; open3dopencv实现矩形框裁剪点云操作&#xff08;C&#xff…...

git 本地操作

一、git.vscode 撤回本地提交 要在Git中撤销本地的最后一次提交&#xff0c;可以使用以下命令&#xff1a; git reset --soft HEAD^ 这将会撤销最后一次的提交&#xff0c;但是保留工作区以及暂存区的内容&#xff0c;方便重新提交。 如果你想完全撤销最后一次提交&#xf…...

PL/SQL语言的文件操作

PL/SQL语言的文件操作 PL/SQL&#xff08;Procedural Language/SQL&#xff09;是Oracle公司开发的一种过程化扩展SQL的语言&#xff0c;广泛应用于Oracle数据库的开发和管理。PL/SQL不仅支持SQL指令&#xff0c;还支持过程化编程&#xff0c;例如条件控制、循环控制、异常处理…...

linux lsof 和 fuser命令介绍

lsof 和 fuser 是两个在 Linux 系统中用于查看文件占用情况的重要工具。它们都可以用于查看哪些进程正在使用某些文件、设备或端口。下面是这两个命令的介绍、举例和背景。 lsof (List Open Files) 命令介绍: lsof 命令用于列出当前系统中所有打开的文件以及与之相关的进程。它…...

[Python学习日记-76] 网络编程中的 socket 开发 —— 介绍、工作流程、socket 模块用法和函数介绍

[Python学习日记-76] 网络编程中的 socket 开发 —— 介绍、工作流程、socket 模块用法和函数介绍 简介 socket 介绍 socket 的工作流程及用法 简介 前面在[Python学习日记-75] 计算机基础与网络当中介绍了一大堆基础知识之后我们终于开始进入到网络编程的开发阶段了&#x…...

vue(七) vue进阶

目录 第一课&#xff1a;Vue方法、计算机属性及侦听器 一、数组变化侦测 方法1&#xff1a;变更方法 方法2&#xff1a;替换一个数组 例子&#xff1a;小Demo:合并两个数组 二、计算属性 1.基础&#xff08;不推荐&#xff09; 2.使用计算属性来完成案例 3.使用函数的方…...

[Transformer] The Structure of GPT, Generative Pretrained Transformer

The Structure of Generative Pretrained Transformer Reference: The Transformer architecture of GPT models How GPT Models Work...

Django Admin 自定义操作封装

1. 为什么需要封装? 在Django开发中,我们经常需要在Admin界面添加自定义操作按钮,以便管理员执行特定的任务。通过封装,我们可以: 减少重复代码统一管理自定义操作的逻辑提高代码的可维护性和可扩展性 © ivwdcwso (ID: u012172506)2. CustomActionMixin 的实现 让我…...

http和https有哪些不同

http和https有哪些不同 1.数据传输的安全性&#xff1a;http非加密&#xff0c;https加密 2.端口号&#xff1a;http默认80端口&#xff0c;https默认443端口 3.性能&#xff1a;http基于tcp三次握手建立连接&#xff0c;https在tcp三次握手后还有TLS协议的四次握手确认加密…...

PL/SQL语言的数据库交互

PL/SQL语言的数据库交互 引言 在当今的信息化时代&#xff0c;数据库管理系统&#xff08;DBMS&#xff09;在各行各业中扮演着至关重要的角色。为了高效地与数据库进行交互&#xff0c;许多程序员、数据库管理员和系统分析师选择使用PL/SQL&#xff08;Procedural Language/…...

亿道三防丨三防笔记本是什么意思?和普通笔记本的优势在哪里?

三防笔记本是什么意思&#xff1f;和普通笔记本的优势在哪里&#xff1f; 在现代社会中&#xff0c;笔记本电脑已经成为人们工作和生活中不可或缺的一部分。然而&#xff0c;在一些特殊行业或环境中&#xff0c;普通笔记本电脑由于其脆弱性和对环境条件的敏感性&#xff0c;往…...

从项目代码看 React:State 和 Props 的区别及应用场景实例讲解

在 React 中&#xff0c;state 和 props 是组件的两个重要概念&#xff0c;它们有不同的作用和应用场景。理解它们之间的区别对于开发 React 应用至关重要。 1. state 和 props 的区别 props (属性)&#xff1a; props 是由父组件传递给子组件的数据或函数。props 是只读的&am…...

Vue 学习之旅:核心技术学习总结与实战案例分享(vue指令下+计算属性+侦听器)

Vue 学习之旅&#xff1a;核心技术学习总结与实战案例分享 文章目录 Vue 学习之旅&#xff1a;核心技术学习总结与实战案例分享一、指令补充&#xff08;一&#xff09;指令修饰符&#xff08;二&#xff09;v-bind 对样式操作的增强&#xff08;三&#xff09;v-model 应用于其…...

7步构建AI绘画流水线:Krita-AI-Diffusion全能力解析

7步构建AI绘画流水线&#xff1a;Krita-AI-Diffusion全能力解析 【免费下载链接】krita-ai-diffusion Streamlined interface for generating images with AI in Krita. Inpaint and outpaint with optional text prompt, no tweaking required. 项目地址: https://gitcode.c…...

CTFmisc文件头尾解析与隐写实战指南

1. CTFmisc文件头尾基础解析 第一次参加CTF比赛时&#xff0c;我盯着misc题目里那个损坏的图片文件发呆了半小时。直到队友提醒我检查文件头&#xff0c;才发现原来是个伪装成jpg的zip压缩包。这种"挂羊头卖狗肉"的把戏在CTF比赛中实在太常见了&#xff0c;今天就带大…...

基于虚拟局域网技术实现个人影音库的远程高画质流媒体访问

给大家推荐一种利用虚拟局域网&#xff08;Virtual Private Network&#xff0c;但更精确地说是软件定义的二层网络&#xff09;技术&#xff0c;解决个人或家庭搭建的本地影音库&#xff08;通常基于NAS设备&#xff09;在外部网络访问时面临的画质压缩、延迟卡顿及协议兼容性…...

互联网大厂Java面试场景深度剖析:核心技术栈与代码案例实录

互联网大厂Java面试场景深度剖析&#xff1a;核心技术栈与代码案例实录 在互联网大厂面试Java岗位&#xff0c;除了扎实的技术基础&#xff0c;还离不开对核心技术栈的全方位掌握。本文结合真实对话场景和代码案例&#xff0c;为求职者深度剖析面试流程与思路。 面试场景趣味对…...

明日方舟游戏资源库:高级游戏数据分析与开发实战指南

明日方舟游戏资源库&#xff1a;高级游戏数据分析与开发实战指南 【免费下载链接】ArknightsGameResource 明日方舟客户端素材 项目地址: https://gitcode.com/gh_mirrors/ar/ArknightsGameResource 《明日方舟》游戏资源库是一个完整的开源项目&#xff0c;为开发者和数…...

别再死记硬背了!用‘四体交叉’和‘双端口RAM’的实战题目,彻底搞懂计算机组成原理的存储器提速

从四体交叉到双端口RAM&#xff1a;用实战思维破解存储器提速难题 计算机组成原理中那些晦涩的存储器提速概念&#xff0c;是否总让你在题海中迷失方向&#xff1f;当"单体多字"、"多体并行"、"四体交叉"这些术语在教材里冰冷排列时&#xff0c;…...

终极指南:yaml-cpp多版本共存方案与命名空间隔离

终极指南&#xff1a;yaml-cpp多版本共存方案与命名空间隔离 【免费下载链接】yaml-cpp A YAML parser and emitter in C 项目地址: https://gitcode.com/gh_mirrors/ya/yaml-cpp 在C项目中处理YAML配置文件时&#xff0c;yaml-cpp 是一个功能强大的解析器和发射器库。然…...

WebDataset教学视频:从零开始学习WebDataset的10个系列课程

WebDataset教学视频&#xff1a;从零开始学习WebDataset的10个系列课程 【免费下载链接】webdataset A high-performance Python-based I/O system for large (and small) deep learning problems, with strong support for PyTorch. 项目地址: https://gitcode.com/gh_mirro…...

跳棋游戏中的多重捕获实现

跳棋(Checkers)是许多棋类爱好者喜爱的一款游戏,它的规则简单,但策略深度却非常丰富。今天我们来讨论跳棋游戏中的一个复杂而有趣的功能——多重捕获的实现。在本文中,我们将深入探讨如何在JavaScript中编写一个可以检测并执行多重捕获的函数。 基本概念 在跳棋游戏中,…...

RexUniNLU模型多任务学习原理与实战

RexUniNLU模型多任务学习原理与实战 1. 引言 你是否曾经遇到过这样的困扰&#xff1a;在处理自然语言理解任务时&#xff0c;需要为命名实体识别、关系抽取、文本分类等不同任务分别训练和维护多个模型&#xff1f;这不仅增加了开发成本&#xff0c;还让系统变得复杂难维护。…...