/html
<div id="app">
  
  //对象就是无序键值对的集合
  <h1 :style="{ color:red, 'font-weight':200 }">哈哈哈哈哈</h1>
  
  <h1 :style="styleObj"></h1>
  
  <h1 :style="[styleObj,styleObj2]"></h1>
</div> //script
<script>
  var vm = new Vue({
    el:'app',
    data:{
      msg:'点击一下',
      styleObj:{ color:red, 'font-weight':200 },
      styleObj2:{ 'font-style': 'italic' }
    },
    methods:{//methods中定义了当前vue实例中所有可用的方法
     
    }
  })
</script>

vue学习(九) 使用内联样式设置style样式的更多相关文章

  1. Vue 设置style样式

    1.直接添加行内样式 2.通过绑定设置style样式 3.将vue的属性设置为样式 4将多个vue属性设置为样式 <div id="box"> <!--直接添加样 ...

  2. Vue学习(二):class与style绑定

    <!DOCTYPE html> <html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml&q ...

  3. vue 绑定 class 和 内联样式(style)

    <div id="app31"> <!--多个属性 ,号隔开--> <!-- v-bind:style="{fontSize: fontSi ...

  4. 4.7做作业时发现,内联元素设置宽高背景以后正常不显示,但是设置了position:absolute;以后就可以显示了。起到了和display:block;一样的效果。然后查了一下知道了。

    如果内联元素定位属性设置为:absolate,元素脱离文档,即使a元素中没有内容,设置的背景依然会显示!

  5. C++学习笔记之——内联函数,引用

    本文为原创作品,转载请注明出处 欢迎关注我的博客:http://blog.csdn.net/hit2015spring和http://www.cnblogs.com/xujianqing/ 作者:晨凫 ...

  6. 2019-10-30:渗透测试,基础学习,mssql堆叠内联注入,mongodb基础语法

    使用xp_cmdshell需要堆叠注入,http://192.168.190.148/less-1.asp?id=1';EXEC sp_configure 'show advanced options ...

  7. HTML5学习笔记3 内联SVG

    HTML5支持内联SVG 下面来介绍一下什么是SVG SVG可缩放矢量图形 可缩放矢量是基于可扩展标记语言(标准通用语言的子集),用于描述二维矢量图形的一种图形格式.它由万维网联盟制定,是一个开放标准 ...

  8. C++基础学习6:内联函数

    C++语言新增关键字 inline,用于将一个函数声明为内联函数.在程序编译时,编译器会将内联函数调用处用函数体替换,这一点类似于C语言中的宏扩展. 采用内联函数可以有效避免函数调用的开销,程序执行效 ...

  9. C++中对C的扩展学习新增语法——内联函数以及函数参数

    内联函数以及函数参数 内联函数 使用 inline 关键字必须和函数体放在一起. 内联函数具有内部链接属性. 内联函数会被编译器在编译阶段替换到函数调用的地方. 可以把内联函数定义写到头文件中,多个c ...

随机推荐

  1. 底层剖析Python深浅拷贝

    底层剖析Python深浅拷贝 拷贝的用途 拷贝就是copy,目的在于复制出一份一模一样的数据.使用相同的算法对于产生的数据有多种截然不同的用途时就可以使用copy技术,将copy出的各种副本去做各种不 ...

  2. vue全家桶(2.2)

    3.3.router-link配置 3.3.1.实例 需求:实现下面效果,点击不同的菜单,显示不同的文字 核心代码:App组件 <template> <div id="ap ...

  3. Ticket Game【博弈】

    题目 Monocarp and Bicarp live in Berland, where every bus ticket consists of n digits (n is an even nu ...

  4. java中执行cmd命令

    一.java执行cmd命令的三种方式:http://www.jb51.net/article/80829.htm 参考:https://www.cnblogs.com/zhufu9426/p/7928 ...

  5. CentOS 7安装Oracle 12c图文详解

    环境: CentOS7@VMware12,分配资源:CPU:2颗,内存:4GB,硬盘空间:30GB Oracle 12C企业版64位 下载地址:http://www.oracle.com/techne ...

  6. IDEA中文注释难看的简单解决办法

    好多人会发现IDEA这款集成开发工具的中文(主要是在注释上面)显示都比较难看,如下面: 都以为是字体的原因,于是各种替换字体,麻烦不说,还容易造成乱码的问题. 真正难看的原因并不是字体,而是以为是斜体 ...

  7. js/ts/tsx读取excel表格中的日期格式转换

    const formatDate = (timestamp: number) => { const time = new Date((timestamp - 1) * 24 * 3600000 ...

  8. 探讨NET Core数据进行3DES加密或解密弱密钥问题

    前言 之前写过一篇<探讨.NET Core数据进行3DES加密和解密问题>,最近看到有人提出弱密钥问题,换个强密钥不就完了吗,猜测可能是与第三方对接导致很无奈不能更换密钥,所以产生本文解决 ...

  9. Mybatis 报错

    Mybatis 报错 builder.BuilderException: Error parsing SQL Mapper Configuration Caused by: org.apache.ib ...

  10. 常用API - Scanner、Random、ArrayList

    API 概述 API(Application Programming Interface),应用程序编程接口. Java API是一本程序员的 字典 ,是JDK中提供给我们使用的类的说明文档. 这些类 ...