HTML5文本标签、图像标签、超链接

一、文本样式标签

  • 字体样式标签:
加粗:<strong>…</strong>
斜体: < em >…</ em>

eg:

<h3>徐志摩人物简介</h3>

<p>

   <strong>1910</strong>年入杭州学堂<br/>

   <em>1918</em>年赴美国克拉大学学习银行学<br/>

    ……

</p>

 

  •  特殊符号

注意: 

路径:绝对路径 指目录下的绝对位置,通常从盘符开始的路径(了解)  

D:\chapter02\images\1.jpg
https://image.baidu.com/search/1.jpg
相对路径 指从 当前文件开始 出发找目标文件的过程        
eg:

<img src=“ditu.jpg” alt=“” />  或者 <img src=“./ditu.jpg” alt=“” />

<img src=“./images/ditu.jpg” alt=“” />

<img src=“../3.jpg” alt=“” />

 二、图像标签

 

 标签属性特点:

  1. 标签的属性写在开始标签内
  2. 标签名与属性之间必须以空格隔开
  3. 标签内可以同时存在多个属性
  4. 属性之间以空格隔开
  5. 属性之间没有顺序之分

 三、超链接

 eg:

<a  href="detail.html"  target="_blank">姑娘,欢迎降落在这残酷的世界</a>【文本超链接】

<a  href="detail.html"  target="_blank">

    <img src="image/img1.png" alt="姑娘,欢迎降落在这残酷的世界"【图像超链接】

           title="姑娘,欢迎降落在这残酷的世界" />

</a>【前提有detail.html文件】

 常用超链接

  • 页面间链接 
  • 锚链接:
    A 页面的甲位置跳转到本页中的乙位置
    A 页面的甲位置跳转到 B 页面中的乙位置
    创建步骤:
    创建跳转标记 <a id="marker"> 乙位置 </a>
    创建跳转链接 <a href ="#marker"> 甲位置 </a>
  • 功能性链接:
  1. 电子邮件
  2. QQ
  3. MSN (微信或钉钉)
eg: <a href=" mailto : bdqnWebmaster@bdqn.cn"> 联系我们</a> 【邮件链接】

 行内元素和块元素:

