2018-01-26 关于display

一、display:inline ,inline-block,block,none释义

  • inline
    该元素生成一个或多个行内元素盒
  • block
    该元素生成一个块元素盒
  • inline-block
    该元素生成一个块状盒,该块状盒随着周围内容流动,如同它是一个单独的行内盒子(表现更像是一个被替换的元素)
    结合了行内元素和块级元素的特点。对元素设置该属性后,实现的效果是:元素成为一个块状的盒子,然后行内排列(随界面的宽度变化而换行),同时可以对元素设置宽高
  • list-item
    该元素生成一个容纳内容和单独的列表行内元素盒的块状盒
  • none
    关闭一个元素的显示,这样其后代元素都会同时隐藏。文档在渲染的时候,该元素如同不存在。区别于visibility: hidden ,visibility: hidden 元素不显示但是还是会占据原来的空间
  • table
    这个元素的作用就像 元素. 它定义了一个块级盒子.
  • table-row
    这个元素的作用就像
  • 一样.
  • table-cell
    这个元素的作用就像
  • 一样
    利用td特有的垂直居中及拉伸属性
    二、object.key 与 object[key]的区别
    js读取属性有2种方式:object.key与object[key]。那么究竟二者在使用上有什么区别呢
    例:
    var obj ={key1:value1,key2:value2}
    注意:对象的key类型是字符串
  • 区别1:
    如果使用.来访问属性值,可写为obj.key1
    如果使用[]来访问属性值,则写为obj['key1']。(键名必须带引号,否则被当变量处理)。如下:obj[foo] 输出为2
    var foo = 'bar';
    var obj = {
    foo: 1,
    bar: 2
    };
    obj.foo // 1
    obj[foo] // 2
  • 区别2
    如果键名是数值,则不能通过.运算符访问属性值。例如:
    var obj = {
    231: 1,
    bar: 2
    };
    obj.231 //报错
    obj.[231] //如果是数值key,引号可以不加
  • 区别3
    最近在用angular做项目时遇到的一个问题。比如$scope.name 、$scope.value都是从界面上拿到用户输入的值,现在想把它们组成对象的键值对,形式如下:var data ={$scope.name:$scope.value}
    //假设$scope.name=“name” $scope.value = “6”//
    第一种方式:data.$scope.name = $scope.value
    首先会报错:Uncaught SyntaxError: Unexpected token .。不能识别这个点。其次,如果var f = $scope.name,然后data.f = $scope.value,则打出对象是{f:6},明显不是我们要的结果
    第二种方式:data[$scope.name] = $scope.value
    但是如果用这种方式,打出对象是{name:6}
    原因:如果key值并不确定,而是一个变量的时候,则只能通过obj[someKey]的方式访问。
    data.key 代表 data里面name = "key"的value
    data[key] 代表data里面name = key 的value
  • ng-bind ng-model {{}}的区别

    你可能感兴趣的:(2018-01-26 关于display)