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. bootstrap——辅助类和响应式工具类

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

  2. C# 串口导致电脑蓝屏一个可能的原因

    在某些win7电脑上, 如果使用SerialPort对象的Read(byte[] buffer, int offset, int count)方法读取端口数据时, 若端口接受缓存区的数据少于count ...

  3. thinkphp中AJAX返回ajaxReturn()方法分析

    本文分析了thinkphp中AJAX返回ajaxReturn()方法.分享给大家供大家参考,具体如下: 系统支持任何的AJAX类库,Action类提供了ajaxReturn方法用于AJAX调用后返回数 ...

  4. 练习|Django-多表

    models.py from django.db import models # Create your models here. class Author(models.Model): nid = ...

  5. Unity 脚本中的主要函数的 执行顺序及其介绍

    Awake ->OnEable-> Start -> FixedUpdate-> Update  -> LateUpdate ->OnGUI ->OnDisa ...

  6. 树莓派(Raspbian系统)中使用pyinstaller封装Python代码为可执行程序

    一.前言 将做好的Python软件运行在树莓派上时,不想公开源码,就需要对文件进行封装(或称打包),本文主要介绍使用pyinstaller封装Python代码为可执行程序. Python是一个脚本语言 ...

  7. IdentityServer4-EF动态配置Client和对Claims授权(二)

    本节介绍Client的ClientCredentials客户端模式,先看下画的草图: 一.在Server上添加动态新增Client的API 接口. 为了方便测试,在Server服务端中先添加swagg ...

  8. jackson实现java对象转支付宝/微信模板消息

    一.支付宝消息模板大致长这样 { "to_user_id": "", "telephone": "xxxxx", &qu ...

  9. Java中设置方法执行的超时时间java.util.concurrent.Future

    java.util.concurrent.Future Future代表一个异步计算的结果.它提供了方法来检查是否计算已经完成,还是正在计算而处于等待状态,并且也提供了获取计算结果 方法.当计算完成后 ...

  10. 软工实践第五次作业-WordCount进阶需求

    软工实践作业(五) GitHub 作业链接 结对博客 031602240 具体分工 PSP表格 代码规范 解题思路与设计说明 爬虫使用 代码组织与内部实现设计(类图) 算法关键 实现方法 流程图 附加 ...