内容简介:做一个商品的详情页,需要输出富文本的内容,需要设置里面的图片样式最大宽度100%。可是设置img 100%后没反应,看F12检查元素也没加上去。解决方法有2个:1、scoped属性导致css仅对当前组件生效(用css3的属性选择器+生成的随机属性实现的),而html绑定渲染出的内容可以理解为是子组件的内容,子组件不会被加上对应的属性,所以不会应用css.解决的话把scoped属性去掉就行了。
做一个商品的详情页,需要输出富文本的内容,需要设置里面的图片样式最大宽度100%。可是设置img 100%后没反应,看F12检查元素也没加上去。
解决方法有2个:
1、scoped属性导致css仅对当前组件生效(用css3的属性选择器+生成的随机属性实现的),而html绑定渲染出的内容可以理解为是子组件的内容,子组件不会被加上对应的属性,所以不会应用css.解决的话把scoped属性去掉就行了。
2、另外一种常用的方法利用vue的深度作用选择器。要为v-html渲染出中的标签添加CSS样式,我们需要在写样式的时候添加>>>就可以搞定了,如下:
.desc-detail .desc-view >>> img{
display: block;
max-width: 100%;
}
如果使用方法2,是不能用less或者scss,需要使用css语法,否则会报错
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网
猜你喜欢:- @Transactional事务生效问题
- UI抗锯齿不生效原因
- properties文件改变不生效的问题
- View.requestLayout() 不生效的问题
- C# Redis 过期机制不生效问题
- DrawMeshInstanced在Unity2018上不生效
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
电脑报(上下册)
电脑报社 / 西南师范大学出版社 / 2006-12-01 / 45.00元
全套上、下两册,浓缩2006年电脑报精华文章。附录包含70余篇简明IT应用指南,覆盖软件、硬盘、数码、网络四大领域。配赠权威实用的2006-2007中国计算机年鉴DVD光盘,近1.4GB海量信息与资源超值奉献。8大正版超值软件,涵盖系统维护、系统安全、办公应用、多媒体娱乐等四大领域。微软、腾讯、友立等知名厂商,新年献礼。提供2006-2007全系列硬件、数码产品资讯,兼具知识性与资料性。官方网站全......一起来看看 《电脑报(上下册)》 这本书的介绍吧!