Skip to content

H
hello uni-app x

DCloud / hello uni-app x

通知 5992
Star 90
Fork 162
H
hello uni-app x
提交 a89c0a18 编写于 作者: W wanganxp
浏览文件
操作

调整视觉不悦的颜色

上级 6c24d2b5
隐藏空白更改
内联 并排
Showing with 34 addition and 43 deletion
pages/CSS/box-shadow/box-shadow.uvue
浏览文件 @ a89c0a18
......@@ -2,141 +2,124 @@
<view style="flex-grow: 1;">
<view>
<text>box-shadow: 5px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="box-shadow: 5px 5px black;"></view>
</view>
</view>
<view>
<text>box-shadow: 5px 5px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="box-shadow: 5px 5px 5px black;"></view>
</view>
</view>
<view>
<text>box-shadow: 5px 10px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="box-shadow: 5px 10px 5px black;"></view>
</view>
</view>
<view>
<text>box-shadow: 5px 5px 5px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="box-shadow: 5px 5px 5px 5px black;"></view>
</view>
</view>
<view>
<text>box-shadow: -5px -5px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="box-shadow: -5px -5px 5px black;"></view>
</view>
</view>
<view>
<text>box-shadow: inset 5px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="box-shadow: inset 5px 5px black;"></view>
</view>
</view>
<view>
<text>box-shadow: inset 5px 5px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="box-shadow: inset 5px 5px 5px black;"></view>
</view>
</view>
<view>
<text>box-shadow: inset 5px 10px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="box-shadow: inset 5px 10px 5px black;"></view>
</view>
</view>
<view>
<text>box-shadow: inset 5px 5px 5px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="box-shadow: inset 5px 5px 5px 5px black;"></view>
</view>
</view>
<view>
<text>box-shadow: inset -5px -5px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="box-shadow: inset -5px -5px 5px black;"></view>
</view>
</view>
<view>
<text>box-shadow: 0px 1px 3px rgba(0,0,0,0.4)</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="box-shadow: 0px 1px 3px rgba(0,0,0,0.4);"></view>
</view>
</view>
<view>
<text>circle: box-shadow: 5px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="border-radius: 125rpx;box-shadow: 5px 5px black"></view>
</view>
</view>
<view>
<text>circle: box-shadow: 5px 5px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="border-radius: 125rpx;box-shadow: 5px 5px 5px black;"></view>
</view>
</view>
<view>
<text>circle: box-shadow: 5px 10px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="border-radius: 125rpx;box-shadow: 5px 10px 5px black;"></view>
</view>
</view>
<view>
<text>circle: box-shadow: 5px 5px 5px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="border-radius: 125rpx;box-shadow: 5px 5px 5px 5px black;"></view>
</view>
</view>
<view>
<text>circle: box-shadow: -5px -5px 5px black</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="border-radius: 125rpx;box-shadow: -5px -5px 5px black;"></view>
</view>
</view>
<view>
<text>circle: box-shadow: 0px 1px 3px rgba(0,0,0,0.4)</text>
<view
style="width: 500rpx;height: 500rpx;background-color: gray;justify-content: center;align-items: center;">
<view class="backgroundview">
<view class="common" style="border-radius: 125rpx;box-shadow: 0px 1px 3px rgba(0,0,0,0.4);"></view>
</view>
</view>
</view>
</template>
......@@ -148,6 +131,14 @@
.common {
width: 250rpx;
height: 250rpx;
background-color: red;
background-color: brown;
}
.backgroundview {
width: 500rpx;
height: 500rpx;
background-color: white;
justify-content: center;
align-items: center;
}
</style>
\ No newline at end of file
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或