vue---class和style的基本用法
不多BB了 直接上代码了 通俗移动易懂总结了5种常用改变样式 的形式
<style>
.actived2{
color:red;
}
</style>
</head>
<body>
<div class="app">
<div :style="actived">aaa</div>
<div :style="[actived]">aaa</div>
<div :style="{color:'red'}">aaa</div> <div :class="['actived2']">aaa</div>
<div :class="{actived2:isActived}">aaa</div> </div>
</body>
<script>
const app = new Vue({
el:'.app',
data:{
actived:{
color:"red"
},
isActived:true
}
})
</script>
vue---class和style的基本用法的更多相关文章
- Vue基础01vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令
自学vue框架,每天记录重要的知识点,与大家分享!有不足之处,希望大家指正. 本篇将讲述:vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令 前期学习基础,使用vue. ...
- vue class与style绑定、条件渲染、列表渲染
列表渲染 根据我例子的需要,先来说下,列表渲染使用到的是v-for指令,需要使用 item in items 形式的特殊语法,items 是源数据数组并且 item 是数组元素迭代的别名,具体使用方法 ...
- 跨平台移动开发 Xuijs超轻量级的框架Style CSS属性用法
PhoneGap里面推荐使用的超轻量级的框架 Style CSS属性用法 设置css属性:setstyle 通过ID设置css属性 x$('#top1').setStyle('color', '#DB ...
- vue文件中style标签的几个标识符
.vue文件中style标签的几个标识符 在人生就要绝望的时候, 被编辑器所提示的一个scopedSlots所拯救. 卧槽, 写到最后才发现这个属性的具体卵用. 详情见最后解决办法. 问题背景 问题由 ...
- vue框架中props的typescript用法
vue框架中props的typescript用法 在vue中使用typescript时,需要引入vue-property-decorator库来兼容格式. javascript写法 Vue.compo ...
- Vue#Class 与 Style 绑定
绑定HTMLCLASS 在我没看这之前,我觉得要写绑定class ,应该像绑定数据一样这么写 class ={{class-a}} 看官方教程时,不推荐这么写,推荐这样 v-bind:class=&q ...
- vue class与style 绑定详解——小白速会
一.绑定class的几种方式 1.对象语法 直接看例子: <div id="app3"> <div :class="{'success':isSucce ...
- VUE温习:style层次分析
一.vue样式style层次分析 1.样式可以在main.js.模块js文件.组件style.组件script标签内,index.html文件内引入,不同位置引入的样式有什么关系. 2.总结: (1) ...
- 09.vue中样式-style
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- Docker的一些常用命令
# systemctl start docker //启动docker # systemctl restart docker //重启docker # systemctl enable docker ...
- 无线wifi
802.11n 802.11n是基于OFDM(正交频分复用Orthogonal Frequency Division Multiplexing)技术下的2.4G频段的协议,也可以工作在5G频段下. - ...
- 沉淀再出发:xml的意义和存在的价值
沉淀再出发:xml的意义和存在的价值 一.前言 学习了那么多的语言.框架.语法和基础知识,我们对于数据的理解或许有了一定的认识,但是如何描述.包装.传输.存储数据的手法和流程我们了解的或许并不多,其中 ...
- August 19th 2017 Week 33rd Saturday
Live for today and stop stressing out about tomorrow. 为今天而活,不必为明天过分担心. Stop bewailing the past misfo ...
- stderr: xcode-select: error: tool 'xcodebuild' requires Xcode, but active developer directory '/Library/Developer/CommandLineTools' is a command line tools instance
错误提示: (1). stderr: xcode-select: error: tool 'xcodebuild' requires Xcode, but active developer direc ...
- pat 5—1 求该日是该年的第几天
哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈 前面还是欠了一堆,慢慢补吧. 看了别人的博客才知道前面有一次圆面积的题,我上课是在干啥......... 打是打出来了,但是还是有几个蒙蔽的地方: ...
- Mac OS Yosemite(10.10.3)系统下环境配置
/etc/bash_profile #Java export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.7.0_65.jdk/Contents/ ...
- PostgreSQL 常用的命令
连接数据库: psql -h ip -U usrname查看所有库: \l查看所有表: \dt查看某个表的结构: \d 表名查看数据库中所有的表: select * from pg_tables;查看 ...
- 推荐一个WPF仪表盘开源控件
前段时间,做服务器端监控系统,为了界面好看,采用WPF.硬件相关监控,比如CPU.内存等,想用仪表盘控件.网上找了很多这种控件,基本上都是第三方商业控件(虽然很漂亮,不过得money...).最后在C ...
- Linux内存管理学习笔记——内存寻址
最近开始想稍微深入一点地学习Linux内核,主要参考内容是<深入理解Linux内核>和<深入理解Linux内核架构>以及源码,经验有限,只能分析出有限的内容,看完这遍以后再更深 ...