gridcontrol值为0时设置为空_CSS设置宽高的小技巧
一、css宽高自适应:
1.宽度自适应:
元素宽度设为100%(块状元素的默认宽度为100%)
注:应用在通栏效果中
2.高度自适应:
height:auto;或者不设置高度
3.最小,最大高度,最小,最大宽度:
a)最小高度 min-height:value;
IE6不识别min-height属性,解决方案如下: 方案一:min-height:100px; _height:100px; 方案二:min-height:100px; height:auto!important; height:100px;
b)最大高度:
max-height:value;
c)最大宽度:
max-width:value;
d)最小宽度:
min-width:value;
注:块状元素设置最小宽度时,需要将元素转换为内联块状元素,添加display:inline-block;
注:以上四个属性IE6及以下版本浏览器不支持
4.高度塌陷问题:
描述:子元素浮动,父元素高度自适应,造成父元素高度为0,简称高度塌陷问题
解决方案:
方案一:
给父元素添加overflow:hidden; 优点:简单,兼容性好 缺点:当有position:relative;出现时,会影响页面显示效果
方案二:
给父元素固定的高度 height:value; 缺点:不灵活,高度无法自适应
方案三:
在子元素的末尾添加一个空div,并设置样式 .clear{height:0; overflow:hidden;clear:both;} 优点:所有浏览器都支持 缺点:在页面中添加一个无意义的div,造成代码冗余
方案四:(万能清除浮动法,推荐使用)
通过伪元素的方式清除浮动
父元素:after{ content:""; height:0; overflow:hidden; clear:both; display:block; visibility:hidden;}
注:伪元素是内联元素,转换为块元素设置宽高才能生效
height:0;在IE6下不兼容,添加overflow:hidden;兼容IE6
二、元素隐藏不可见的两种方式(display:none;和visibility:hidden的区别)
1.display:none;元素隐藏不可见,位置不保留
2.visibility:hidden;元素隐藏不可见,位置保留
三、窗口高度自适应
首先,给html,body设置高度为100%html,body{height:100%;} 然后给元素设置高度100% div{height:100%} 注:常用于窗口内容不满一屏或者没有内容body高度为0时
四、水平居中和垂直居中:
1.行内元素水平居中设置
设置文本、图片等行内元素水平居中,给父元素设置text-align:center;
2.定宽块状元素水平居中设置
给定宽块状元素设置左右margin值为auto
注:当元素设置float或绝对定位,固定定位时,左右margin为auto失效
3.不定宽块状元素水平居中
方法一:
给父元素设置 {display:table;margin:0 auto;}
注: display:table;将元素转换为表格的形式
方法二:
子元素设置: {display:inline-block;}父元素设置:{text-align:center;}
五、元素水平垂直都居中
1.未知宽高元素在屏幕窗口水平垂直都居中
方法一:
元素{ width:value; height:value; position:fixed; left:50%; top:50%; margin-left:-width/2+px; margin-top:-height/2+px; }
方法二:
元素{width:value;height:value; position:fixed;left:0;top:0;right:0;bottom:0;margin:auto;}
2.未知宽高元素在父元素中水平垂直都居中
方法一:
元素{ width:value; height:value; position:absolute; left:0; top:0; right:0; bottom:0; margin:auto; }
方法二:
父元素{ width:value; height:value; display:table-cell; vertical-align:middle; text-align:center; }
注:display:table-cell;将元素转换为表格单元格形式
gridcontrol值为0时设置为空_CSS设置宽高的小技巧相关推荐
- gridcontrol值为0时设置为空_XASSET 4.0入门指南
XASSET 5.1已经发布 XASSET 5.1为Unity项目提供了可以快速投入到生产环境中使用的具有更智能和灵活的资源分包.热更新机制和稳健高效的资源加载和内存管理的资源管理方案.它不仅可以服务 ...
- java integer null 0_Mybatis Integer类型参数值为0时得到为空的解决方法
今日遇到的问题: 查询版本信息时,由于version是Integer类型,所以当前台选择版本为0时,变成了查询了所有的版本信息. sql片段: AND a.version = #{version} 原 ...
- Mybatis Integer类型参数值为0时判断为空、空字符串不通过
根据状态查询是,由于status是Integer类型,所以当前状态为0时,变成了查询了所有的状态信息. <if test="requestParam.status != null an ...
- echarts柱状图值为0时不显示以及柱状图百分比展示
echarts柱状图值为0时不显示以及柱状图百分比展示 1.效果展示 2.代码 <template><div id="container"><div ...
- echarts 值为0时 柱状图不显示bar
项目需求:如果最大最小值差别很大的话,若值很小,也需进行占位,所以加了barMinHeight,这样又导致了另一个问题,值为0时,不需要绘制,因此,提出了下面两种解决方案 第一种方法:将值为0的透明度 ...
- 动态设置view或布局的宽高
代码中动态设置view或布局的宽高 标签: 图片/ 动态改变/ 宽高 有时我们需要在应用中动态改变图片或某一块布局的大小.这就不能用XML文件写成固定值,而需要在java代码中动态设置.效果如下: ...
- Mybatis中 Integer 值为0时,默认为空字符串的解决办法
问题 需求是查询级别为0的用户 User对象里的level字段的值为0,查询时居然没有查到为level为0的用户. <select id="selectSelective" ...
- 解决小程序使用wxCharts环形图时,值为0时安卓机不显示图的问题
不知道是不是兼容性的问题,不管小程序使用什么图表的环形图,只要其中一个值为0,在安卓手机上都是不显示出来的,但是图表上有需要显示100% 和 0%的字样,所以我发现将data的最小值设置为 0.000 ...
- 代码中动态设置view或布局的宽高
有时我们需要在应用中动态改变图片或某一块布局的大小.这就不能用XML文件写成固定值,而需要在java代码中动态设置.效果如下: 网上有一些教程使用relativeView.setLayoutParam ...
最新文章
- Vivado各个过程产生的文件与ISE的对比
- linux双机热备 oracle,oracle for linux双机热备实战
- spring + shiro + cas 实现sso单点登录
- 碰碰车司机教你Linux下使用nmon分析系统性能
- (String)、toString、String.valueOf的区别
- JBoss BPM Suite 6.0.3版本的5个实用技巧
- OJ RuntimeError常见原因
- 倪光南、求伯君“出山”:爱解 Bug、无惧“35岁魔咒”、编码之路痛并快乐!
- HashMap,,ConcurrentHashMap------------------浅谈!!
- DRUID连接池:java.sql.SQLRecoverableException: 关闭的语句
- python使用dbm持久字典详解
- 三菱plc编程软件gx-developer在win10中无法使用及工程无法建立解决方法
- 割点(tarjan算法)
- 【图像去噪】基于高斯滤波、均值滤波、中值滤波、双边滤波四种滤波实现椒盐噪声图像去噪附matlab代码
- Ping其他电脑ping不通的解决方法
- python idle背景设置为黑色_python IDLE颜色设置
- Linux中使用shell脚本向文件中写数据
- 隐藏IP的功能和原理
- WEB前端2020年更新实用代码段(持续更新)
- 解剖Twitter:Twitter系统架构设计分析-2
热门文章
- python字典的常见操作_Python 字典(Dictionary) 基本操作
- python打印字节流_Python 调用系统命令的模块 Subprocess
- Java黑皮书课后题第6章:6.37(格式化整数)编写一个测试程序,提示用户输入一个数字以及宽度,显示通过调用format方法返回的字符串
- C语言学习之购房从银行贷了一笔款d,准备每月还款额为p,月利率为r,计算多少月能还清。
- 22 Notification 通知栏代码
- WebSocket学习
- winform中关于panel中滚动条和键盘事件几点体会
- 窗口之间值、控件的传递
- 公司承担的国家发改委高技术产业化示范工程
- TFS - Team Foundation Server 的安装记录