web前端开发——标签一

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

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

img标签_src属性

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

绝对路径

图片路径

网络上的图片路径

相对路径

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

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

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


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

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

我们下次再见喽!

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

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

相关文章

C++线程锁std::mutex

基本用法 “mutex”是“mutual exclusion”的缩写&#xff0c;意思是互斥锁。互斥锁用于多线程编程中&#xff0c;以确保同一时间只有一个线程能够访问某一共享资源&#xff0c;从而避免数据竞争和不一致性。 std::mutex是最基本的互斥锁&#xff0c;用于保护共享数据。它有两…

Vue3框架搭建2:axios+typescript封装

仓库地址&#xff1a;https://github.com/buguniao5213/LuArch&#xff08;分支代码未上传&#xff0c;完整一系列后传一波&#xff0c;中途有需求可以再传&#xff09; 1、安装axios npm install axios2、创建文件 先创建一个文件夹&#xff1a; ├── src/ │ ├── …

51单片机-第二节-数码管

一、数码管介绍&#xff1a; 1.什么是数码管&#xff1f; 多个LED组合成8字显示器。 2.一位数码管的引脚&#xff08;只有一个8&#xff09;&#xff1a; 数码管的引脚为1-10&#xff0c;其中公共极为3,8&#xff0c;其余八位分别对应一个二极管&#xff0c;如下图&#xff…

Vue2 基础十Vuex

代码下载 Vuex 概述 组件之间共享数据的方式&#xff1a; 父组件向子组件传值&#xff0c;是以属性的形式绑定值到子组件&#xff08;v-bind&#xff09;&#xff0c;然后子组件用属性props接收。子组件向父组件传值&#xff0c;子组件用 $emit() 自定义事件&#xff0c;父组…

JavaScript--local storage存储的数组不可扩展的问题

数组扩展 问题解析解决办法总结进一步扩展原因 问题 下列代码中的points是从本地存储中获取到的数据&#xff0c;我想存储到一个Map并且新增元素的时候报错 let obj this.objectsManager._objects.get(obstacle.uuid);let points obj.track_points;this.dyObstacleTP.set(ob…

【大模型】大模型相关技术研究—微调

为什么要对大模型进行微调 1.成本效益&#xff1a; o 大模型的参数量非常大&#xff0c;训练成本非常高&#xff0c;每家公司都去从头训练一个自己的大模型&#xff0c;这个事情的性价比非常低。 2.Prompt Engineering 的局限性&#xff1a; o Prompt Engineering 是一种相…

视图库对接系列(GA-T 1400)十二、视图库对接系列(本级)人员数据推送

