【css】overflow: hidden效果

1. 不添加overflow: hidden

1.1 效果

  • 上面无圆角
    在这里插入图片描述

1.2 代码

<template>
	<view class="parent">
		<view class="child1">
			child1
		</view>
		
		<view class="child2">
			child2
		</view>
	</view>
	
</template>

<style lang="scss">	
	.parent{
		background-color: red;
		// overflow: hidden; 	//不添加
		border-radius: 15rpx;
		
		.child1{
			width: 100%;
			height: 60rpx;
			background-color: green;
		}
		
		.child2{
			width: 100%;
			height: 60rpx;
		}
		
	}
</style>

2. 添加overflow: hidden

2.1 效果

在这里插入图片描述

2.2 代码

<template>
	<view class="parent">
		<view class="child1">
			child1
		</view>
		
		<view class="child2">
			child2
		</view>
	</view>
	
</template>

<style lang="scss">	
	.parent{
		background-color: red;
		overflow: hidden;	//添加
		border-radius: 15rpx;
		
		.child1{
			width: 100%;
			height: 60rpx;
			background-color: green;
		}
		
		.child2{
			width: 100%;
			height: 60rpx;
		}
		
	}
</style>

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

VB6.0桌面小程序(桌面音乐播放器)

干货源码 Imports System.IO Imports System.Security.Cryptography Public Class Form1 Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load Button1.Text “上一曲” Button4.Text “播放” Button3.Text “下一曲” Button2.Text “顺序播…

Android MVVM demo(使用DataBinding,LiveData,Fresco,RecyclerView,Room,ViewModel 完成)

使用DataBinding&#xff0c;LiveData&#xff0c;Fresco&#xff0c;RecyclerView&#xff0c;Room&#xff0c;ViewModel 完成 玩Android 开放API-玩Android - wanandroid.com 接口使用的是下面的两个&#xff1a; https://www.wanandroid.com/banner/jsonhttps://www.wan…

协程4 --- 一个特殊的栈溢出例子

文章目录 代码运行结果分析 代码 先看下面这个程序流程&#xff1a; 有个长度位24的字符数组buffer&#xff0c;前面16个字符初始化。 把attack函数的地址复制到后面8个字符&#xff08;编译成64位程序&#xff0c;指针大小为8Byte&#xff09;。 打印信息&#xff1a;do Some…

day01 - web开发简介

本课程涉及到的技术&#xff1a; Vue ElementUI/Html Js SpringBoot–Spring SpringMvc MyBatis(Plus) SSM Axios 学习路径&#xff1a; 前端主要&#xff1a; Html5css3JavaScript(JQuery)–>Vue(Node.js也可以学习一 下&#xff0c;服务端js)ElementUi(uni-app) 后端主要…

简单又便宜的实现电脑远程开机唤醒方法

现有的远程开机方案 1&#xff09;使用向日葵开机棒 缺点是比较贵一点&#xff0c;开机棒要一百多&#xff0c;而且查了评论发现挺多差评说不稳定&#xff0c;会有断联和无法唤醒的情况&#xff0c;而且设置也麻烦&#xff0c;还需要网卡支持WOL 2&#xff09;使用远程开机卡 …

自攻螺钉的世纪演变:探索关键设计与应用

自攻螺钉作为现代工业和建筑中的不可或缺的标准部件&#xff0c;经过了超过100年的发展和创新。从1914年最早的铁螺钉设计到今天的自钻自攻螺钉&#xff0c;自攻螺钉的设计不断优化&#xff0c;以适应更复杂的应用需求。本文将回顾自攻螺钉的演变历程&#xff0c;分析其设计原理…

[复健计划][紫书]Chapter 7 暴力求解法

7.1 简单枚举 例7-1 Division uva725 输入正整数n&#xff0c;按从小到大的顺序输出所有形如abcde/fghij n的表达式&#xff0c;其中a&#xff5e;j恰好为数字0&#xff5e;9的一个排列&#xff08;可以有前导0&#xff09;&#xff0c;2≤n≤79。枚举fghij&#xff0c;验证a…

OpenBayes 一周速览丨Ministral-8B革新侧端AI新体验!PsyDTCorpus心理咨询数据集上线,含5k个数字孪生对话数据

公共资源速递 This Weekly Snapshots &#xff01; 5 个数据集&#xff1a; * Labelme 图像标注数据集 * TIMIT 英语方言录音数据集 * Food-101 食品图像数据集 * SVHN 真实世界图像数据集 * PsyDTCorpus 心理咨询师数字孪生数据集 1 个模型&#xff1a; * Allegro 3…

如何修改网络ip地址:一步步指南‌

在当今这个数字化时代&#xff0c;网络已成为我们日常生活与工作中不可或缺的一部分。无论是浏览网页、在线办公还是享受流媒体服务&#xff0c;稳定的网络连接和适当的IP地址管理都是确保良好体验的关键。然而&#xff0c;出于隐私保护、绕过地理限制或测试网络环境等需要&…

论 ONLYOFFICE:开源办公套件的深度探索

公主请阅 引言第一部分&#xff1a;ONLYOFFICE 的历史背景1.1 开源软件的崛起1.2 ONLYOFFICE 的发展历程 第二部分&#xff1a;ONLYOFFICE 的核心功能2.1 文档处理2.2 电子表格2.3 演示文稿 第三部分&#xff1a;技术架构与兼容性3.1 技术架构3.2 兼容性 第四部分&#xff1a;部…

如何将现有VUE项目所有包更新到最新稳定版

更新有风险,Enter要谨慎!!! 要将项目中的所有 npm 包更新到最新稳定版&#xff0c;可以使用 npm-check-updates 工具。以下是具体步骤&#xff1a; 步骤一&#xff1a;安装 npm-check-updates 首先&#xff0c;全局安装 npm-check-updates 工具&#xff1a; npm install -g…

高德 阿里231滑块 分析

声明: 本文章中所有内容仅供学习交流使用&#xff0c;不用于其他任何目的&#xff0c;抓包内容、敏感网址、数据接口等均已做脱敏处理&#xff0c;严禁用于商业用途和非法用途&#xff0c;否则由此产生的一切后果均与作者无关&#xff01; 有相关问题请第一时间头像私信联系我删…

特征检测与特征匹配方法笔记+代码分享

在一幅图像中&#xff0c;总能发现其独特的像素点&#xff0c;这些点可以被视为该图像的特征&#xff0c;我们称之为特征点。在计算机视觉领域中&#xff0c;基于特征点的图像特征匹配是一项至关重要的任务&#xff0c;因此&#xff0c;如何定义并识别一幅图像中的特征点显得尤…

【陕西】《陕西省省级政务信息化项目投资编制指南(建设类)(试行)》-省市费用标准解读系列07

《陕西省省级政务信息化项目投资编制指南&#xff08;建设类&#xff09;&#xff08;试行&#xff09;》规定了建设类项目的费用投资测算方法与计价标准&#xff0c;明确指出建设类项目费用包括项目建设费和项目建设其他费&#xff08;了解更多可直接关注咨询我们&#xff09;…

无人机干扰与抗干扰,无人机与反制设备的矛与盾

无人机干扰与抗干扰&#xff0c;以及无人机与反制设备之间的关系&#xff0c;可以形象地比喻为矛与盾的较量。以下是对这两方面的详细探讨&#xff1a; 一、无人机干扰与抗干扰 1. 无人机干扰技术 无人机干扰技术是指通过各种手段对无人机系统进行干扰&#xff0c;使其失去正…

Github配置ssh key原理及操作步骤

文章目录 配置SSH第一步&#xff1a;检查本地主机是否已经存在ssh key第二步&#xff1a;生成ssh key第三步&#xff1a;获取ssh key公钥内容第四步&#xff1a;Github账号上添加公钥第五步&#xff1a;验证是否设置成功验证原理 往github上push项目的时候&#xff0c;如果走ht…

MySQL日期类型选择建议

我们平时开发中不可避免的就是要存储时间&#xff0c;比如我们要记录操作表中这条记录的时间、记录转账的交易时间、记录出发时间、用户下单时间等等。你会发现时间这个东西与我们开发的联系还是非常紧密的&#xff0c;用的好与不好会给我们的业务甚至功能带来很大的影响。所以…

【Ant.designpro】上传图片

文章目录 一、前端二、后端 一、前端 fieldProps:可以监听并且获取到组件输入的内容 action{“/api/upload_image”} 直接调用后端接口 <ProFormUploadButtonlabel{"上传手续图片"}name{"imgs"}action{"/api/upload_image"}max{5} fieldPro…

vue3 基于element-plus进行的一个可拖动改变导航与内容区域大小的简单方法

1、先上个截图&#xff1a; 说明&#xff1a;拖动上面的分隔栏就可以实现&#xff0c;改变左右区域的大小。 2、上面的例子来自官网的&#xff1a; Container 布局容器 | Element Plus 3、拖动的效果来自&#xff1a; https://juejin.cn/post/7029640316999172104#heading-1…

Android Studio加载旧的安卓工程项目报错处理

文章目录 Invalid Gradle JDK configuration foundNDK not configuredCMake 3.10.2 was not found安装cmake适配cmake版本号 com.intellij.openapi.externalSystem.model.ExternalSystemExceptiongradle版本过低或下载不了下载gradle与依赖库超时替换gradle国内源替换Maven 仓库…