热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

css样式boxshadow属性

描述:就是把一个或多个阴影添加在边框上语法:box-shaadow:h-shadowv-shadowblurspreadcolorinset 前面两个是必须的,后面几个可选下面我根

描述:就是把一个或多个阴影添加在边框上

语法:box-shaadow:h-shadow v-shadow blur spread color inset 

前面两个是必须的,后面几个可选

下面我根据控制变量讲解box-shadow里面属性是什么意思,怎么展示应用的

h-shadow (水平阴影位置) 默认是黑色,这个属性意思是往右边移动像素距离 

有负值的,负值代表往左侧移动

 

 v-shadow(垂直阴影位置)这个属性表示往上或者往下移动像素距离

有负值的,负值代表往上移动像素

 

 blur 模糊距离   表示边界发散的模糊距离    没有负值

 

 spread  阴影大小  表示原图形四周同时往外或者里扩大或缩小的像素值。

负值表示往内收缩的像素

 

 color表示阴影颜色

 

 inset  表示内测阴影  表示阴影从盒子内测出现,

里面的水平阴影正值表示阴影从左边开始显示

里面的水平阴影负值表示阴影从右边开始显示

里面的垂直阴影正值表示阴影从上部边开始显示

里面的垂直阴影负值表示阴影从下边开始显示

 

  同一个盒子做多个阴影用逗号分开

我会在案例中展示这个功能。

 

本期案例分享:

 

 

 



推荐阅读
  • 如何撰写初级和高级前端开发者的专业简历
    如何撰写初级和高级前端开发者的专业简历 ... [详细]
  • 使用Maven JAR插件将单个或多个文件及其依赖项合并为一个可引用的JAR包
    本文介绍了如何利用Maven中的maven-assembly-plugin插件将单个或多个Java文件及其依赖项打包成一个可引用的JAR文件。首先,需要创建一个新的Maven项目,并将待打包的Java文件复制到该项目中。通过配置maven-assembly-plugin,可以实现将所有文件及其依赖项合并为一个独立的JAR包,方便在其他项目中引用和使用。此外,该方法还支持自定义装配描述符,以满足不同场景下的需求。 ... [详细]
  • 成都服务器租赁适用于哪些网站业务部署——Vecloud专业解析
    成都,作为四川省的省会,不仅是西南地区唯一的副省级城市,也是国家重要的高新技术产业基地和商贸物流中心。Vecloud专业解析指出,成都服务器租赁服务特别适合各类网站业务的部署,尤其是需要高效、稳定和安全的在线应用。无论是电子商务平台、内容管理系统还是大数据分析,成都的服务器租赁都能提供强大的支持,满足不同企业的需求。 ... [详细]
  • 该问题可能由守护进程配置不当引起,例如未识别的JVM选项或内存分配不足。建议检查并调整JVM参数,确保为对象堆预留足够的内存空间(至少1572864KB)。此外,还可以优化应用程序的内存使用,减少不必要的内存消耗。 ... [详细]
  • 通过利用代码自动生成技术,旨在减轻软件开发的复杂性,缩短项目周期,减少冗余代码的编写,从而显著提升开发效率。该方法不仅能够降低开发人员的工作强度,还能确保代码的一致性和质量。 ... [详细]
  • 触发器的稳态数量分析及其应用价值
    本文对数据库中的SQL触发器进行了稳态数量的详细分析,探讨了其在实际应用中的重要价值。通过研究触发器在不同场景下的表现,揭示了其在数据完整性和业务逻辑自动化方面的关键作用。此外,还介绍了如何在Ubuntu 22.04环境下配置和使用触发器,以及在Tomcat和SQLite等平台上的具体实现方法。 ... [详细]
  • 如何在您的计算机上配置Python和PyCharm开发环境
    本文详细介绍了在Windows 10系统上配置Python和PyCharm开发环境的步骤。内容包括Python的安装与卸载、PyCharm的安装与卸载,以及如何在Windows 10中通过双击安装文件“python-3.7.2-amd64.exe”来完成Python的安装。此外,还提供了关于环境变量配置和基本设置的实用建议,帮助用户快速搭建高效的开发环境。 ... [详细]
  • Java排序算法详解:选择排序、插入排序、冒泡排序与递归实现
    本文详细解析了Java中的几种基础排序算法,包括选择排序、插入排序和冒泡排序,并探讨了递归在这些算法中的应用。选择排序通过每次找到未排序部分的最小值并将其置于已排序部分的末尾来实现;插入排序则通过逐步将每个元素插入到已排序序列的正确位置;而冒泡排序则是通过多次遍历数组,两两比较并交换相邻的元素,最终使较大的元素逐渐“冒”到数组末尾。文章还提供了具体的代码示例,帮助读者更好地理解和掌握这些算法的实现细节。 ... [详细]
  • 斯坦福大学公开课:利用神经网络技术实现自动驾驶的案例分析
    斯坦福大学的公开课深入探讨了如何利用神经网络技术实现自动驾驶。课程中通过实例展示了汽车如何通过学习算法自主驾驶。具体而言,课程展示了一幅图解,其中左下角显示了汽车前方的实时路况图像,而左上角则呈现了一个水平的菜单栏,用于展示系统处理和决策的过程。这一案例详细解析了神经网络在自动驾驶中的应用,为学生提供了宝贵的实践参考。 ... [详细]
  • 如何在Windows 10中彻底禁用用户账户控制弹窗
    如何在Windows 10中彻底禁用用户账户控制弹窗 ... [详细]
  • 林沁:首次合作任务解析与实践
    本次作业旨在解析与实践首次合作任务,涉及课程为福州职业技术学院的《软件工程实践》。通过具体案例分析,探讨团队协作中的关键要素与实施策略,提升学生在实际项目中的合作能力。 ... [详细]
  • 题目链接:https://www.luogu.com.cn/problem/P6453在解决 COCI 2008-2009 第四轮 PERIODNI 问题时,我们需要逐行分析。由于一行中的字符若被断开则不再视为同一行,因此每行的最大矩形区域需要单独计算。通过这种方法,可以确保每层都能找到其最大连续子矩形,从而有效解决问题。 ... [详细]
  • 在深入研究 UniApp 封装请求时,发现其请求 API 方法中使用了 `then` 和 `catch` 函数。通过详细分析,了解到这些函数是 Promise 对象的核心组成部分。Promise 是一种用于处理异步操作的结果的标准化方式,它提供了一种更清晰、更可控的方法来管理复杂的异步流程。本文将详细介绍 Promise 的基本概念、结构和常见应用场景,帮助开发者更好地理解和使用这一强大的工具。 ... [详细]
  • 在C#开发中,实现UserControls之间高效传递CheckBox值是一个常见的需求。本文详细介绍了如何通过事件和委托机制,将UserControl3中的CheckBox值传递到UserControl1中,确保数据传递的准确性和实时性。此外,还提供了代码示例和最佳实践,帮助开发者更好地理解和应用这一技术。 ... [详细]
  • 观察 | 求职体验:收到录用通知的公司通常不深究技术细节,而那些详细追问的公司往往没有后续进展
    观察 | 求职体验:收到录用通知的公司通常不深究技术细节,而那些详细追问的公司往往没有后续进展 ... [详细]
author-avatar
mobiledu2502908197
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有