html中图片、音乐、视频标签及选择器、背景

news2024/11/27 0:24:38

目录

图片

音乐

视频

子代选择器

交集选择器

背景


文章主要补充之前html文章一些漏洞:HTML常用标签+表格+表单_小俱的一步步的博客-CSDN博客

在VScode中新创建html文件,!+“Tab”键,自动生成html骨架

图片

<img src="图片相对地址"></img>

     属性:

alt:替换文本

title:提示文本,鼠标悬停在图片上提示文本

音乐

<audio src="音乐相对地址" controls autoplay loop></audio>

     属性:

controls:显示播放控件

autoplay:自动播放

loop:循环播放

视频

        <video src="视频相对地址" controls autoplay muted></video>

     属性:

controls:显示播放控件

autoplay:自动播放,但是谷歌浏览器中要配muted 才能自动播放且静音

loop:循环播放

补充标签: 

子代选择器

交集选择器

多个相同标签可以单独选择一个

背景

 

背景颜色

background-color:颜色名/rgba(红,绿,蓝,透明度)

快捷键 :w300+h200+bgc

背景图

快捷键:bgi

背景平铺

background-repeat

快捷键 :bgr

属性值:

取值效果
repeat(默认值)水平和垂直方向都平铺
no-repeat不平铺
repeat-x沿水平方向(x轴)平铺
repeat-y沿垂直方向(y轴)平铺

背景位置

background-position

快捷键: bgp

 

背景符合属性写法:

background: color image repeat position 

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

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

相关文章

Android T 禁止应用添加窗口的操作

序 什么情况下会出现我们需要禁止应用添加窗口的情况呢&#xff1f; 假如有一个应用的窗口&#xff0c;我们点开后是透明的或者会影响到系统的使用&#xff0c;那么我们就有必要对这个窗口操作一下 回顾我们在Android T WMS窗口相关流程中所讲的内容 禁止应用添加窗口的操作…

leetcode题目分析(一)leetcode155最小栈

一、前言 本题基于leetcode155最小栈这道题&#xff0c;说一下通过java解决的一些方法。 需要尤其注意的是&#xff0c;此题输入的值的区间范围在-2^31 < val < 2^31 - 1.这将会影响我们最后一种最优解的结果出现问题。这些都是后话。 二、解决思路 其实在一开始的提交…

vue-cli vue3

安装 cli npm i -g vue/cli4.5.13查看版本&#xff1a;vue -V升级版本&#xff1a;npm update -g vue/cli 升级 在 v 3.0.0 版本中是不支持的最新的 script setup 语法执行指令升级&#xff1a; npm i vue3.2.8 vue-router4.0.11 vuex4.0.2 "vue": "^3.2.8&q…

方案:AI赋能,森林防火可视化智能监管与风险预警系统解决方案

一、方案背景 森林火灾是世界八大自然灾害之一&#xff0c;具有发生面广、突发性强、破坏性大、危险性高、处置扑救特别困难等特点&#xff0c;严重危及人民生命财产和森林资源安全&#xff0c;甚至引发生态灾难。有效预防和及时控制森林火灾是保护国家生态建设成果、推进生态…

SOLIDWORKS三维剖视图怎么做

1.SOLIDWORKS一般剖视图制作方法&#xff0c; a.先选择剖面视图命令制作&#xff08;常用&#xff09; b.先绘制剖切线制作剖视图&#xff0c;绘制剖切线—选择剖面视图命令 2.SOLIDWORKS剖面线的调整。当对默认剖面线不满意时&#xff0c;可以双击剖面线对剖面线进行调整调整 …

Qt重写QTreeWidget实现拖拽

介绍 此文章记录QTreeWidget的重写进度&#xff0c;暂时停滞使用&#xff0c;重写了QTreeWidget的拖拽功能&#xff0c;和绘制功能&#xff0c;自定义了数据结构&#xff0c;增加复制&#xff0c;粘贴&#xff0c;删除&#xff0c;准备实现动态刷新数据支持千万数据动态刷新&a…

Postman应用——Pre-request Script和Test Script脚本介绍

文章目录 Pre-request Script所在位置CollectionFolderRequest Test Script所在位置CollectionFolderRequest Pre-request Script&#xff08;前置脚本&#xff09;&#xff1a;可以使用在Collection、Folder和Request中&#xff0c;并在Request请求之前执行&#xff0c;可用于…

整站抓取的神器

整站抓取的神器 TeleportUltraWebZipMihov Picture DownloaderWinHTTrack HTTrackMaxprogWebDumper 五款整站抓取的工具 TeleportUltra Teleport Ultra所能做的&#xff0c;不仅仅是离线浏览某个网页(让你离线快速浏览某个网页的内容当然是它的一项重要功能)&#xff0c;它可…

链表oj题2(Leetcode)(牛客)——合并两个有序链表;判断回文链表;链表分割

