background-attachment+vue

Ba la la la ~ 读者朋友,你们好啊,又到了冷锋时间,话不多说,发车!


background-attachment -- 定义背景图片随滚动轴的移动方式取值: scroll | fixed | inheritscroll: 随着页面的滚动轴背景图片将移动
fixed: 随着页面的滚动轴背景图片不会移动
inherit: 继承
初始值: scroll
继承性: 否
适用于: 所有元素
background:背景.attachment:附着.


vue

Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的渐进式框架。
Vue 只关注视图层, 采用自底向上增量开发的设计。
Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
Vue 学习起来非常简单,本教程基于 Vue 2.1.8 版本测试。

Vue.js 使用了基于 HTML 的模版语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。
Vue.js 的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进 DOM 的系统。
结合响应系统,在应用状态改变时, Vue 能够智能地计算出重新渲染组件的最小代价并应用到 DOM 操作上。

插值
文本
数据绑定最常见的形式就是使用 {{...}}(双大括号)的文本插值:
文本插值
<div id="app"> <p>{{ message }}</p></div>

Html
使用 v-html 指令用于输出 html 代码:
v-html 指令
<div id="app"> <div v-html="message"></div></div>

属性
HTML 属性中的值应使用 v-bind 指令。
以下实例判断 class1 的值,如果为 true 使用 class1 类的样式,否则不使用该类:
v-bind 指令
<div id="app"> <label for="r1">修改颜色</label><input type="checkbox" v-model="class1" id="r1">

<div v-bind:class="{'class1': class1}"> directiva v-bind:class </div></div> <script>new Vue({ el: '#app', data:{ class1: false }});</script>

表达式
Vue.js 都提供了完全的 JavaScript 表达式支持。
JavaScript 表达式
<div id="app"> {{5+5}}
{{ ok ? 'YES' : 'NO' }}
{{ message.split('').reverse().join('') }} <div v-bind:id="'list-' + id">菜鸟教程</div></div> <script>new Vue({ el: '#app', data: { ok: true, message: 'RUNOOB', id : 1 }})</script>


以上为个人意见,如有雷同,纯属巧合,欢迎大家多提意见!Bey 了 个 Bey ~

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 这篇笔记主要包含 Vue 2 不同于 Vue 1 或者特有的内容,还有我对于 Vue 1.0 印象不深的内容。关于...
    云之外阅读 5,083评论 0 29
  • Vue.js 教程 Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的渐进式框架。Vue...
    流水潺湲阅读 1,300评论 0 3
  • 1.安装 可以简单地在页面引入Vue.js作为独立版本,Vue即被注册为全局变量,可以在页面使用了。 如果希望搭建...
    Awey阅读 11,109评论 4 129
  • 柳永《凤栖梧》 衣带渐宽终不悔,为伊消得人憔悴。 李之仪《卜算子》 我住长江头,君住长江尾。日日思君不见君,共饮长...
    伊滴墨阅读 566评论 2 6
  • 昨天晚上看《康熙来了》 偶然看到采访赵薇致青春,我本人觉得导演太朴实了 所以驱使我今天中午又看一遍《致青春》。看完...
    孑女阅读 292评论 0 2