【前端】HTML+CSS复习记录【2】

文章目录

  • 前言
  • 一、img(图片标签)
  • 二、a(链接标签)
  • 三、ul(无序列表)
  • 四、ol(有序列表)
  • 系列文章目录


前言

长时间未使用HTML编程,前端知识感觉忘得差不多了。通过梳理知识点,重新学习和巩固前段相关知识。
学习位置:W3CSchool:HTML + CSS 基础实战


一、img(图片标签)

<img>标签为单标签元素:<img src="图片的地址" alt="坐在桌子上的兔子">
src属性:填写图片指向地址
alt属性:在图片无法加载时显示的替代文字.是当图片无法显示时的替代显示的文本。

​alt ​属性对于盲人或视觉障碍的用户理解图片中的内容非常重要,搜索引擎也会搜索​alt​ 属性来了解图片的内容。
加了​alt=""​ 当图片不能正常加载,可视化浏览器会隐藏表示图片损坏的图标。不加alt,当图片无法加载时,会显示裂纹图标

二、a(链接标签)

在这里插入图片描述

href属性:a标签中也可插入图片或其他内容作为链接,也可实现页面内跳转
	<a href="#">点击</a> <!--点击会跳转到当前页页首-->
	<a href="#test">点击1</a><!--点击会跳转到当前页id="test"的元素位置-->
	<div id="test"></div><!--注:id​是用来描述网页元素的一个属性,它的值在整个页面中唯一-->

target属性:设置打开链接的方式

target=_blank,在新窗口打开。表示在新窗口中打开该链接。
target=_self,在当前窗口打开。表示相同框架,即在当前窗口(或当前选项卡)中打开该链接。 还有两个不常用的:
target=_parent,在父窗口打开。将链接的文件载入含有该链接框架的父框架集或父窗口中。如果含有该链接的框架不是嵌套的,则在浏览器全屏窗口中载入链接的文件,就象_self参数一样。
target=_top,在顶级窗口打开。在当前的整个浏览器窗口中打开所链接的文档,因而会删除所有框架,不写的话就是表示默认值,默认值一般跟浏览器有关。
原文链接:https://blog.csdn.net/hmz856/article/details/131182598

三、ul(无序列表)

将 ​<ul>​ 标签与 ​<li> ​标签一起使用,创建无序列表。
子项前面加了实心小黑点,这个小黑点可以通过 CSS 调整成其他样子比如菱形。
    <ul>
        <li></li>
        <li></li>
        <li></li>
    </ul>

四、ol(有序列表)

可以改变列表起始数值
<ol start="50">
  <li>咖啡</li>
  <li>牛奶</li>
  <li></li>
</ol>

在这里插入图片描述


系列文章目录

【前端】HTML+CSS复习记录【1】
【前端】HTML+CSS复习记录【2】(本章)

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

9 个让 Python 性能更高的小技巧,你掌握了吗?

我们经常听到 “Python 太慢了”&#xff0c;“Python 性能不行”这样的观点。但是&#xff0c;只要掌握一些编程技巧&#xff0c;就能大幅提升 Python 的运行速度。 今天就让我们一起来看下让 Python 性能更高的 9 个小技巧 python学习资料分享&#xff08;无偿&#xff09;…

人力资源成熟度模型的应用

由于各子&#xff08;分&#xff09;公司的业务相同&#xff0c;该电力总公司人力资源部收归了下属单位的人事招聘权、调配权以及考评权&#xff0c;期望通过集权对下属人力资源部实施过程管控&#xff0c;现实结果证明&#xff0c;这种集权并不能达到该电力公司的人力资源管理…

Web浏览器读写NFC Ntag标签

本示例使用的发卡器&#xff1a;RS232串口USB转COM读写器IC卡发卡器WEB浏览器二次开发JS编程SDK-淘宝网 (taobao.com) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&g…

Nginx常见的基本配置(全网最详细!!!)

&#x1fa81;Nginx常用命令 &#x1f3a8;Nginx正向代理 &#x1f94f;Nginx反向代理 &#x1f52e;Nginx负载均衡 &#x1f381;Nginx基本配置详解 ## # 全局配置 ##user www-data; ## 配置 worker 进程的用户和组 worker_processes auto; ## 配置 worke…

台球厅助教软件开发台球陪练系统源码助教陪练行业市场分析

市场分析 随着台球运动的普及和竞技水平的不断提升&#xff0c;台球助教市场也逐渐成为了一个备受关注的领域。然而&#xff0c;如何高效、规范地管理这一市场&#xff0c;确保助教质量&#xff0c;提升用户体验&#xff0c;成为了摆在我们面前的一大挑战。幸运的是&#xff0…

网络安全 DVWA通关指南 Cross Site Request Forgery (CSRF)

DVWA Cross Site Request Forgery (CSRF) 文章目录 DVWA Cross Site Request Forgery (CSRF)DVWA Low 级别 CSRFDVWA Medium 级别 CSRFDVWA High 级别 CSRFDVWA Impossible 级别 CSRF CSRF是跨站请求伪造攻击&#xff0c;由客户端发起&#xff0c;是由于没有在执行关键操作时&a…

【数据分析】重仓白酒的资金,流向哪里?

内容提要 更多重仓白酒的资金向红利&#xff08;主要是银行少量的石油石化&#xff09;调仓&#xff0c;有较少部分向通信和电子调仓&#xff08;尤其是消费电子&#xff09;&#xff0c;对出海的调仓目前看并不清晰。 文章正文 近期白酒板块跌幅较大&#xff0c;催化因素在…