块元素: 无论内容多少,该元素独占一行( p h1-h6…
行内元素:内容撑开宽度,左右都是行内元素的可以排在一行 (a strong em …)

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

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

相关文章

微信小程序 - 本地存储 增加有效期

小程序的本地存储API提供了wx.setStorageSync和wx.setStorage来存储数据&#xff0c;注意的是&#xff0c;小程序的本地存储并没有明确的有效期设置&#xff0c;存储的数据在不超过限制的情况下&#xff0c;会一直保留。 一、小程序本地存储API 小程序的本地存储API提供了设置…

WEB06JavaScriptAjax

基础语法 引入方式 引入方式 内部脚本&#xff1a;将JS代码定义在HTML页面中 JavaScript代码必须位于<script></script>标签之间 在HTML文档中&#xff0c;可以在任意地方&#xff0c;放置任意数量的<script> 一般会把脚本置于<body>元素的底部&a…

常见的气体流量计有哪些?

1.气体涡轮流量计 适用场合&#xff1a;流量变化小&#xff0c;脉动流频率小&#xff0c;中低压洁净天然气优点 1.精度高&#xff0c;重复性好 2.测量范围广&#xff0c;压损小&#xff0c;安装维修方便 3.具有较高的抗电磁干扰和抗震动能力缺点&#xff1a;分辨率低&#xff…

浏览器中js外挂脚本的执行方式

1、开发工具控制台交互执行 网页中按F12打开开发者工具&#xff0c;选择“控制台”&#xff0c;键入js脚本命令回车执行&#xff0c;适用于临时使用脚本逻辑简单的场景&#xff0c;实例如下&#xff1a; // 获取网页元素的文本脚本 var elem document.getElementById("…

接入应用内支付服务,提高商业变现效率

在当今竞争激烈的移动应用市场中&#xff0c;开发者们面临着提升应用商业变现能力的挑战。用户体验的流畅性和支付的安全性至关重要。 HarmonyOS SDK应用内支付服务&#xff08;IAP Kit&#xff09;为开发者提供了一站式的解决方案&#xff0c;简化了应用内支付的接入流程&…

C嘎嘎:类和对象(一)

目录 面向过程和面向对象的初步认识 类的引入 类的定义 类的访问限定符及封装 访问限定符 封装 类的作用域 类的实例化 类对象模型 如何计算类对象大小 结构体内存对齐规则 this指针 this指针的引出 this指针的特性 类的6个默认成员函数 构造函数 概念 特性 …

喜讯丨美格智能通过国际EcoVadis平台认证企业社会责任并荣获承诺奖章,彰显可持续发展实力

作为全球领先的无线通信模组及解决方案提供商&#xff0c;美格智能在社会责任领域再创新高。近日&#xff0c;美格智能凭借在企业社会责任和可持续性采购发展方面的卓越表现&#xff0c;通过国际在线权威评价机构EcoVadis对公司环境、劳工与人权、商业道德、可持续采购等方面审…

根据空格、制表符、回车符等分割字符串re.split

【小白从小学Python、C、Java】 【考研初试复试毕业设计】 【Python基础AI数据分析】 根据空格、制表符、 回车符等分割字符串 re.split [太阳]选择题 根据给定的Python代码&#xff0c;哪个选项是正确的&#xff1f; import re pattern r\s print(f"【显示】pattern{…

高清图片压缩无水印小程序源码系统 前后端分离 带完整的安装代码包以及搭建教程

系统概述 在当今的数字化时代&#xff0c;图片作为信息传播的重要载体&#xff0c;其质量和传输效率直接影响到用户体验。然而&#xff0c;高清图片往往伴随着较大的文件体积&#xff0c;这不仅会占用大量存储空间&#xff0c;还会拖慢网页或应用的加载速度。因此&#xff0c;…

热烈祝贺!全视通多家客户上榜全球自然指数TOP100!

2024年6月18日&#xff0c;全球医疗机构自然指数TOP100榜单发布&#xff0c;中国医疗机构在其中的表现尤为引人注目。 根据《自然》杂志网站发布的数据&#xff0c;此次公布的排名是基于&#xff08;2023年3月1日至2024年2月29日&#xff09;的统计数据&#xff0c;全球医疗机构…

旗晟机器人AI智能算法有哪些?

在当今迅猛发展的工业4.0时代&#xff0c;智能制造和自动化运维已然成为工业发展至关重要的核心驱动力。伴随技术的持续进步&#xff0c;工业场景中的运维巡检已不再单纯地依赖于传统的人工运维方式&#xff0c;而是愈发多地融入了智能化的元素&#xff0c;其中智能巡检运维系统…

前端Din字体和造字工房力黑字体文件

Din 字体是一种经典的、简洁的无衬线字体&#xff0c;它源自1930年代的德国交通标志设计。 造字工房力黑字体适用于数字&#xff0c;驾驶舱标题等统计界面 DIN-Medium.otf 案例 造字工房力黑.TTF 案例

记录一次MySql锁等待 (Lock wait timeout exceeded)异常

[TOC](记录一次MySql锁等待 (Lock wait timeout exceeded)异常) Java执行一个SQL查询未提交&#xff0c;遇到1205错误。 java.lang.Exception: ### Error updating database. Cause: java.sql.SQLException: Lock wait timeout exceeded; try restarting transactionCluster…

动手学深度学习6.2 图像卷积-笔记练习(PyTorch)

以下内容为结合李沐老师的课程和教材补充的学习笔记&#xff0c;以及对课后练习的一些思考&#xff0c;自留回顾&#xff0c;也供同学之人交流参考。 本节课程地址&#xff1a;卷积层_哔哩哔哩_bilibili 代码_哔哩哔哩_bilibili 本节教材地址&#xff1a;6.2. 图像卷积 — 动…

浅析Nginx技术:开源高性能Web服务器与反向代理

什么是Nginx&#xff1f; Nginx是一款轻量级、高性能的HTTP和反向代理服务器&#xff0c;也可以用作邮件代理服务器。它最初由俄罗斯的程序员Igor Sysoev在2004年开发&#xff0c;并于2004年首次公开发布。Nginx的主要优势在于其非阻塞的事件驱动架构&#xff0c;能够处理大量并…

Vue3使用ref绑定组件获取valueRef.value为null的解决

问题&#xff1a; onMounted(() > {nextTick(()>{console.log(treeselectRef, treeselectRef.value);console.log(treeselectRef.value, treeselectRef.value);}); });输出&#xff1a; 查看绑定和定义都没有问题&#xff0c;还是获取不到 解决&#xff1a;使用getCur…

14-55 剑和诗人29 - RoSA:一种新的 PEFT 方法

介绍 参数高效微调 (PEFT) 方法已成为 NLP 领域研究的热门领域。随着语言模型不断扩展到前所未有的规模&#xff0c;在下游任务中微调所有参数的成本变得非常高昂。PEFT 方法通过将微调限制在一小部分参数上来提供解决方案&#xff0c;从而以极低的计算成本在自然语言理解任务上…

深度学习(笔记内容)

1.国内镜像网站 pip使用清华源镜像源 pip install <库> -i https://pypi.tuna.tsinghua.edu.cn/simple/ pip使用豆瓣的镜像源 pip install <库> -i https://pypi.douban.com/simple/ pip使用中国科技大学的镜像源 pip install <库> -i https://pypi.mirro…

vite工程化开发配置---持续更新

vite支持tsx开发 根据之前写的文章vue3vitetseslintprettierstylelinthuskylint-stagedcommitlintcommitizencz-git里面tsconfig配置了jsx相关选项&#xff0c;但是想要vite能够识别我们还需要配置一下 安装vitejs/plugin-vue-jsx pnpm i -D vitejs/plugin-vue-jsxvite.confi…

如何压缩pdf文件大小,怎么压缩pdf文件大小

在数字化时代&#xff0c;pdf文件因其稳定的格式和跨平台兼容性&#xff0c;成为了工作与学习中不可或缺的一部分。然而&#xff0c;随着pdf文件内容的丰富&#xff0c;pdf文件的体积也随之增大&#xff0c;给传输和存储带来了不少挑战。本文将深入探讨如何高效压缩pdf文件大小…