web前端开发——标签一(注释、标题、段落、换行、格式、图片)

今天我来针对web前端开发讲解标签一

目录

html标签_标题&段落&换行

注释标签:Ctrl+/

标题标签:  h1-h6

段落标签:

换行标签:

格式标签

图片标签_src属性


html标签_标题&段落&换行

注释标签:Ctrl+/

Ctrl+/ ,用户可能会获取到注释标签

注释的原则:

•和代码逻辑一致

•尽量使用中文

•正能量

标题标签:<h1></h1>  h1-h6

标题标签有6个,h1-h6,数字越大,字体越小,字体也越来越细。标题标签是单独起一行的。

段落标签:<p></p>

P标签之前存在一个空隙。

当前的p标签描述的段落,前面还没有缩进。

自动根据浏览器宽度来决定排版。

Html内容首位处的换行,空格均无效。

在html中文字之间输出的多个空格只相当于一个空格。

Html中直接输入换行(回车)不会真的换行,只是一个空格

在段落标签内回车(enter)视为空格

换行标签:<br/>  

br是break的缩写,表示换行

br是一个单标签(不需要结束标签)

br标签不像p标签一样带有很大的间隙

<br/>是标准写法,不建议写成<br>

换行标签换行之后间隙比段落标签间隙小

格式标签

加粗:strong标签和b标签

倾斜:em标签和i标签

删除线:del标签和s标签

下划线:ins标签和u标签

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

PS:

在Web开发中,标签用于给文本和内容添加语义信息和视觉样式。其中,对文本进行强调通常使用以下几种标签:

1.<strong>标签

<strong>标签用于表示文本的强调语义,通常浏览器会将其显示为粗体字体,这并不是其唯一作用,它的主要目的是为了强调文本的重要性,而不是仅仅通过视觉效果来实现。搜索引擎也会根据<strong>标签来

确定文本的重要性。

示例:

<p>This is<strong>important</strong>information.</p>

2.<em>标签:

<em>标签用于表示文本的强调语义,通常浏览器会将其显示为斜体字体。与<strong>不同的是<em>标签侧重于强调文本的语义重要性,而不是物理样式。搜索引擎也会根据<em>标签来确定文本的语气和情感强调。

示例:

<p>This is an<em>emphasized</em> text.</p>

3.<b>标签:

<b>标签用于表示文本的强调,通常浏览器会将其显示为粗体字体、与<strong>不同的是,<b>标签仅仅是对文本进行视觉上的加粗,而不会影响其语义重要性,因此,在语义上应优先使用<stong>或<emn>标签

示例:

<p>This is <b>bold</b> text.</p>

总结来说,Web开发中的这些标签不仅帮助开发者在视觉上强调文本,更重要的是它们提供了语义化的方式来描述文本的重要性或语气,从而使得网页内容更易于理解和被搜索引擎识别。

图片标签_src属性

img标签必须搭配着src使用(指定图片路径)

绝对路径

图片路径

网络上的图片路径

相对路径

./xxx.png 同一层路径的图片

./img/xxx.png 下一层路径的图片

../xxx.png  上一层路径的图片


少年没有乌托邦,心向远方自明朗!

如果这个博客对你有帮助,给博主一个免费的点赞就是最大的帮助❤
欢迎各位点赞收藏关注哦❤
如果有疑问或有不同见解,欢迎在评论区留言❤
后续会继续更新大连理工大学相关课程和有关web前端的内容和示例
点赞加关注,学习不迷路,好,本次的学习就到这里啦!!!

我们下次再见喽!

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

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

相关文章

小程序-设置环境变量

在实际开发中&#xff0c;不同的开发环境&#xff0c;调用的接口地址是不一样的 例如&#xff1a;开发环境需要调用开发版的接口地址&#xff0c;生产环境需要正式版的接口地址 这时候&#xff0c;我们就可以使用小程序提供了 wx.getAccountInfoSync() 接口&#xff0c;用来获取…

