带阴影的组件与rich-text里的图片层级有bug #64
Comments
|
CSS 的样式及元素的排版规范如此，HTML 中同样如此。 以下是测试代码 <template>
<view class="content">
<view class="shadow">
这是有阴影的节点
</view>
<rich-text :nodes="nodes"></rich-text>
</view>
</template>
<script>
export default {
data() {
return {
title: 'rich-text',
nodes: [{
name: 'div',
attrs: {
class: 'div-class',
style: 'line-height: 60px; color: red;text-align:center;'
},
children: [{
type: 'text',
text: 'Hello uni-app!'
}, {
name: 'img',
attrs: {
src: 'https://img-cdn-qiniu.dcloud.net.cn/uniapp/images/uni@2x.png'
}
}]
}]
}
}
}
</script>
<style>
.shadow {
box-shadow: 10px 10px 5px #888888;
}
.div-class {
margin-top: 10px;
}
</style>普通的 HTML <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>test</title>
<style type="text/css">
.shadow {
box-shadow: 10px 10px 5px #888888;
}
</style>
</head>
<body>
<div class="shadow">这是有阴影的节点</div>
<div>
<img src="https://img-cdn-qiniu.dcloud.net.cn/uniapp/images/uni@2x.png">
</div>
</body>
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
兄弟层级，当上一元素带有阴影，下一元素为rich-text时。rich-text里的图片的层级比阴影高，会显示在阴影上方。
The text was updated successfully, but these errors were encountered: