【前端】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】(本章)

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

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

相关文章

【可控图像生成系列论文(二)】MimicBrush 港大、阿里、蚂蚁集团合作论文解读2

【可控图像生成系列论文&#xff08;一&#xff09;】简要介绍了论文的整体流程和方法&#xff0c;本文则将就整体方法、模型结构、训练数据和纹理迁移进行详细介绍。 1.整体方法 MimicBrush 的整体框架如下图所示。为了实现模仿编辑&#xff0c;作者设计了一种具有双扩散模型…

【vue3】【vant】 移动本草纲目案例发布收藏项目源码

【vue3】【vant】 移动本草纲目案例发布收藏项目源码 获取源码方式项目说明&#xff1a;其中功能包括 项目包含&#xff1a;项目运行环境文件截图 获取源码方式 加Q群&#xff1a;632562109项目说明&#xff1a; 本系统是使用vue3语法结合vant开发的移动端的本草纲目案例。 用…

制作一个智能体:抖音热点话题文案制作助手

文章目录 第一步&#xff0c;添加助手第二步&#xff0c;选择语聚GPT第三步&#xff0c;填写相关信息第四步&#xff0c;工具中选择抖音(普通号)第五步&#xff0c;选择“查询热门视频数据”第六步&#xff0c;测试总结 这篇文章&#xff0c;我们手把手的演示开发一个智能体&am…

Objects and Classes (对象和类)

Objects and Classes [对象和类] 1. Procedural and Object-Oriented Programming (过程性编程和面向对象编程)2. Abstraction and Classes (抽象和类)2.1. Classes in C (C 中的类)2.2. Implementing Class Member Functions (实现类成员函数)2.3. Using Classes References O…

MyPostMan:按照项目管理接口,基于迭代生成接口文档、执行接口自动化联合测试

MyPostMan 是一款类似 PostMan 的接口请求软件&#xff0c;不同于 PostMan 的是&#xff0c;它按照 项目&#xff08;微服务&#xff09;、目录来管理我们的接口&#xff0c;基于迭代来管理我们的接口文档&#xff0c;可导出或者在局域网内共享&#xff0c;按照迭代编写自动化测…

微信小程序-自定义组件checkbox

一.自定义Coponent组件 公共组件&#xff1a;将页面内公共的模块抽取为自定义组件&#xff0c;在不同页面复用。 页面组件&#xff1a;将复杂页面进行拆分&#xff0c;降低耦合度&#xff0c;有利于代码维护。 可以新建文件夹component放组件&#xff1a; 组件名为custom-che…

【Unity】Timeline的倒播和修改速度(无需协程)

unity timeline倒播 一、核心: 通过playableDirector.playableGraph.GetRootPlayable(i).SetSpeed(speed)接口,设置PlayableDirector的速度。 二、playableGraph报空 若playableDirector不勾选Play On Awake,则默认没有PlayableGraph,需执行playableDirector…RebuildGr…

mysql备份和恢复

目录 一、数据库备份的分类 二、常见的备份方法 三、MySQL完全备份 1&#xff09;数据库完全备份与恢复 2&#xff09;mysqldump备份与恢复 1、完全备份一个或多个完整的库&#xff08;包括其中所有的表&#xff09; 2、完全备份 MySQL 服务器中所有的库 3、完全备份某…

Qt Quick Effect Maker 工具使用介绍

一、介绍 随着 Qt 版本的不断升级,越来越多的功能被加入 Qt,一些新的工具也随之应运而生,Qt Quick Effect Maker 工具是 Qt 6.5 之后才新添加的工具,之前的名字应该是叫做 Qt shader tool 这个模块。 以下是官方的释义:Qt Quick Effect Maker是一个用于为Qt Quick创建自定…

DC/AC电源模块一种效率与可靠性兼备的能源转换解决方案

DC/AC电源模块都是一种效率与可靠性兼备的能源转换解决方案 DC/AC电源模块是一种能够将直流电源&#xff08;DC&#xff09;转换为交流电源&#xff08;AC&#xff09;的设备。它在现代电子设备中扮演着非常重要的角色&#xff0c;因为许多设备需要交流电源才能正常运行。无论…

金融科技行业创新人才培养与引进的重要性及挑战

