做 loading 居中

剧中通常就是 top left 50% 再调一下自己就可以了

关键是要有 width height

遇到一些base on content 决定 height 的情况一般上有几个方案。

1. set min height 至少有一个 height (但是内容出来后就会跳，这个体验不是很好)

2. 找一个可靠的 parent 来定位. 这个 parent 的 width height 要是固定的. 这样就不会跳了

3. set 100% height 跟 parent 大, div 固定了height 就不会跳了，但是这个设计不一样通用

css 学习笔记 常用到的知识的更多相关文章

  1. CSS学习笔记1：基础知识

    CSS规则由两部分组成,选择器和声明     选择器:标签,告诉浏览器哪些标签需要用到这个样式     声明:样式的内容,由一或多对属性:值以:隔开组成,由{}包围,需要多个选择器时以逗号隔开     ...

  2. HTML+CSS学习笔记 (7) - CSS样式基本知识

    HTML+CSS学习笔记 (7) - CSS样式基本知识 内联式css样式,直接写在现有的HTML标签中 CSS样式可以写在哪些地方呢?从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式.嵌 ...

  3. CSS学习笔记08 浮动

    从CSS学习笔记05 display属性一文中,我们知道div是块元素,会独占一行,即使div的宽度很小,像下面这样 应用display属性的inline属性可以让div与div共享一行,除了这种方法 ...

  4. IP地址和子网划分学习笔记之《预备知识：进制计数》

    一.序:IP地址和子网划分学习笔记开篇 只要记住你的名字,不管你在世界的哪个地方,我一定会去见你.——新海诚 电影<你的名字> 在我们的日常生活中,每个人的名字对应一个唯一的身(敏)份(感 ...

  5. CSS学习笔记之样式声明

    目录 1.背景 2.文本 3.字体 4.列表 5.表格 6.轮廓 在这篇文章中你能看到有关于 CSS 样式设置的常用属性,文章的目录如下: 1.背景 (1)背景颜色 可以使用 background-c ...

  6. 2022-07-10 第五小组 pan小堂 css学习笔记

    css学习笔记 什么是 CSS? CSS 指的是层叠样式表* (Cascading Style Sheets) CSS 描述了如何在屏幕.纸张或其他媒体上显示 HTML 元素 CSS 节省了大量工作. ...

  7. CSS学习笔记

    CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...

  8. HTML+CSS学习笔记 (6) - 开始学习CSS

    HTML+CSS学习笔记 (6) - 开始学习CSS 认识CSS样式 CSS全称为"层叠样式表 (Cascading Style Sheets)",它主要是用于定义HTML内容在浏 ...

  9. HTML+CSS学习笔记（5）- 与浏览者交互，表单标签

    HTML+CSS学习笔记(5)- 与浏览者交互,表单标签 1.使用表单标签,与用户交互 网站怎样与用户进行交互?答案是使用HTML表单(form).表单是可以把浏览者输入的数据传送到服务器端,这样服务 ...

随机推荐

  1. idea创建Web项目（基于Maven多模块）

    简述:通常我们开发的项目结构是由多个modules项目组合而成,并且由有个parent的maven项目整体管理.废话少说,直接进入创建过程. 创建parent项目 1.打开idea工具,按照下图操作, ...

  2. SpringCloud介绍及入门一

    springcloud是什么 基于spring boot实现的服务治理工具包,管理和协微服务 把别人的东西拿来组合在一起,形成各种组件 微服务协调者[service registtry注册中心 Eur ...

  3. 【零基础】神经网络优化之dropout和梯度校验

    一.序言 dropout和L1.L2一样是一种解决过拟合的方法,梯度检验则是一种检验“反向传播”计算是否准确的方法,这里合并简单讲述,并在文末提供完整示例代码,代码中还包含了之前L2的示例,全都是在“ ...

  4. ResultMap和ResultType在使用中的区别、MyBatis中Mapper的返回值类型

    在使用mybatis进行数据库连接操作时对于SQL语句返回结果的处理通常有两种方式,一种就是resultType另一种就是resultMap,下面说下我对这两者的认识和理解 resultType:当使 ...

  5. C# 客户端网络请求 对HttpClient的封装

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/a1037949156/article/d ...

  6. oracle中的cursor

    游标是SQL的一个内存工作区,由系统或用户以变量的形式定义.游标的作用就是用于临时存储从数据库中提取的数据块.在某些情况下,需要把数据从存放在磁盘的表中调到计算机内存中进行处理,最后将处理结果显示出来 ...

  7. vue实现滚动条滚到相应高度触发动画的操作

    一.vue项目引入animate.css 第一步:在命令行中执行: npm install animate.css --save 第二步:引入及使用: main.js中: import animate ...

  8. Matrix: 利用Matrix来设置ImageView的宽高,使图片能正常显示

    在Android中加载ImageView一般都不会给ImageView的宽高设置一个确切的值,一般都是直接写成: <ImageView android:id="@+id/iv_test ...

  9. transition css3 渐变效果

    div { width:100px; transition: width 2s; -moz-transition: width 2s; /* Firefox 4 */ -webkit-transiti ...

  10. 设置滑动TabBar的显示和隐藏

    代码如下: //设置滑动的判定范围 - (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint ...