【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>