flex下部固定高,上部不固定,而且超过内容要滚动
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1,minimum-scale=1,maximum-sacle=1,user-scalable=no">
<style>
.t1{
position: fixed;
width: %;
top: ;
bottom: ;
left: ;
right: ;
display: flex;
flex-flow: column;
}
.t2{
flex: ;
overflow: auto
}
.t3{
flex: 600px;
width: %;
height: 600px;
}
</style>
</head>
<body>
<div class="t1">
<div class="t2">分所发生的法师分所发生的法师打发第三方第三方斯蒂芬斯蒂芬斯蒂芬斯蒂芬是的房顶上分所发生的法师打发第三方第三方斯蒂芬斯蒂芬斯蒂芬斯蒂芬是的房顶上打发第三方第三方斯蒂芬斯蒂芬斯蒂芬斯蒂芬是的房顶上</div>
<div class="t3">dsadsa</div>
</div>
</body>
</html>

设置了display:flex,子元素里面,一个固定了高度,另一个的默认就有了高度
有个要求:子元素只能俩个,如果是2个以上,就没效果
flex下部固定高,上部不固定,而且超过内容要滚动的更多相关文章
- 当ligerui的grid出现固定列与非固定列不在同一水平线上时,改怎么处理
当ligerui的grid出现固定列与非固定列不在同一水平线上时,如下图所示: 此时可以增加fixedCellHeight:false属性进行解决.这个属性在IE上不起作用,那么该怎么处理,可以这样处 ...
- flex盒模型实现头部尾部固定
近期做移动app.wap等站,需要头部固定在顶部,不随着内容滚动而滚动平时第一想法就是使用position:fixed;top:0;z-index:10;这样去实现但这样使用fixed之后,会在ios ...
- div在固定高的文字垂直居中
<div style='display:table; height:100px;'> <div style='display:table-cell; vertical-align: ...
- 不固定高宽的 div 水平垂直居中
<div class="father"> <div id="main"></div> </div> .fathe ...
- 上下左右居中 无固定高的div
<style type=“text/css”> #vc { display:table; background-color:#C2300B; width:500px; height:200 ...
- 会话固定攻击 - yxcms session固定漏洞
目录 会话固定攻击 e.g. yxcms session固定攻击 分析 了解更多 会话固定攻击 Session fixation attack(会话固定攻击)是利用服务器的session不变机制,借他 ...
- C++产生固定范围内的固定数量的随机数
#include<iostream> #include<ctime> #include<random> using namespace std; void knut ...
- 微信小程序 按钮固定在页面底部遮住页面显示内容问题
我们分为以下部分来解决这个问题: 第一部分:问题的表现是怎么样的? 第二部分:问题的是如何实现的? 第三部分:如何解决问题? 第一部分:问题的表现是怎么样的? 我设置了页面有0-99共100个数,但是 ...
- layui静态表格固定td宽度,table固定td宽度
正在做一个项目,要求数据表的列是不固定的,有可能是有10列,有可能是20列,第一列宽度要固定,然后我怎么设置都没有用, 这个问题困扰了我三天,后来终于百度到了, 这个博客: https://www.c ...
随机推荐
- 【十一】jvm 性能调优工具之 jmap
jvm 性能调优工具之 jmap 概述 命令jmap是一个多功能的命令.它可以生成 java 程序的 dump 文件, 也可以查看堆内对象示例的统计信息.查看 ClassLoader 的信息以及 fi ...
- 【python小练】0011题
第 0011 题: 敏感词文本文件 filtered_words.txt,里面的内容为以下内容,当用户输入敏感词语时,则打印出 Freedom,否则打印出 Human Rights. #word.tx ...
- 第24月第30天 scrapy《TensorFlow机器学习项目实战》项目记录
1.Scrapy https://www.imooc.com/learn/1017 https://github.com/pythonsite/spider/tree/master/jobboleSp ...
- 【blog】SpringBoot如何搭建聚合项目
以我的博客为例 blog --blog-common --blog-entity --blog-repo --blog-service --blog-web SpringBoot聚合项目推荐 http ...
- 基于【字符】操作的IO接口:Writer、Reader
Reader public class BufferedReaderTest { public static void main(String[] args) throws IOException { ...
- Css - 字体图标
Css - 字体图标 字体格式 ttf.otf.woff.svg.eot 现在流行将图标做成矢量的字体格式的文档,很多用户在放大页面的时候页面上的普通图片格式的图标就会变得模糊不清,这种字体图标在网页 ...
- Javascript - ExtJs - GridPanel组件
GridPanel组件(Ext.grid.GridPanel)logogram:Ext.grid.Panel | xtype:gridpanel 此类派生自Ext.Panel,创建表格需要两个必须的对 ...
- pythonのpygame初体验
import pygame import sys from pygame.locals import * #初始化pygame pygame.init() size = width,height=60 ...
- 手写代码注意点--java.lang.Math 相关
1-如果用到了Math的函数,需要手动写上: import java.lang.Math; 2-求x的y次方,用的是Math.pow(x,y); 注意,返回值是double!!! 不是int, 如果需 ...
- 关于Jonathan S. Weissman与RIT(罗切斯特理工学院,位于纽约)
信息来源于:edx平台的 RITx: CYBER501xCybersecurity Fundamentals 课程的介绍(https://courses.edx.org/courses/course ...