查找PPT中某种字体的全部对应文字

本文章的目的是找到某种字体的文字&#xff0c;而不是替换某种字体的文字&#xff0c;也不是将某种字体全部替换为另外一种文字。 第一步&#xff1a;在PPT中按下ALTF11 出现以下窗口 第二步&#xff1a;点击插入->模块 第三步&#xff1a;将以下代码输入到窗体中 Sub F…

在大型企业级应用中,如何优化 XML 数据的存储和检索效率,以满足高并发访问需求?

在大型企业级应用中&#xff0c;优化XML数据的存储和检索效率可采取以下措施&#xff1a; 数据库选择&#xff1a;选择适合XML存储和查询的数据库&#xff0c;如Oracle、MySQL、PostgreSQL等。这些数据库提供了专门的XML存储和查询功能&#xff0c;能够更高效地处理XML数据。 …

系统Doze白名单常用接口

获取Doze白名单列表&#xff1a;DeviceIdleController.getUserPowerWhitelist是否Doze白名单&#xff1a;DeviceIdleController.isPowerSaveWhitelistAppDoze白名单变化广播:PowerManager.ACTION_POWER_SAVE_WHITELIST_CHANGED设置Doze白名单&#xff1a;DeviceIdleController.…

【常用知识点-Linux】SSH免密登陆

Author&#xff1a;赵志乾 Date&#xff1a;2024-07-12 Declaration&#xff1a;All Right Reserved&#xff01;&#xff01;&#xff01; 1. 简介 SSH免密登录是一种基于公钥加密技术的安全认证方式&#xff0c;其原理如下&#xff1a; 生成密钥对&#xff1a;客户端生成一对…

树的结构(b,b+树)

无论线性表&#xff0c;栈还是队列&#xff0c;都是一对一&#xff0c;查询的时候&#xff0c;效率较低&#xff0c;数据量比较的大的情况 1.树的定义 一种数据结构&#xff0c;有层次关系的集合&#xff0c;根朝上&#xff0c;叶朝下 除了根节点外&#xff0c;每个子节点都…

【25届秋招备战C++】算法篇-排序算法合集

【25届秋招备战C】算法篇-排序算法合集 一、简介二、解题思路三、模板四、参考 一、简介 排序算法是计算机科学中的基本算法之一&#xff0c;用于将一组数据按照特定的顺序&#xff08;升序或降序&#xff09;进行排列。排序算法广泛应用于数据管理和检索系统&#xff0c;提高…

论文翻译:Large Language Models for Education: A Survey and Outlook

https://arxiv.org/abs/2403.18105 目录 教育领域的大型语言模型&#xff1a;一项调查和展望摘要1. 引言2. 教育应用中的LLM2.1 概述2.2 学习辅助2.2.1 问题解决&#xff08;QS&#xff09; 2.2.2 错误纠正&#xff08;EC&#xff09;2.2.3 困惑助手&#xff08;CH&#xff09;…

第一节变量、运算符、表达式、输入与输出

