Vue中尽量不使用dom的高度计算

<template>
  <div :style="conheight">
</template>
<script>
  export default{
    data(){
      conheight:{
height:''
}
    },
    methods:{
getHeight(){
this.conheight.height=window.innerHeight-170+'px';
},
    created(){
window.addEventListener('resize', this.getHeight);
this.getHeight()
}
  } </script>

Vue中div高度自适应的更多相关文章

  1. css中div高度自适应

    高度的自适应(父div高度随子div的高度改变而改变) 1.如果父div不定义height.子div均为标准流的时候,父div的height随内容的变化而变化,实现父div高度随子div的高度改变而改 ...

  2. div中宽高度自适应文字换行居中问题解决

    <html> <head> <meta charset="UTF-8"/> <title>div中宽高度自适应文字换行居中demo& ...

  3. div高度自适应(总结:min-height:100px; height:auto;的用法)

    对于div高度自适应问题,我总是用一句话:height:auto来解决. 但是很多时候我们需要的是当div内部有内容时,高度会随着内容的增加和增加,当div中没有内容时,div能够保持一个固定的高度. ...

  4. 四种方法解决DIV高度自适应问题

    本文和大家重点讨论一下解决DIV高度自适应的方法,这里主要从四个方面来向大家介绍,相信通过本文学习你对DIV高度自适应问题会有更加深刻的认识. DIV高度自适应 关于DIV高度的自适应,一直是个让人头 ...

  5. DIV高度自适应及注意问题(转)

    本文和大家重点讨论一下DIV高度自适应及注意问题,主要包括父div高度随子div的高度改变而改变和子div高度随父亲div高度改变而改变两种情况. DIV高度自适应及注意问题 积累了一些经验,总结出一 ...

  6. winform中dataGridView高度自适应填充完数据的高度

    // winform中dataGridView高度自适应填充完数据的高度,就是dataGridView自身不产生滚动条,自己的高度是根据数据的多少而变动. 在load的时候,数据绑定后,加上如下代码: ...

  7. CSS实现div高度自适应

    1.有时候,我们希望容器有一个固定高度,但当其中的内容多的时候,又希望高度能够自适应,也即容器在纵向能被撑开,且如果有背景,也能够自适应.在一般情况下,使用min-height即可解决.但是广大网民的 ...

  8. div中iframe高度自适应问题

    网页分为上.中.下三部分,上.下高度固定中间高度自适应:中间分为左.右两部分,左边宽度固定,右边宽度自适应.现在右侧div是宽度和高度都是自适应,右侧div里有个IFrame,想让IFrame自适应外 ...

  9. css实现div中图片高度自适应并与父级div宽度一致

    需求:1.父级div不设置高度 2.图片高度自适应,并且显示为正方形: 以前遇到列表中图片高度必须和父级宽度相同,并且需要为正方形的时候,最开始的方法是定死图片高度,这样会导致不同分辨率下图片会压缩, ...

随机推荐

  1. 牛客网 牛客小白月赛2 D.虚虚实实-无向图判欧拉路径

    D.虚虚实实 链接:https://www.nowcoder.com/acm/contest/86/D     这个题是无向图判欧拉路径,首先要判是否连通,然后再判欧拉路径就可以,板子题. 板子来源: ...

  2. codevs——1010 过河卒(棋盘DP)

    2002年NOIP全国联赛普及组  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 黄金 Gold 题解  查看运行结果     题目描述 Description 如图,A 点有 ...

  3. spring配置文件中配置sessionFactory失败

    配置失败主要原因有两个: <bean id="studentDaoImp" class="com.gxwuz.maven.dao.StudentDaoImp&quo ...

  4. 2016集训测试赛(二十六)Problem A: bar

    Solution 首先审清题意, 这里要求的是子串而不是子序列... 我们考虑用1表示p, -1表示j. 用sum[i]表示字符串前\(i\)的前缀和. 则我们考虑一个字符串\([L, R]\)有什么 ...

  5. - > 动规讲解基础讲解六——编辑距离问题

    给定两个字符串S和T,对于T我们允许三种操作: (1) 在任意位置添加任意字符(2) 删除存在的任意字符(3) 修改任意字符 问最少操作多少次可以把字符串T变成S?  例如: S=  “ABCF”   ...

  6. 学习和家庭教育 z

    大家好,我是王宁. 今天能站在这里,纯属偶然. 为什么说偶然呢? 因为,南雅是个人才济济的地方,164班是一个优秀的集体. 个人认为,班级前二十几名的同学,时机适宜,谁考班上第一名都有可能. 妈妈对我 ...

  7. ThinkPHP3.1 模板布局

    ThinkPHP的模板引擎内置了布局模板功能支持,可以方便的实现模板布局以及布局嵌套功能.有三种布局模板的支持方式: 第一种方式:全局配置方式 这种方式仅需在项目配置文件中添加相关的布局模板配置,就可 ...

  8. EasyMvc入门教程-基本控件说明(4)折叠面板

    折叠面板一般出现在管理后台,大家用的OutLook里就是用了折叠面板,样子大概是这样的: 把其中的内容替换成图标按钮,是不是就是我们常见的样子了?:)那么如何实现呢?请看例子: @{ var data ...

  9. mootools客户端框架

    mootools客户端框架 学习:http://www.chinamootools.com/ 官网:https://mootools.net/ 下载地址: https://github.com/moo ...

  10. Linux内核——内存管理

    内存管理 页 内核把物理页作为内存管理的基本单位.内存管理单元(MMU,管理内存并把虚拟地址转换为物理地址)通常以页为单位进行处理.MMU以页大小为单位来管理系统中的页表. 从虚拟内存的角度看,页就是 ...