css clip-path裁剪 边框颜色问题设置

news2024/11/8 16:44:12

使用clip-path 对于div样式裁剪 原有的border样式 会被裁掉 遇到相同父级的背景颜色 会导致裁剪部分边界显示视觉错乱

.mySection.common-layout{
  width: 100%;
  height: 100%;
  background: #c7d6f7;
  clip-path: polygon()!important;
  border: 1px solid #c7d6f7;
  &::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    clip-path: inherit;
    background: #fff;
    z-index: -1;
  }
}

添加伪元素进行背景覆盖 这样裁剪边角颜色 会被背景颜色覆盖

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

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

相关文章

STM32G0xx使用LL库将Flash页分块方式存储数据实现一次擦除可多次写入

STM32G0xx使用LL库将Flash页分块方式存储数据实现一次擦除可多次写入 参考例程例程说明一、存储到Flash中的数据二、Flash最底层操作(解锁,加锁,擦除,读写)三、从Flash块中读取数据五、测试验证 参考例程 STM32G0xx HAL和LL库Flash读写擦除操…

若依管理系统使用已有 Nacos 部署流程整理

背景 玩了一下开源项目 RuoYi 管理系统Cloud 版,卡住的地方是:它用到了 nacos 配置管理,如果用的 nacos 环境是单机且是内置数据库的话,该怎么配置呢? 本文整理本机启动 RuoYi Cloud 应用本地部署的过程,…

快速学习Python框架FastAPI

FastAPI是一种现代、快速(高性能)的Web框架,用于Python 3.6,使用Python类型提示构建API。它的设计初衷是帮助开发者在短时间内开发出高性能的API服务。FastAPI的灵感来源于许多高性能的编程框架,包括Express、Django R…

scala Map集合

一.Map的概述 Map是一种存储键值对的数据结构,Map中的键都是唯一的。 idea实例 二.Map的常见操作 idea实例 三.Map中的查询元素 idea实例 四.Map的常用方法 idea实例 五.Map的遍历 idea实例

Zabbix监控架构

目录 1. Zabbix监控架构-CS架构 2. Zabbix极速上手指南 主机规划 2.1 部署ngxphp环境并测试 检查安装结果 2.2 部署数据库 2.3 编译安装zabbix-server服务端及后续配置 2.4 部署前端代码代码进行访问 前端的配置文件(连接数据库与主机名等信息) 2.5 欢迎来到zabbix 2…

基于vue+neo4j 的中药方剂知识图谱可视化系统

前言 历时一周时间,中药大数据R02系统中药开发完毕,该系统通过scrapy工程获取中药数据,使用python pandas预处理数据生成知识图谱和其他相关数据,利用vuespringbootneo4jmysql 开发系统,具体功能请看本文介绍。 简要…

Java——》try-with-resource

推荐链接: 总结——》【Java】 总结——》【Mysql】 总结——》【Redis】 总结——》【Kafka】 总结——》【Spring】 总结——》【SpringBoot】 总结——》【MyBatis、MyBatis-Plus】 总结——》【Linux】 总结——》【MongoD…

数据结构---二叉树(顺序结构),堆(上)

树 树的概念与结构 树是⼀种⾮线性的数据结构,它是由 n(n>0) 个有限结点组成⼀个具有层次关系的集合。把它叫做树是因为它看起来像⼀棵倒挂的树,也就是说它是根朝上,⽽叶朝下的。 PS 有⼀个特殊的结点&#xff…

蓝桥杯-网络安全比赛题目-遗漏的压缩包

小蓝同学给你发来了他自己开发的网站链接, 他说他故意留下了一个压缩包文件,里面有网站的源代码, 他想考验一下你的网络安全技能。 (点击“下发赛题”后,你将得到一个http链接。如果该链接自动跳转到https,…

HTB:Busqueda[WriteUP]

目录 连接至HTB服务器并启动靶机 使用nmap对靶机进行开放端口扫描 使用ffuf对该域名进行路径FUZZ 直接使用浏览器访问靶机80端口主页面 直接到Github上寻找相关PoC、EXP USER_FLAG:0f2686aebbdb4c728050281a6fb742cf 特权提升 ROOT_FLAG:dde68ef…

如何创建备份设备以简化 SQL Server 备份过程?

SQL Server 中的备份设备是什么? 在 SQL Server 中,备份设备是用于存储备份数据的物理或逻辑介质。备份设备可以是文件、设备或其他存储介质。主要类型包括: 文件备份设备:通常是本地文件系统中的一个或多个文件。可以是 .bak 文…

c语言-8进制的表示方法

文章目录 一、8进制二、输出格式三、范围限制四、八进制的负数五、程序 一、8进制 在C语言中,表示8进制数需要使用前缀数字0,而不是通常的o或者0x. 8进制数以数字0作为前缀,后面跟着一串八进制数字(0-7)组成&#xf…

python操作MySQL以及SQL综合案例

1.基础使用 学习目标:掌握python执行SQL语句操作MySQL数据库软件 打开cmd下载安装 安装成功 connection就是一个类,conn类对象。 因为位置不知道,所以使用关键字传参。 表明我们可以正常连接到MySQL 演示、执行非查询性质的SQL语句 pytho…

【含开题报告+文档+源码】基于SSM的物流管理系统设计与实现

开题报告 随着电子商务的迅猛发展和人们生活水平的提高,快递服务行业正经历着前所未有的增长。占航快递公司作为国内知名的快递企业之一,面临着巨大的机遇和挑战。传统的快递服务管理方式已经无法满足日益增长的业务需求,快递服务流程中的问…

外包干了2年,快要废了。。。

先说一下自己的情况,普通本科毕业,在外包干了2年多的功能测试,这几年因为大环境不好,我整个人心惊胆战的,怕自己卷铺盖走人了,我感觉自己不能够在这样蹉跎下去了,长时间呆在一个舒适的环境真的会…

界面控件DevExpress WPF中文教程:Data Grid——卡片视图设置

DevExpress WPF拥有120个控件和库,将帮助您交付满足甚至超出企业需求的高性能业务应用程序。通过DevExpress WPF能创建有着强大互动功能的XAML基础应用程序,这些应用程序专注于当代客户的需求和构建未来新一代支持触摸的解决方案。 无论是Office办公软件…

使用Matlab神经网络工具箱

综述 在大数据和人工智能时代,深度学习是一种最为常见的数据分析和拟合工具。本报告以常用分析软件Matlab为例,介绍如何通过编写代码实现一个简单的CNN卷积神经网络。 Step 1: 打开matlab,新建脚本 1、安装matlab 2018以上版本后&#xff…

【系统设计——认证授权——基本概念知识】

1. 认证和授权的区别 Authentication(认证) 是验证您的身份的凭据(例如用户名/用户 ID 和密码),通过这个凭据,系统得以知道你就是你,也就是说系统存在你这个用户。所以,Authenticat…

区块链技术入门:以太坊智能合约详解

💓 博客主页:瑕疵的CSDN主页 📝 Gitee主页:瑕疵的gitee主页 ⏩ 文章专栏:《热点资讯》 区块链技术入门:以太坊智能合约详解 区块链技术入门:以太坊智能合约详解 区块链技术入门:以太…

【Spring】更加简单的将对象存入Spring中并使用

前言 本期讲解:通过Controller、Service、Repository、Component、Configurtion类注解、Bean方法注解,来更加简单的在Spring中存与读对象。 目录 1. 类注解 1.1 通过标签 1.2 使用类注解 1.3 什么是类注解 1.4 获取Bean对象命名问题 2. 方法注解 …