uni-app学习之旅view

图片取自uniapp官方文档https://uniapp.dcloud.io/component/view

detail.vue
<template>
	<view>
<!-- 		<view>
			<text>无敌季卡拉诺在学习</text>
		</view>
		<view>
			<text selectable>无敌季卡拉诺在学习</text>//selectable长按可选
		</view>
		<view>
			<text selectable space="ensp">无敌季 卡拉诺在学习</text>//空格所占大小 space
		</view> -->
		<view class="box2" hover-class="box2-active">
			<view class="box" hover-class="box-active" hover-stop-propagation :hover-stay-time="2000">我是无敌季卡拉诺</view><!-- //hover-class按下去的样式hover-stop-propagation停止冒泡,:可以"取数字" -->
		</view>
	</view>

</template>

<script>
</script>

<style>
	.box{
		width: 100px;
		height: 100px;
		background: #4CD964;
	}
	.box-active{
		
		background:#007AFF;
	}
	.box2{
		width: 200px;
		height: 200px;
		background: #F0AD4E;
	}
	.box2-active{
		width: 200px;
		height: 200px;
		background:#3F536E;
	}
</style>

效果展示