vue style 绑定,vue 动态设置style

　　这篇文章主要介绍了某视频剪辑软件中的风格样式如何动态绑定，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教

style样式如何动态绑定

　　方法一：(1) html中：

　　div class= video ma ref= video ma style= width:100%；高度：100%;

　　div id= play wnd class= play wnd :style= { width:video box。宽度 px ，高度：视频框。高度像素 } /格

　　/div

　　(2)数据中：

　　视频盒：{

　　宽度：800,

　　身高：500,

　　}

　　(3)已安装中：

　　已安装(){

　　this.videoBox.width=this .$参考文献。视频ma。offsetwidth

　　这. video box . height=这.$参考文献。视频马。偏高；

　　}

　　凡是有-的风格属性名都要变成驼峰式，比如字体大小要变成字体大小

　　除了绑定值，其他的属性名的值要用引号括起来，比如backgroundColor:#00a2ff 而不是backgroundColor:#00a2ff

　　对象html:style= { color:active color，fontSize: fontSize px }

　　html:style= { display:(activeName== first ？flex:none)}

　　数组html:style=[基本样式，覆盖样式]

　　html:style=[{ display:(activeName== first ？flex:none)}，{fontSize:20px}]

　　三目运算符html:style= { color:(index==0？conFontColor:#ddd)}

　　html :style=[{color:(index==0？ conFontColor:#ddd)}，{fontSize:22px}]

　　多重值html:style= { display:[-WebKit-box ，-ms-flexbox ， flex] }

　　以上为个人经验，希望能给大家一个参考，也希望大家多多支持我们。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。