项目中,使用V-html渲染的页面,要添加样式,改如何做

解决方案1:在updated生命周期函数中,js动态配置样式,代码如下:

 updated() {
$('.msgHtmlBox').find('p').css('color', 'blue');
},

解决方案2:去掉style标签中的scoped属性(我用的这种)

scoped属性导致css仅对当前组件生效(用css3的属性选择器+生成的随机属性实现的),而html绑定渲染出的内容可以理解为是子组件的内容,子组件不会被加上对应的属性,所以不会应用css.

解决方案3:写样式的时候添加>>> (这种打包的时候会报错)

 <style scoped>
.msgHtmlBox >>> p{
color: blue;
}
</style>

v-html里面添加样式的更多相关文章

  1. [转]用CSS给SVG <use>的内容添加样式

    来源:http://www.w3cplus.com/svg/styling-svg-use-content-css.html?utm_source=tuicool&utm_medium=ref ...

  2. 为html.EditorFor添加样式

    有网友问及,怎样为html.EditorFor添加样式. 解决方法,可以参考下面语法: 先new一个htmlAttributes. @model Book @using Insus.NET.Model ...

  3. JQuery为元素添加样式

    由于jquery支持css3,所有能很好的兼容很多浏览器,所以通过jquery来使用css样式比较好 为定义好的css样式可以调用元素的css方法添加样式 $("span").cs ...

  4. JavaScript 应用开发 #5:为完成的任务添加样式

    判断一下任务的状态,如果是完成的任务,可以在任务项目的上面,添加一个额外的 css 类,在这个 css 类里,可以去定义完成的任务的样式.比如,把文字的颜色变成浅友色,并且在文字上面添加一条删除线.这 ...

  5. HTML添加样式三种办法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. Javascrip动态添加样式,Dom操作,获取自定义属性

    var layer=document.querySelector('.layer') 添加样式: 添加单个样式: layer.style.display="block" 添加多个样 ...

  7. 原生js移除或添加样式

    样式效果如下,点击商品详情 添加样式active 代码 <!doctype html> <html lang="en"> <head> < ...

  8. React使用Styled-Componets来添加样式

    React使用Styled-Componets来添加样式 Styled-Comonents是用JS中ES6 语法的方式来管理CSS样式的一个组件,解决了在import CSS文件时样式重复 安装 项目 ...

  9. 原生js动态添加style,添加样式

    原生js动态添加style,添加样式 第一种 var style="[assign-url='"+str+"']{display:initial}"; var ...

随机推荐

  1. 最棒的 JavaScript 学习指南(2018版)

    译者注:原文作者研究了近2.4万篇 JavaScript 文章得出这篇总结,全文包含学习指南.新人上手.Webpack.性能.基础概念.函数式编程.面试.教程案例.Async Await.并发.V8. ...

  2. Unet网络

    近期利用遥感影像进行路网提取,利用Unet网络进行图像分割 介绍如下: U-net网络非常简单,前半部分作用是特征提取,后半部分是上采样.在一些文献中也把这样的结构叫做编码器-解码器结构.由于此网络整 ...

  3. linux 删除占用文件

    清空 程序占用日志文件: cat /dev/null > log 或: echo " " > log 直接删除程序占用文件大小不生效: rm -rf log ps -e ...

  4. Shiro入门 - 通过ini文件进行认证

    导入依赖 <dependency> <groupId>org.apache.shiro</groupId> <artifactId>shiro-core ...

  5. react踩坑记录——使用fetch获取json数据报错

    报错: 原因其实是list.json文件路径错误,该文件路径是相对于index.html的,而不是App.js或者index.js.

  6. js对象遍历输出顺序错乱的问题

    一.js对象遍历顺序错乱的原因 下边就来实践一下: var obj={'3':'ccc',name:'abc',age:23,school:'sdfds',class:'dfd',hobby:'dsf ...

  7. MySql cmd下的学习笔记 —— 有关分组的操作(group by)

    (一) 把建立的goods表找到 (二) 当cat_id = 3时,计算所有商品的库存量之和 计算每个cat_id下的库存量(group by) 需要用到分组,把每个红框内的计算在一起 筛选出本店价比 ...

  8. 2017 ACM/ICPC(北京)总结

    这个季节的,北京真的很冷. 下午的热身赛,我依然先去敲一道搜索题,但是很不幸这道搜索题坑点还是蛮多的,浪费了好长时间后依然没能A掉,期间Codeblocks崩溃一次使得代码完全丢失,在队友的建议下便暂 ...

  9. 极客时间|AI技术内参

    学习进度: 014 | 精读AlphaGo Zero论文

  10. MySql常见命令、函数

    ⒈常见命令 命令 说明 show databases; 显示数据库列表 use DataBaseName; 打开指定的数据库 show tables; 显示当前打开数据库的表列表 show table ...