CSS笔记(黑马程序员pink老师前端)盒子阴影,文字阴影

盒子阴影

属性值为box-shadow,盒子阴影不占空间,不影响盒子之间的距离.

说明
h-shadow必需,水平阴影位置,允许为负值
v-shadow必需,水平阴影位置,允许为负值
blur可选,模糊距离,数值越大影子越模糊
spread可选,影子的尺寸
color可选,影子的颜色
inset可选, 将外阴影改为内阴影(省略即为outset,outset不能出现在语句中)

示例:box-shadow: 20px 20px 20px rgba(0, 0, 0, 0.3);

鼠标经过盒子添加阴影,最终效果:
在这里插入图片描述

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><style>.div1 {height: 100px;width: 100px;background-color: pink;}.div1:hover {box-shadow: 20px 20px 20px rgba(0, 0, 0, 0.3);}
</style><body><div class="div1"></div>
</body></html>

文字阴影

属性值为text-shadow

说明
h-shadow必需,水平阴影位置,允许为负值
v-shadow必需,水平阴影位置,允许为负值
blur可选,模糊距离,数值越大影子越模糊
color可选,影子的颜色

示例:text-shadow: 10px 10px 10px rgba(0, 0, 0, 0.3);

在这里插入图片描述

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

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

相关文章

微服务04-Gateway网关

作用 身份认证&#xff1a;用户能不能访问 服务路由&#xff1a;用户访问到那个服务中去 负载均衡&#xff1a;一个服务可能有多个实例&#xff0c;甚至集群&#xff0c;负载均衡就是你的请求到哪一个实例上去 请求限流功能&#xff1a;对请求进行流量限制&#xff0c;对服务…

sklearn中make_blobs方法:聚类数据生成器

sklearn中make_blobs()方法参数&#xff1a; n_samples:表示数据样本点个数,默认值100 n_features:是每个样本的特征&#xff08;或属性&#xff09;数&#xff0c;也表示数据的维度&#xff0c;默认值是2。默认为 2 维数据&#xff0c;测试选取 2 维数据也方便进行可视化展示…

FPGA实战小项目2

基于FPGA的贪吃蛇游戏 基于FPGA的贪吃蛇游戏 基于fpga的数字密码锁ego1 基于fpga的数字密码锁ego1 基于fpga的数字时钟 basys3 基于fpga的数字时钟 basys3

Android 大图显示优化方案-加载Gif 自定义解码器

基于Glide做了图片显示的优化&#xff0c;尤其是加载Gif图的优化&#xff0c;原生Glide加载Gif图性能较低。在原生基础上做了自定义解码器的优化&#xff0c;提升Glide性能 Glide加载大图和Gif 尤其是列表存在gif时&#xff0c;会有明显卡顿&#xff0c;cpu和内存占用较高&…

lambda表达式介绍

前言 lambda表达式是C11标准才支持的&#xff0c;有了它以后在一些地方进行使用会方便很多&#xff0c;尤其在一些需要仿函数的地方&#xff0c;lambda表达式完全可以替代它的功能。代码的可读性也会提高。 目录 1.lambda表达式 2.lambda表达式语法 3.函数对象和lambda表达…

2023年MySQL实战核心技术第二篇

目录 五 . 日志系统&#xff1a;一条SQL更新语句是如何执行的&#xff1f; 5.1 解释 5.2 重要的日志模块&#xff1a;redo log 5.2.1 解释 5.2.2 WAL&#xff08;Write-Ahead Logging&#xff09; 5.2.3 crash-safe。 5.3 重要的日志模块&#xff1a;binlog 5.3 .1 为什么会有…

元素周期表-背诵元素周期表更简单

元素周期表是一款极其炫酷、简约的记忆和查看周期表元素的软件。 【软件特点】&#xff1a; ●有趣谐音速记&#xff1a;软 件内有按周期、化合价、元素符号分类使用谐音速记的小技巧。 ●3D元素周期表&#xff1a;用户可以选择按表面、球体、螺旋、网格来3D炫酷的展示元素周期…

小白备战大厂算法笔试(三)——栈、队列、双向队列

文章目录 栈栈常用操作栈的实现基于链表的实现基于数组的实现 两种实现对比栈典型应用 队列队列常用操作队列实现基于链表的实现基于数组的实现 队列典型应用 双向队列双向队列常用操作双向队列实现基于双向链表的实现基于数组的实现 双向队列应用 栈 栈是一种遵循先入后出的逻…

MySQL之用户管理

用户 用户信息 MySQL中的用户&#xff0c;都存储在系统数据库mysql的user表中 ps&#xff1a; host&#xff1a; 表示这个用户可以从哪个主机登陆&#xff0c;如果是localhost&#xff0c;表示只能从本机登陆 user&#xff1a; 用户名 authentication_string&#xff1a; 用户…

【数据库事务日志碎片原理分析与方案】-分析篇

前言:说都数据库的事务日志&#xff0c;可以说我们是再熟悉不过的了。一般而言&#xff0c;我们都没有必 要去关心事务日志中的虚拟日志文件的个数。这里提到的“虚拟日志文件”的概念&#xff0c;我们 后面会进行专门的讲述。很多的时候&#xff0c;我们在建立数据库的时候&am…

使用Caffeine实现帖子的缓存来优化网站的运行速度

导入依赖 <!-- https://mvnrepository.com/artifact/com.github.ben-manes.caffeine/caffeine --><dependency><groupId>com.github.ben-manes.caffeine</groupId><artifactId>caffeine</artifactId><version>3.1.7</version>…

PyCharm下载安装

PyCharm下载链接 点击下载PyCharm Community Edition社区版&#xff08;PyCharm Professional专业版需要收费&#xff0c;但可以免费试用 30 天&#xff0c;也可以找到激活方式&#xff1b;而社区版是完全免费的&#xff0c;初学者学习 Python建议使用社区版&#xff0c;不会有…

Kafka的文件存储与稀疏索引机制

![在这里插入图片描述](https://img-blog.csdnimg.cn/dde7fc866d214985baaa87300a472578.png)这些是存储在分区(分区才是实际的存储)文件中的. seg是逻辑概念 而实际由log存储的. index是偏移量索引而timeindex是时间戳索引 log就是seg 找数据就是先找log 再从log去找

MYSQL 高级SQL语句

1、按关键字排序&#xff1a; order by 语句用来实现 &#xff0c;前面可以使用where字句使查询结果进一步过滤 asc 是按照升序排序 &#xff0c; 默认的 desc 是按照降序排序 order by的语法结构 例&#xff1a;select name,score from ku order by score desc; 表示将数…

数字图像处理-形态学图像处理

形态学图像处理 一、基础知识1.1 什么是形态学操作 二、腐蚀与膨胀2.1 腐蚀2.2 膨胀 三、开操作与闭操作3.1 开操作3.2 闭操作3.3 实验对比 四、一些基本的形态学算法4.1边界提取4.2空洞填充4.3 凸壳 一、基础知识 1.1 什么是形态学操作 数字图像处理中的形态学操作是一组用于…

链路追踪Skywalking快速入门

目录 1 Skywalking概述1.1 微服务系统监控三要素1.2 什么是链路追踪1.2.1 链路追踪1.2.2 OpenTracing1、数据模型&#xff1a;2、核心接口语义 1.3 常见APM系统1.4 Skywalking介绍1、SkyWalking 核心功能&#xff1a;2、SkyWalking 特点&#xff1a;3、Skywalking架构图&#x…

直播平台源码开发搭建APP的DASH协议:流媒体技术其中一环

在直播平台源码APP中&#xff0c;有着许许多多、多种多样的功能&#xff0c;比如短视频功能&#xff0c;帮助我们去获取信息&#xff0c;看到全世界用户身边发生的事情或是他们的生活&#xff1b;又比如直播功能&#xff0c;为用户提供了实时的娱乐享受&#xff0c;还让一些用户…

EVA: Visual Representation Fantasies from BAAI

本文做个简单总结&#xff0c;博主不是做自监督领域的&#xff0c;如果错误&#xff0c;欢迎指正。 链接 Code&#xff1a; Official&#xff1a;baaivision/EVA MMpretrain&#xff1a;open-mmlab/mmpretrain/tree/main/configs/eva02 Paper&#xff1a; EVA01&#xff1a;…

deepfm内容理解

对于CTR问题&#xff0c;被证明的最有效的提升任务表现的策略是特征组合(Feature Interaction)&#xff1b; 两个问题&#xff1a; 如何更好地学习特征组合&#xff0c;进而更加精确地描述数据的特点&#xff1b; 如何更高效的学习特征组合。 DNN局限 &#xff1a;当我们使…

vue-别名路径联想提示的配置

在根路径下&#xff0c;新建 jsconfig.json 文件&#xff0c;即可 在输入 自动联想到src目录。 代码如下&#xff1a; // 别名路径联想提示&#xff1a;输入自动联想 {"compilerOptions":{"baseUrl":"./","paths": {"/*":[…