1==》如何让div里面的元素在【垂直 方向】上水平分布
.important-dec{
height: 121px; //必须固定高度
flex-direction: column; //垂直排列
display: flex;
justify-content: space-between;
}

2==》使用 calc() 函数计算 <div> 元素的宽度:
需要注意的是,运算符前后都需要保留一个空格,例如:width: calc(100% - 10px);
任何长度值都可以使用calc()函数进行计算;
calc()函数支持 "+", "-", "*", "/" 运算;
calc()函数使用标准的数学运算优先级规则;

width: calc(100% - 210px);

div里面的元素在【垂直 方向】上水平分布 使用calc()函数动态计算的更多相关文章

  1. 《在纹线方向上进行平滑滤波,在纹线的垂直方向上进行锐化滤波》 --Gabor增强的具体实践

    <在纹线方向上进行平滑滤波,在纹线的垂直方向上进行锐化滤波>                                          --Gabor增强的具体实践     一.问 ...

  2. HTML-移动端如何使用css让百分比布局的弹窗水平和垂直方向上居中

    pc端让一个弹窗水平和垂直方向居中,在知道弹窗宽高的情况下很好计算,只需要用如下css即可: #date{ width: 300px; height: 300px; position: absolut ...

  3. 触发bfc解决父子元素嵌套垂直方向margin塌陷问题

    首先看一下问题案例 .wrapper{             width: 100px;             height: 100px;             background-colo ...

  4. Div 内部所有元素 全部垂直对齐

    http://stackoverflow.com/questions/7273338/how-to-vertically-align-an-image-inside-div How it works: ...

  5. HTML5 移动端如何使用css让百分比布局的弹窗水平和垂直方向上居中

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. Html中让输入框input和紧接在后的按钮button在垂直方向上对齐

    <table border="0px" width="360px"> <tr><td colspan="10" ...

  7. div里面的元素垂直均匀分布 按钮引发地址栏出现问号 判断一个数组是否为空 div底部居中 路由传参接受参数

    一个固定高度的div的子元素 在垂直 方向上平均分布 .important-dec{ height: 121px; flex-direction: column; display: flex; jus ...

  8. 行盒(line box)垂直方向的属性详解:从font-size、line-height到vertical-align

    视觉格式化模型 在一个文档中,每个元素都被表示为0.1或多个矩形的盒子.确定这些盒子的尺寸, 属性 --- 像它的颜色,背景,边框方面 --- 和位置是渲染引擎的目标.① 在CSS中,使用标准盒模型描 ...

  9. css 垂直方向 margin 边距 重合

    1:控制两个相邻边盒子之间的距离,在A或者B盒子上用margin控制,就可以控制距离了. 2:父子级之间的元素,常规文档流中,只要垂直外边距直接接触就会发生合并.比如在写header标签时,想移动he ...

随机推荐

  1. weblogic启动服务器Authentication denied: Boot identity not valid

    新分配的测试服务器,已经安装好了weblogic,使用命令nohub ./startWeblogic.sh启动weblogic没有问题 登录控制台,点击环境-服务器-新建,一步步完成后,点击部署.选择 ...

  2. gradle下mybatis自动生成框架的使用

    自动生成框架的意义 主要为了解决人为添加mapper,模型等工作,减少错误,提交效率! 添加引用build.gradle configurations { mybatisGenerator } myb ...

  3. JS---体验DOM操作

    体验DOM操作 1. <!--html代码--> <input type="button" value="弹框" onclick=" ...

  4. MySQL相关参数总结

    保留个原文链接,避免被爬虫爬了过去,以便后续更正补充:https://www.cnblogs.com/wy123/p/11273023.html MySQL参数繁多,是一个需要根据具体业务.软硬件环境 ...

  5. 九、ITK-VTK混合编程--将序列dcm图像通过ITK读去并通过VTK显示出来

    一.初步介绍 上一个博客里面我记录了VTK的安装,以及相关的工程代码的构建,但是实际上上一个博客测试的代码的例子仅仅只是VTK程序的例子.而我实际上希望能够实现的是VTK和ITK混合编程. 在这里还是 ...

  6. 【Spring JDBC】NamedParameterJdbcTemplate(四)

    一.什么是具名参数 在经典的 JDBC 用法中, SQL 参数是用占位符 ? 表示,并且受到位置的限制.定位参数的问题在于, 一旦参数的顺序发生变化, 就必须改变参数绑定.在 Spring JDBC ...

  7. 记一次Ubuntu19无法安装docker源

    按照各大网站以及个人习惯我会使用下面这种方法添加Docker源: root@ubuntu:~# sudo add-apt-repository "deb [arch=amd64] https ...

  8. ASP.NET Core 2.2 WebApi 系列【九】使用SignalR

    1.添加 SignalR 客户端库 右键点击项目->然后选择“添加” >“客户端库” 提供程序选择:unpkg ,库选择:@aspnet/signalr@1.1.4 选择“选择特定文件” ...

  9. java基础(5):流程控制语句(switch)、数组

    1. 流程控制语句(续) 1.1 选择结构switch switch 条件语句也是一种很常用的选择语句,它和if条件语句不同,它只能针对某个表达式的值作出判断,从而决定程序执行哪一段代码.例如,在程序 ...

  10. javaWeb核心技术第十四篇之easyui

    网站是分为网站的前台和网站的后台. 前台--给用户看的 例如:商城 后台--给管理员看的 例如:商城后台 目的:用来添加维护数据 BootStrap:jsp 页面显示,效果好,美观,适合作为用户界面. ...