背景 人体和非机动车和机动车类似的,只是请求的参数不一样而已。人员数据推送 接入人员数据推送相对比较简单,我们只需要实现对应的接口就ok了。 具体如图: 有增删改查接口,目前的话 因为我们是做平台,我们只需要实现添加接口就可以了。 接口实现 service 层 /**** …

软件工程面向对象 超市管理系统 需求分析 系统设计 课程设计报告

1、引言 系统简述 超市管理系统的功能主要有前台管理和后台管理两个大块。其使用对象 有超市管理人员和超市销售人员两类。超市管理系统主要为了实现商品输 入、 输出管理数据的自动化&#xff0c; 提高商品统计信息的实时性&#xff0c; 减轻人工劳动强 度从而节省人力成本。实…

Perl 语言开发(九):深入探索Perl语言的文件处理

目录 1. 文件打开与关闭 1.1 打开文件 1.2 关闭文件 2. 读取文件内容 2.1 逐行读取 2.2 一次性读取整个文件 3. 写入文件内容 3.1 覆盖写入 3.2 追加写入 4. 文件测试操作 4.1 文件测试运算符 5. 文件路径操作 5.1 文件路径处理模块 5.2 获取文件路径信息 6. 文…

探索加油小程序开发:便捷出行的科技新篇章

在快节奏的现代生活中&#xff0c;出行已成为人们日常生活中不可或缺的一部分。随着移动互联网技术的飞速发展&#xff0c;各类小程序以其轻量、便捷的特点迅速融入人们的日常生活&#xff0c;其中&#xff0c;加油小程序作为智慧出行领域的一股清流&#xff0c;正悄然改变着我…

《简历宝典》04 - 简历的“个人信息”模块,要写性别吗?要放照片吗?

平时帮助小伙伴们优化简历的时候&#xff0c;我看见他们有人会写性别&#xff0c;有人不会写。 目录 1 招聘团队的考虑 2 性别是无法改变的&#xff0c;能不写就不写 3 什么情况下&#xff0c;需要写性别呢&#xff1f; 4 简历中要加照片吗&#xff1f; 1 招聘团队的考虑 …

Go语言---异常处理error、panic、recover

异常处理 Go 语言引入了一个关于错误处理的标准模式,即 error 接口,它是 Go 语言内建的接口类型,该接口的定义如下: package errorsfunc New(text string) error {return &errorString{text} }// errorString is a trivial implementation of error. type errorString st…

springboot事故车辆与违章车辆跟踪系统-计算机毕业设计源码03863

springboot事故车辆与违章车辆跟踪系统 摘 要 科技进步的飞速发展引起人们日常生活的巨大变化&#xff0c;电子信息技术的飞速发展使得电子信息技术的各个领域的应用水平得到普及和应用。信息时代的到来已成为不可阻挡的时尚潮流&#xff0c;人类发展的历史正进入一个新时代。…

W外链怎么样,他们家的短网址免费的吗?

W外链作为短网址服务的一种&#xff0c;体现了短网址技术的现代发展趋势&#xff0c;它不仅提供了基础的网址缩短功能&#xff0c;还扩展了一系列高级特性和增值服务&#xff0c;以适应更广泛的市场需求。根据相关参考内容&#xff0c;W外链具有以下特点和优势&#xff1a; 短域…

2024程序员行业风口和面试宝典

国际研究机构Gartner会在每年10月份左右发布下一年度的战略发展趋势预测&#xff0c;并在次年3月左右发布和网络安全相关的趋势预测。绿盟科技通过将近3年的趋势预测进行分组对比分析后发现&#xff0c;除了众人皆知的AI技术应用外&#xff0c;数据模块化、身份优先安全、行业云…

软考高级第四版备考--第13天(控制质量)Perform Quanlity Control

定义&#xff1a;为了评估绩效&#xff0c;确保项目输出完整、正确且满足客户期望而监督和记录质量管理活动执行结果的过程。 作用&#xff1a; 核实项目可交付成果和工作已经达到主要干系人的质量要求&#xff0c;可供最终验收&#xff1b;确定项目输出是否达到预期的目的&a…

01-图像基础-颜色空间

1.RGB颜色空间 RGB是一种常用的颜色空间&#xff0c;比如一幅720P的图像&#xff0c;所对应的像素点个数是1280*720&#xff0c;每一个像素点由三个分量构成&#xff0c;分别是R,G,B。 R代表红色分量&#xff0c;G代表绿色分量&#xff0c;B代表蓝色分量&#xff0c;以24位色来…

加密与安全_密钥体系的三个核心目标之不可否认性解决方案

文章目录 Pre概述不可否认性数字签名&#xff08;Digital Signature&#xff09;证书是什么证书使用流程 PKICA证书层级多级证书证书链是如何完成认证的&#xff1f; 其他疑问1. Alice能直接获取Bob的公钥&#xff0c;是否还需要证书&#xff1f;2. 为什么即使能直接获取公钥也…

理解机器学习中的潜在空间(Understanding Latent Space in Machine Learning)

1、什么是潜在空间&#xff1f; If I have to describe latent space in one sentence, it simply means a representation of compressed data. 如果我必须用一句话来描述潜在空间&#xff0c;它只是意味着压缩数据的表示。 想象一个像上面所示的手写数字&#xff08;0-9&…

vue学习day01-vue的概念、创建Vue实例、插值表达式、响应式、安装Vue开发者工具

1、vue的概念 Vue是一个用于构建用户界面的渐进式 框架 &#xff08;1&#xff09;构建用户界面&#xff1a;基于数据动态渲染页面 &#xff08;2&#xff09;渐进式&#xff1a;循序渐进的学习 &#xff08;3&#xff09;框架&#xff1a;一条完整的项目解决方案&#xff…