金融科技行业作为金融与科技的深度融合产物&#xff0c;正以前所未有的速度改变着传统金融业的格局。在这一变革中创新人才的培养与引进成为了行业发展的核心驱动力。然而&#xff0c;尽管其重要性不言而喻&#xff0c;但在实际操作中却面临着诸多挑战。 一、创新人才培养与引进…

echarts 5.5.0版本下的层叠柱形图,每个值都从0开始,会有覆盖情况

需求&#xff1a; 1、每个公司&#xff0c;需要两个柱子去展示&#xff08;stack: 1是第一个柱子&#xff0c;stack:2,是第二个柱子&#xff09;&#xff1b; 2、必须每个数据都是从0开始&#xff0c;不在上一个值上累加&#xff1b; 3、鼠标滑上去的时候&#xff0c;最大值…

ffmpeg音视频开发从入门到精通——ffmpeg日志及目录操作

文章目录 FFMPEG1. 操作日志2. 文件移动和删除3. 操作目录重要函数 FFMPEG 1. 操作日志 日志级别 AV LOG ERROR AV LOG WARNING AV LOG INFO AV LOG DEBUG cmake_minimum_required(VERSION 3.27) project(FFmpeg_exercise) set(CMAKE_CXX_STANDARD 14)# 定义FFmpeg的安装路…

基于Java技术的在线学习平台系统

开头语&#xff1a;你好呀&#xff0c;我是计算机学姐码农小野&#xff01;如果有相关需求&#xff0c;可以私信联系我。 开发语言&#xff1a;Java 数据库&#xff1a;MySQL 技术&#xff1a;Java技术&#xff0c;基于SpringBoot框架 工具&#xff1a;Eclipse、Navicat、M…

【ocean】ocnPrin结合getData导出数据

核心就是这一句ocnPrint(?output fout leafValue( getData(“/output” ?result “dc”))) r_list list(4000, 4100, 4200) multi_list list(20,21,22) fout outfile("/home/yourpath/results.txt" "w") foreach(r_value r_listforeach(multi_value …

Redis数据库(六):主从复制和缓存穿透及雪崩

目录 一、Redis主从复制 1.1 概念 1.2 主从复制的作用 1.3 实现一主二从 1.4 哨兵模式 1.4.1 哨兵的作用 1.4.2 哨兵模式的优缺点 二、Redis缓存穿透和雪崩 2.1 缓存穿透——查不到 2.1.1 缓存穿透解决办法 2.2 缓存击穿 - 量太大&#xff0c;缓存过期 2.2.1 缓存…

高频面试题基本总结回顾2(含笔试高频算法整理)

干货分享&#xff0c;感谢您的阅读&#xff01; &#xff08;暂存篇---后续会删除&#xff0c;完整版和持续更新见高频面试题基本总结回顾&#xff08;含笔试高频算法整理&#xff09;&#xff09; 备注&#xff1a;引用请标注出处&#xff0c;同时存在的问题请在相关博客留言…

如何快速解决验证码图像问题 | 最佳图像(OCR)验证码解决工具

你是否曾经遇到过陷入一个看似无尽的 CAPTCHA 挑战中&#xff0c;努力识别扭曲的字符或数字&#xff1f;这些令人抓狂的 CAPTCHA 是为了确保你是人类而不是机器人&#xff0c;但它们也给真正的用户带来了头痛。那么&#xff0c;有没有快速解决这些 CAPTCHA 图像的方法&#xff…

Vue-Ci搭建项目

项目创建 vue-cli 官方提供的一个脚手架,用于快速生成一个vue的项目模板;预先定义 好的目录结构及基础代码,就好比咱们在创建Maven项目时可以选择创建一个 骨架项目,这个骨架项目就是脚手架,我们的开发更加的快速; 主要的功能 ● 统一的目录结构 ● 本地调试 热部署 ● 单元…

华为OD机试 - 石头剪刀布游戏(Java 2024 D卷 200分)

华为OD机试 2024D卷题库疯狂收录中&#xff0c;刷题点这里 专栏导读 本专栏收录于《华为OD机试&#xff08;JAVA&#xff09;真题&#xff08;D卷C卷A卷B卷&#xff09;》。 刷的越多&#xff0c;抽中的概率越大&#xff0c;每一题都有详细的答题思路、详细的代码注释、样例测…