链表oj题2&#xff08;Leetcode&#xff09;&#xff08;牛客&#xff09; 一&#xff0c;合并两个有序链表1.1分析2.2代码 二&#xff0c;链表的回文结构2.1分析2.2代码 三&#xff0c;链表分割3.1分析3.2代码 四&#xff0c;小结 一&#xff0c;合并两个有序链表 合并两个有…

vue的工程化开发全流程,以及开发中的细节语法和用法

vue的工程化开发全流程 文章目录 vue的工程化开发全流程1、工程化开发&脚手架Vue CLI1.1、前言1.2、脚手架Vue CLI1.3、脚手架目录文件介绍&项目运行流程1.4、组件化开发&根组件1.5、普通组件的注册使用 2、工程化开发细则2.1、组件的三大组成部分2.2、组件的样式冲…

yolov8在设置amp=False 之后map 训练依旧为0 解决办法

可能原因 是cuda 版本导致的半精度浮点数计算出现nan的bug 解决办法 设置ampFalse 就是不使用混合精度训练。或者直接改用低版本的cuda和pytorch。cuda11.6 以下 直接有效也有可能是学习率过高 降低学习率 设置ampFalse之后还是存在问题 是因为yolov8库的问题 按以下修改 找到…

RKDevTool打包成update.img

(1) 准备好RKDevTool_Release和rockdev目录相关的文件工具 (2) 在rockdev建立image目录 (3) 往image填入和package-file有关的img文件 (4) 运行需要的xxx_mkupdate文件,直到生成想要的update.img (5) 导入烧录工具,文件大,需要等待一段时间,进入MASKROM模式,点击烧录upd…

我只是个小市民——经受不住宏大叙事

我只是个小市民 ——经受不住宏大叙事 作日看到一个曾经的朋友在朋友圈晒出了在某地旅游的照片&#xff0c;照片清新动人&#xff0c;狠狠地打入了我的内心&#xff0c;我知道光靠手机是拍不出来这样唯美的画面的&#xff0c;于是我问她是如何弄出这么好看的照片&#xff0c;…

淘宝商品sku数据接口监控

淘宝商品sku数据接口监控是指通过API接口对淘宝店铺的商品库存、价格、销售量等数据进行实时监控&#xff0c;以便商家能够及时调整销售策略、优化库存、了解竞争对手的动态等。 监控的具体功能包括&#xff1a; 实时监控商品库存和价格变化&#xff0c;及时调整自己的销售策…

数据结构前瞻

集合框架 JAVA的集合框架是定义在java.util包下的一组接口和实现类&#xff0c;用于将多个元素置于一个单元中&#xff0c;对这些元素进行快速&#xff0c;便捷的存储&#xff0c;减速和管理&#xff0c;即增删查改 下面的格子&#xff0c;黄色代表接口&#xff0c;蓝色代表抽…

监控办公室电脑用什么软件?

监控办公室员工电脑的工作情况是一项非常重要的管理任务&#xff0c;它可以帮助企业管理者及时发现员工的问题、提高工作效率和保障企业安全。以下是一些具体的方法和步骤&#xff0c;供您参考&#xff1a; 1、安装监控软件 在监控员工电脑之前&#xff0c;您需要先安装一款专…

Redis核心数据结构实战与高性能解析

目录 一、安装Redis 二、Redis线程与高性能 2.1 Redis是单线程么&#xff1f; 2.2 Redis读写是单线程为何这么快&#xff1f; 2.3 Redis如何处理并发操作命令&#xff1f; 三、核心数据结构实战 3.1 字符串常用操作实战 SET 存入键值对 SETNX SETEX MSET 批量存入键…

vue3中两个el-select下拉框选项相互影响

vue3中两个el-select下拉框选项相互影响 1、开发需求2、代码2.1 定义hooks文件2.2 在组件中使用 1、开发需求 如图所示&#xff0c;在项目开发过程中&#xff0c;遇到这样一个需求&#xff0c;常规时段中选中的月份在高峰时段中是禁止选择的状态&#xff0c;反之亦然。 2、代…

《Cesium 进阶知识点》- 关闭天空盒,自定义背景图

效果 关键代码 1.代码第 4 行&#xff0c;初始化时配置 webgl.alpha 为 true&#xff1b; 2.代码第 8 行&#xff0c;不显示天空盒&#xff1b; 3.代码第 9 行&#xff0c;背景色透明&#xff1b; const viewer new Cesium.Viewer(cesiumContainer, {contextOptions: {…

室内导航制作:从背景到实施效益的全面解析

室内导航市场需求的增长主要源于两方面&#xff1a;一是人们对便捷生活的追求&#xff0c;二是物联网、大数据、人工智能等技术的发展。在日常生活中&#xff0c;我们经常需要在复杂的环境中进行定位和导航&#xff0c;比如大型购物商场、机场、车站等。传统的室外导航方式无法…