Grid有三个参数

目前介绍以下两种:grid、inline-grid

<view class="grid">
<view class='grid-row'>1</view>
<view class='grid-row'>2</view>
<view class='grid-row'>3</view>
</view>
page {
color: #fff;
} .grid {
line-height: 50px;
display: grid;
grid-gap: 1px;
} .grid-row {
text-align: center;
background-color: #d94a6a;
}

grid是根据内容来收缩的,你可以试试在子元素使用内边距(padding) 或者 外边距(margin)

inline-grid和inline-block会有什么联系呢?

inline-block可以设置宽高,且为行内块

grid - 初识的更多相关文章

  1. WPF学习之路初识

    WPF学习之路初识   WPF 介绍 .NET Framework 4 .NET Framework 3.5 .NET Framework 3.0 Windows Presentation Found ...

  2. 初识Matplotlib-01

    初识数据分析 大数据是一个含义广泛的术语,是指数据集,如此庞大而复杂的,他们需要专门设计的硬件和软件工具进行处理.该数据集通常是万亿或EB的大小.这些数据集收集自各种各样的来源:传感器,气候信息,公开 ...

  3. ExtJS 4.2 Grid组件的单元格合并

    ExtJS 4.2 Grid组件本身并没有提供单元格合并功能,需要自己实现这个功能. 目录 1. 原理 2. 多列合并 3. 代码与在线演示 1. 原理 1.1 HTML代码分析 首先创建一个Grid ...

  4. WPF中Grid实现网格,表格样式通用类

    /// <summary> /// 给Grid添加边框线 /// </summary> /// <param name="grid"></ ...

  5. Android动画效果之初识Property Animation(属性动画)

    前言: 前面两篇介绍了Android的Tween Animation(补间动画) Android动画效果之Tween Animation(补间动画).Frame Animation(逐帧动画)Andr ...

  6. 在 Windows Phone 中,为 Grid 添加 Tilt 效果

    在 Windows Phone 中,Tilt 效果是比较经典的效果,我们可以很简单的为按钮等控件添加这样的效果(使用 Windows Phone Toolkit 的Tilt 效果),但是,如果我们想要 ...

  7. 初识Hadoop

    第一部分:              初识Hadoop 一.             谁说大象不能跳舞 业务数据越来越多,用关系型数据库来存储和处理数据越来越感觉吃力,一个查询或者一个导出,要执行很长 ...

  8. wpf 列表、菜单 收起与展开,通过Grid DoubleAnimation或者Expander实现

    菜单收缩有很多种方法具体如何实现还是看个人想法: 第一种通过后台控制收起与展开: 效果图: 代码 : <Grid> <Grid.ColumnDefinitions> <C ...

  9. python学习笔记(基础四:模块初识、pyc和PyCodeObject是什么)

    一.模块初识(一) 模块,也叫库.库有标准库第三方库. 注意事项:文件名不能和导入的模块名相同 1. sys模块 import sys print(sys.path) #打印环境变量 print(sy ...

随机推荐

  1. 【C++ Primer 第10章】 10.4.1 插入迭代器

    目录 •  iostream迭代器 •  反向迭代器 插入迭代器 插入迭代器,这些迭代器被绑定到一个容器上,可以向容器插入元素. 头文件为:#include<iterator it=t 在it指 ...

  2. Windows10 Compatibility Telemetry(CompatTelRunner.exe) 占用硬盘100%

    相信很多人跟我一样总被Compatibility Telemetry(CompatTelRunner.exe) 占用硬盘100%困扰,Compatibility Telemetry翻译过来就是“微软兼 ...

  3. 如何将自己的Image镜像Push到Docker Hub

    首先需要一个docker官方账号 这里我添加了一个AspNetCore程序 通过创建了一个镜像(前面提过使用Dockerfile处理了) docker build -t dockertest . 首先 ...

  4. Codeforces Round #341 (Div. 2) E - Wet Shark and Blocks

    题目大意:有m (m<=1e9) 个相同的块,每个块里边有n个数,每个数的范围是1-9,从每个块里边取出来一个数组成一个数,让你求组成的方案中 被x取模后,值为k的方案数.(1<=k< ...

  5. Linux 编译安装R语言

    一.安装依赖包 yum install -y gcc gcc-gfortran glibc-headers readline-devel libXt-devel gcc-c++ xz-devel.x8 ...

  6. 【noip模拟赛10】奇怪的贸易 高精度

    描述 刚结束了CS战斗的小D又进入了EVE的游戏世界,在游戏中小D是一名商人,每天要做的事情就是在这里买东西,再运到那里去卖.这次小D来到了陌生的X星,X星上有n种货物,小D决定每种都买走一些,他用a ...

  7. 【Java】 剑指offer(28) 对称的二叉树

    本文参考自<剑指offer>一书,代码采用Java语言. 更多:<剑指Offer>Java实现合集   题目 请实现一个函数,用来判断一棵二叉树是不是对称的.如果一棵二叉树和它 ...

  8. AngularJS移动端页面input无法输入

    用angularJS写手机页面,有时候会发现input输入框点击了却不能输入,或者长按才能输入,可能是因为input绑定了ng-click导致,可去掉ng-click,将ng-click绑定的方法改用 ...

  9. Nginx 部署、反向代理配置、负载均衡

    Nginx 部署.反向代理配置.负载均衡 最近我们的angular项目部署,我们采用的的是Nginx,下面对Nginx做一个简单的介绍. 为什么选择Nginx 轻:相比于Apache,同样的web服务 ...

  10. 使用tortoisegit简化命令

    1. 如果希望git保存用户名和密码,后续操作都无需输入密码: git命令: git config --global credential.helper store   或者通过tortoisegit ...