Hello World package org.wyp;public class Main {//定义了一个类Mainpublic static void main(String[] args) {System.out.println("Hello World");} }变量 byte(字节) 01010111 一个有8位二进制数 每一个0/1叫一位,简称为bit 1byte8bit 一个byte就是一个字节,一…

解决elementUI列表的疑难杂症,排序显示错乱的问题

大家好&#xff0c;在使用elementUI表格时&#xff0c;有时会出现一些意料之外的问题&#xff0c;比如数据排序正常但表格显示、排序错乱等。在网上搜索后一般有2种解决方法&#xff1a;1.给表格每一项的el-table-column添加唯一的id用于区分。2.给表格每一项的el-table-column…

昇思训练营打卡第二十四天(LSTM+CRF序列标注)

LSTM&#xff08;Long Short-Term Memory&#xff0c;长短时记忆网络&#xff09;是一种特殊的循环神经网络&#xff08;RNN&#xff09;&#xff0c;由Hochreiter和Schmidhuber在1997年提出。它旨在解决传统RNN在处理长距离依赖问题时出现的梯度消失和梯度爆炸问题。以下是LST…

羧基聚乙二醇生物素的制备方法;COOH-PEG-Biotin

羧基聚乙二醇生物素&#xff08;COOH-PEG-Biotin&#xff09;是一种常见的生物分子聚合物&#xff0c;具有多种应用&#xff0c;特别是在生物实验、药物研发和生物技术等领域。以下是对该化合物的详细解析&#xff1a; 一、基本信息 名称&#xff1a;羧基聚乙二醇生物素&#x…

数据结构:链表详解 (c++实现)

前言 对于数据结构的线性表&#xff0c;其元素在逻辑结构上都是序列关系&#xff0c;即数据元素之间有前驱和后继关系。 但在物理结构上有两种存储方式&#xff1a; 顺序存储结构&#xff1a; 使用此结构的线性表也叫 顺序表物理存储上是连续的&#xff0c;因此可以随机访问…

电压反馈型运算放大器的增益和带宽

简介 本教程旨在考察标定运算放大器的增益和带宽的常用方法。需要指出的是&#xff0c;本讨论适用于电压反馈(VFB)型运算放大器。 开环增益 与理想的运算放大器不同&#xff0c;实际的运算放大器增益是有限的。开环直流增益(通常表示为AVOL)指放大器在反馈环路未闭合时的增益…

nginx代理gitee

背景 若干台agv设备&#xff0c;这些设备都是没有公网的(无法访问百度等)。 一台服务器(ubuntu20.04)有线可以公网&#xff0c;无线可以实现内部通信(agv&#xff0c;plc等设备)。 目的 agv每一次更新代码&#xff0c;拉取代码等都需要切换到有公网的网络&#xff0c;多台agv设…

守望数据边界:sklearn中的离群点检测技术

守望数据边界&#xff1a;sklearn中的离群点检测技术 在数据分析和机器学习项目中&#xff0c;离群点检测是一项关键任务。离群点&#xff0c;又称异常值或离群点&#xff0c;是指那些与其他数据显著不同的观测值。这些点可能由测量误差、数据录入错误或真实的变异性造成。正确…

借人工智能之手,编织美妙歌词篇章

在音乐的领域中&#xff0c;歌词宛如璀璨的明珠&#xff0c;为旋律增添了无尽的魅力和情感深度。然而&#xff0c;对于许多创作者来说&#xff0c;编织出美妙动人的歌词并非易事。但如今&#xff0c;随着科技的飞速发展&#xff0c;人工智能为我们带来了全新的创作可能。 “妙…

Cornerstone3D导致浏览器崩溃的踩坑记录

WebGL: CONTEXT_LOST_WEBGL: loseContext: context lost ⛳️ 问题描述 在使用vue3vite重构Cornerstone相关项目后&#xff0c;在Mac本地运行良好&#xff0c;但是部署测试环境后&#xff0c;在window系统的Chrome浏览器中切换页面会导致页面崩溃。查看Chrome的任务管理器&am…

高级前端工程师面试题

HTML/CSS 1. 解释HTML5中的<canvas>元素及其用途。 <canvas>元素用于通过JavaScript绘制图形&#xff0c;比如图表、图像处理等。它提供了一个图形上下文&#xff0c;可以进行2D图形绘制。 2. CSS中display: none和visibility: hidden有什么区别&#xff1f; d…

MySQL 面试真题(带答案)

MySQL 场景面试题 目录 场景1&#xff1a;用户注册和登录系统 1.1 数据库设计1.2 用户注册1.3 用户登录 场景2&#xff1a;订单管理系统 2.1 数据库设计2.2 创建订单2.3 查询订单 场景3&#xff1a;博客系统 3.1 数据库设计3.2 发布文章3.3 评论功能 场景1&#xff1a;用户…