轨迹跟踪PID相关及前馈引入结果对比

1、前言&#xff1a; 记录下给定一段轨迹如何实现跟踪控制&#xff0c;主要使用几个经典的方法进行对比。一些讨论的部分在代码中的注释部分。 前馈控制可以在没有扰动和建模误差的理想条件下很好地跟踪期望输出&#xff0c;但在实际系统中&#xff0c;由于存在建模误差、外部扰…

网络安全入门必选:十款免费的抓包工具有哪些?

下面给大家推荐几款好用的免费的抓包工具软件&#xff0c;有需要的小伙伴们来了解一下。 1. Wireshark抓包分析工具 4.0.1 Wireshark是一款功能强大的网络协议分析器&#xff0c;可以实时检测和抓取网络通讯数据。它支持多种协议和媒体类型&#xff0c;并具备丰富的显示过滤…

汇凯金业:如何正确做黄金趋势单

炒黄金过程中&#xff0c;如何准确把握趋势并顺势而为&#xff0c;是大多数投资者面临的普遍问题。专家们经常强调顺势而为的重要性&#xff0c;但具体应如何操作&#xff0c;许多投资者仍然存在疑惑。本文将从五个关键策略入手&#xff0c;为您详细解析黄金趋势单的操作方法&a…

基于Python学生成绩管理系统详细设计和实现(源码+LW+调试文档+讲解等)

&#x1f497;博主介绍&#xff1a;✌全网粉丝10W,CSDN作者、博客专家、全栈领域优质创作者&#xff0c;博客之星、平台优质作者、专注于Java、小程序技术领域和毕业项目实战✌&#x1f497; &#x1f31f;文末获取源码数据库&#x1f31f; 感兴趣的可以先收藏起来&#xff0c;…

Flutter 小技巧之为什么推荐 Widget 使用 const

今天收到这个问题&#xff0c;本来想着简单回复下&#xff0c;但是感觉这个话题又可以稍微展开讲讲&#xff0c;干脆就整理成一篇简单的科普&#xff0c;这样也能更方便清晰地回答这个问题。 聊这个问题之前&#xff0c;我们需要把一个“老生常谈”的概念拿出来说&#xff0c;那…

安宝特方案 | AR眼镜+手套式扫码枪,智能化仓储创新应用

新扫码设备形态&#xff0c;提升工作效率 传统的仓储工作通常依赖人工操作和纸质记录&#xff0c;这不仅耗时又容易出错。 引入穿戴式AR设备和手套式扫码枪后&#xff0c;AR眼镜可以将数字信息直接叠加在视野中&#xff0c;仓储工人只需佩戴设备即可看到货物位置、库存数量和任…

3. 向索引库中导入数据

1. 准备数据库对象 import com.baomidou.mybatisplus.annotation.IdType; import com.baomidou.mybatisplus.annotation.TableId; import com.baomidou.mybatisplus.annotation.TableName; import lombok.AllArgsConstructor; import lombok.Data; import lombok.NoArgsConstr…

高校外卖点餐系统

摘 要 随着互联网的快速发展&#xff0c;外卖点餐已经成为人们生活中的一部分。为了满足高校学生的需求&#xff0c;本文设计和实现了一个基于Java Web的高校外卖点餐系统。该系统采用B/S架构&#xff0c;使用Java语言和SSM框架进行开发&#xff0c;前端使用Vue框架进行设计。…

idea中使用springboot进行开发时遇到的工程结构问题汇总

idea中的工程结构和eclipse中不同&#xff0c;但是配置的内容都是一样的。 IDEA中也就是这个页面&#xff0c;快捷键ctrlaltshifts 如果在eclipse中&#xff0c;经常会遇到jre和jdk不正确的情况&#xff0c;但IDEA中这个问题很少&#xff0c;但是IDEA中会经常由于未正常配置根…

基于SpringBoot音乐网站与分享平台详细设计和实现(源码+LW+调试文档+讲解等)

&#x1f497;博主介绍&#xff1a;✌全网粉丝10W,CSDN作者、博客专家、全栈领域优质创作者&#xff0c;博客之星、平台优质作者、专注于Java、小程序技术领域和毕业项目实战✌&#x1f497; Java精品实战案例《600套》 2023-2025年最值得选择的Java毕业设计选题大全&#xff1…

浅谈逻辑控制器之仅一次控制器

浅谈逻辑控制器之仅一次控制器 “仅一次控制器”(Once Only Controller) 是一个非常实用的组件&#xff0c;它允许用户控制测试计划中的某些操作仅执行一次&#xff0c;无论其所在的线程组或父级控制器设置了多少次循环。本指南将详细介绍“仅一次控制器”的功能、使用场景及配…

RSA非对称加密-openssl命令及C语言实现

RSA加密算法是一种非对称加密算法。在公开密钥加密和电子商业中RSA被广泛使用。本文介绍如何使用openssl命令和C代码实现基础的RSA加/解密和签名/验签功能。 一、openssl命令实现RSA加解密 1、生成私钥和公钥 生成私钥 openssl genrsa -out private.key 2048 #…

『Z-Workshop』 6月22日线下ALCOVE分享活动

2024 求是创新 ZJUBCA Sponsored by the ALCOVE Community TIME&#xff1a;2024/06/22 ADD&#xff1a;浙江大学紫金港校区 --- Alcove 是 Aptos 公链与 Alibaba Cloud 共同打造的亚洲首个 Move 开发者社区&#xff0c;致力于支持开发者使用 Move 语言构建下一代 Web3 应用&am…