Simple Grid 布局

最新推荐文章于 2024-05-16 09:53:33 发布
最新推荐文章于 2024-05-16 09:53:33 发布
阅读量800 收藏
点赞数
分类专栏： Html5 文章标签： Html5 Grid布局
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/roamingcode/article/details/81903350
版权

Simple-Grid
html 代码

<!doctype html>

<html>

    <head>
        <title>Simple Grid</title>
        <meta charset="utf-8" />
        <link rel="stylesheet" type="text/css" href="http://thisisdallas.github.io/Simple-Grid/simpleGrid.css" />

        <style>
            .content {
                background: #ccc;
                padding: 10px;
            }
        </style>
    </head>

    <body>
        <!-- Grid 2/3 and 1/3-->
        <div class="grid grid-pad">
            <div class="col-1-1">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- Grid 1/2 -->
        <div class="grid grid-pad">
            <div class="col-1-2 mobile-col-1-2">
                <div class="content">
                </div>
            </div>
            <div class="col-1-2 mobile-col-1-2">
                <div class="content">
                </div>
            </div>

            <div class="col-1-2 mobile-col-1-1">
                <div class="content">
                </div>
            </div>
            <div class="col-1-2 mobile-col-1-2 hide-on-mobile">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- Grid 1/3 -->
        <div class="grid grid-pad">
            <div class="col-1-3 mobile-col-1-3">
                <div class="content">
                </div>
            </div>
            <div class="col-1-3 mobile-col-1-3">
                <div class="content">
                </div>
            </div>
            <div class="col-1-3 mobile-col-1-3">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- Grid 1/3 -->
        <div class="grid grid-pad">
            <div class="col-1-3 mobile-col-1-3 push-1-3">
                <div class="content">
                </div>
            </div>
            <div class="col-1-3 mobile-col-1-3 push-1-3">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- Grid 1/4 -->
        <div class="grid grid-pad">
            <div class="col-1-4">
                <div class="content">
                </div>
            </div>
            <div class="col-1-4">
                <div class="content">
                </div>
            </div>
            <div class="col-1-4 hide-on-mobile">
                <div class="content">
                </div>
            </div>
            <div class="col-1-4 hide-on-mobile">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- Grid 1/5 -->
        <div class="grid grid-pad">
            <div class="col-1-5">
                <div class="content">
                </div>
            </div>
            <div class="col-1-5">
                <div class="content">
                </div>
            </div>
            <div class="col-1-5">
                <div class="content">
                </div>
            </div>
            <div class="col-1-5">
                <div class="content">
                </div>
            </div>
            <div class="col-1-5">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- Grid 1/6 -->
        <div class="grid grid-pad">
            <div class="col-1-6">
                <div class="content">
                </div>
            </div>
            <div class="col-1-6">
                <div class="content">
                </div>
            </div>
            <div class="col-1-6">
                <div class="content">

                </div>
            </div>
            <div class="col-1-6">
                <div class="content">
                </div>
            </div>
            <div class="col-1-6">
                <div class="content">
                </div>
            </div>
            <div class="col-1-6">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- Grid 1/7 -->
        <div class="grid grid-pad">
            <div class="col-1-7">
                <div class="content">

                </div>
            </div>
            <div class="col-1-7">
                <div class="content">

                </div>
            </div>
            <div class="col-1-7">
                <div class="content">

                </div>
            </div>
            <div class="col-1-7">
                <div class="content">

                </div>
            </div>
            <div class="col-1-7">
                <div class="content">

                </div>
            </div>
            <div class="col-1-7">
                <div class="content">

                </div>
            </div>
            <div class="col-1-7">
                <div class="content">

                </div>
            </div>
        </div>
        <!-- Grid 1/8 -->
        <div class="grid grid-pad">
            <div class="col-1-8">
                <div class="content">

                </div>
            </div>
            <div class="col-1-8">
                <div class="content">

                </div>
            </div>
            <div class="col-1-8">
                <div class="content">

                </div>
            </div>
            <div class="col-1-8">
                <div class="content">

                </div>
            </div>
            <div class="col-1-8">
                <div class="content">

                </div>
            </div>
            <div class="col-1-8">
                <div class="content">

                </div>
            </div>
            <div class="col-1-8">
                <div class="content">

                </div>
            </div>
            <div class="col-1-8">
                <div class="content">

                </div>
            </div>
        </div>
        <!-- Grid 1/9 -->
        <div class="grid grid-pad">
            <div class="col-1-9">
                <div class="content">

                </div>
            </div>
            <div class="col-1-9">
                <div class="content">

                </div>
            </div>
            <div class="col-1-9">
                <div class="content">

                </div>
            </div>
            <div class="col-1-9">
                <div class="content">

                </div>
            </div>
            <div class="col-1-9">
                <div class="content">

                </div>
            </div>
            <div class="col-1-9">
                <div class="content">

                </div>
            </div>
            <div class="col-1-9">
                <div class="content">

                </div>
            </div>
            <div class="col-1-9">
                <div class="content">

                </div>
            </div>
            <div class="col-1-9">
                <div class="content">

                </div>
            </div>
        </div>
        <!-- Grid 1/10 -->
        <div class="grid grid-pad">
            <div class="col-1-10">
                <div class="content">

                </div>
            </div>
            <div class="col-1-10">
                <div class="content">

                </div>
            </div>
            <div class="col-1-10">
                <div class="content">

                </div>
            </div>
            <div class="col-1-10">
                <div class="content">

                </div>
            </div>
            <div class="col-1-10">
                <div class="content">

                </div>
            </div>
            <div class="col-1-10">
                <div class="content">

                </div>
            </div>
            <div class="col-1-10">
                <div class="content">

                </div>
            </div>
            <div class="col-1-10">
                <div class="content">

                </div>
            </div>
            <div class="col-1-10">
                <div class="content">

                </div>
            </div>
            <div class="col-1-10">
                <div class="content">

                </div>
            </div>
        </div>
        <!-- Grid 1/11 -->
        <div class="grid grid-pad">
            <div class="col-1-11">
                <div class="content">

                </div>
            </div>
            <div class="col-1-11">
                <div class="content">

                </div>
            </div>
            <div class="col-1-11">
                <div class="content">

                </div>
            </div>
            <div class="col-1-11">
                <div class="content">

                </div>
            </div>
            <div class="col-1-11">
                <div class="content">

                </div>
            </div>
            <div class="col-1-11">
                <div class="content">

                </div>
            </div>
            <div class="col-1-11">
                <div class="content">

                </div>
            </div>
            <div class="col-1-11">
                <div class="content">

                </div>
            </div>
            <div class="col-1-11">
                <div class="content">

                </div>
            </div>
            <div class="col-1-11">
                <div class="content">

                </div>
            </div>
            <div class="col-1-11">
                <div class="content">

                </div>
            </div>
        </div>
        <!-- Grid 1/12 -->
        <div class="grid grid-pad">
            <div class="col-1-12">
                <div class="content">

                </div>
            </div>
            <div class="col-1-12">
                <div class="content">

                </div>
            </div>
            <div class="col-1-12">
                <div class="content">

                </div>
            </div>
            <div class="col-1-12">
                <div class="content">

                </div>
            </div>
            <div class="col-1-12">
                <div class="content">

                </div>
            </div>
            <div class="col-1-12">
                <div class="content">

                </div>
            </div>
            <div class="col-1-12">
                <div class="content">

                </div>
            </div>
            <div class="col-1-12">
                <div class="content">

                </div>
            </div>
            <div class="col-1-12">
                <div class="content">

                </div>
            </div>
            <div class="col-1-12">
                <div class="content">

                </div>
            </div>
            <div class="col-1-12">
                <div class="content">

                </div>
            </div>
            <div class="col-1-12">
                <div class="content">

                </div>
            </div>
        </div>
        <!-- 11/12 and 1/12 layout -->
        <div class="grid grid-pad">
            <div class="col-1-12">
                <div class="content">
                </div>
            </div>
            <div class="col-11-12">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- 10/12 and 2/12 layout -->
        <div class="grid grid-pad">
            <div class="col-2-12">
                <div class="content">
                </div>
            </div>
            <div class="col-10-12">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- 9/12 and 3/12 layout -->
        <div class="grid grid-pad">
            <div class="col-3-12">
                <div class="content">
                </div>
            </div>
            <div class="col-9-12">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- 8/12 and 4/12 layout -->
        <div class="grid grid-pad">
            <div class="col-4-12">
                <div class="content">
                </div>
            </div>
            <div class="col-8-12">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- 7/12 and 5/12 layout -->
        <div class="grid grid-pad">
            <div class="col-5-12">
                <div class="content">
                </div>
            </div>
            <div class="col-7-12">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- 6/12 and 6/12 layout -->
        <div class="grid grid-pad">
            <div class="col-6-12">
                <div class="content">
                </div>
            </div>
            <div class="col-6-12">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- 7/12 and 5/12 layout -->
        <div class="grid grid-pad">
            <div class="col-7-12">
                <div class="content">
                </div>
            </div>
            <div class="col-5-12">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- 8/12 and 4/12 layout -->
        <div class="grid grid-pad">
            <div class="col-8-12">
                <div class="content">
                </div>
            </div>
            <div class="col-4-12">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- 9/12 and 3/12 layout -->
        <div class="grid grid-pad">
            <div class="col-9-12">
                <div class="content">
                </div>
            </div>
            <div class="col-3-12">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- 10/12 and 2/12 layout -->
        <div class="grid grid-pad">
            <div class="col-10-12">
                <div class="content">
                </div>
            </div>
            <div class="col-2-12">
                <div class="content">
                </div>
            </div>
        </div>
        <!-- 11/12 and 1/12 layout -->
        <div class="grid grid-pad">
            <div class="col-11-12">
                <div class="content">
                </div>
            </div>
            <div class="col-1-12">
                <div class="content">
                </div>
            </div>
        </div>
    </body>

</html>
roamingcode
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
基于Python实现的简单网格策略交易源码+使用说明.zip
11-06
【资源说明】 基于Python实现的简单网格策略交易源码+使用说明.zip 策略说明 开仓：在盘口挂出买N和卖N，当你的买单或卖单完成后，再重新开启相应的仓位，保持你始终有买N和卖N的订单。 **KuCoin**拥有**level3交易数据、强大的撮合引擎、针对api用户提供的手续费折扣**，同时提供**sandbox环境**作为数据测试支撑，帮助你规避风险。 我们仅提供一个简单且不完备的交易策略，使用时**请注意规避风险**，我们希望你能够**在sandbox环境配合其他参数或是策略进行测试调整，我们也不想你成为一个慈善家！！！ 如何使用 * 安装Python * Windows系统请前往[Python](https://www.python.org/downloads/windows/)官网自行安装，64位请选择1，32位请选择2。 <img src="./img/python_download.png" style="zoom:50%" /> * 在开始安装时请注意将以下选项勾选： <img src="./img/python_win.png" style="zoom:40%" /> * MAC OS X安装 * 打开命令终端，输入以下命令安装Homebrew（安装过程中需要输入**电脑密码**）： ```shell /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" ``` * 在命令终端输入以下命令，安装Python3： ```shell brew install python ``` * 在命令终端输入以下命令，确认是否安装成功： ```shell python3 --version ``` Mac/Linux **在项目目录下**打开命令终端： ```shell cd simple-grid ``` * 用以下命令让你的合约策略运行起来： ```shell ./simple_grid_future.py ``` * 用以下命令让你的现货策略运行起来： ```shell ./simple_grid_kucoin.py ``` * Windows **在项目目录下**打开命令终端： ```shell cd simple-grid ``` * 用以下命令让你的合约策略运行起来： ```shell py simple_grid_future.py ``` * 用以下命令让你的现货策略运行起来： ```shell py simple_grid_kucoin.py ``` 【备注】 1、该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的，请放心下载使用！ 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载使用，也适合小白学习进阶，当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行，也可在此代码基础上进行修改，以实现其他功能，也可直接用于毕设、课设、作业等。 欢迎下载，沟通交流，互相学习，共同进步！
使用gym搭建自定义（以二维迷宫为例）环境并实现强化学习 python
weixin_45928096的博客
07-12 7018
文章目录 1. 查看所有环境 Gym是一个包含各种各样强化学习仿真环境的大集合，并且封装成通用的接口暴露给用户。 2. 编写文件放置 首先找到自己的环境下面的gym环境包envs，之后我们要创建自己的myenv.py文件，确保自己创建的环境可以在gym里使用，可以进入classic_control文件新建一个myenv的文件夹。 3.注册自己的模拟器 4. 自定义环境实现 5. 测试环境 6. 自定义环境以及测试代码解释 7. gym模块中环境的常用函数 gym的初始化 gym的各个参数的获取 刷新环境..
推荐使用：Simple Grid - 轻量级响应式CSS网格系统
最新发布
gitblog_00072的博客
05-16 267
推荐使用：Simple Grid - 轻量级响应式CSS网格系统 项目地址:https://gitcode.com/zachacole/Simple-Grid 1、项目介绍 Simple Grid 是一个由Zach Cole开发的轻量级CSS网格系统，它为构建响应式的网站提供了简洁且快速的解决方案。这个项目的目标是让开发者在处理布局时更省心、更快捷。 2、项目技术分析 Simple Grid 采用...
c++ 开源grid控件
u011269801的专栏
10-02 1263
一下三种都是开源可见的 1、SimpleGrid 使用c语言写的一个控件，效果如下： 2、MfcGridCtrl 使用mfc的基础上所写，效果如下： 3、duilib中的效果
35、wxWidgets小部件之wxListBook
sq8706的专栏
08-12 337
MyGrid请参照上一章https://blog.csdn.net/sq8706/article/details/119638263 #include <wx/wx.h> #include <wx/listbook.h> #include <wx/listctrl.h> #include "mygrid.h" class Simple:public wxFrame { public: Simple(const wxString& title); ...
ExtJs中Grid的用法
zoujp_xyz的专栏
11-01 1581
<br />本文整理自：http://leadergxg.25291.84g.com/ExtJs/example/index.html<br />-----------------------------------------------------------------------------------------------------<br /> <br />/****** 简单Grid，以本地数组数据作为数据源 *******/<br />var SimpleGrid = function()
simple_grid
03-11
simple_grid 受Bootstrap的启发这是动态网格布局，可以像Bootstrap网格一样使用。 解释 您现在必须具有3个类，它们是： SpGrid是网格的容器， SpGridItem是孩子SpGrid SpGridSize是可以声明最大屏幕大小的类。 ...
SimpleGrid V2.2.1 Windows SDK C 表格控件源代码
02-06
"SimpleGrid V2.2.1 Windows SDK C 表格控件源代码"是一个专为Windows平台设计的C语言开发工具，它提供了用于创建和管理表格界面的功能。这个控件利用了Windows SDK（Software Development Kit），SDK是微软提供的...
simple-grid:一个简单的 CSS 网格系统
07-10
"Simple Grid"是一个专为简化网页布局设计而创建的CSS框架，它提供了一个直观且易于使用的网格系统，帮助开发者快速构建网页结构，无需过多的自定义代码。 Simple Grid的核心理念在于提供一个轻量级的解决方案，它...
simple-grid-用于网格布局的Vue组件，支持flex。-Vue.js开发
05-27
simple-grid一个简单的网格布局（Vue组件），安装使用npm $ npm i simple-xgrid --save import Grid from'simple-xgrid'import'simple-xgrid simple-grid一个简单的网格布局（Vue Component），安装使用npm $ npm i ...
simple-grid:一个简单的网格输出平板
06-29
1. **CSS Grid布局**: JavaScript网格系统很可能利用了CSS Grid布局，这是一种现代CSS技术，可以方便地创建二维网格，定义行和列的大小，并将内容放置在网格单元格中。CSS Grid提供了一种强大且灵活的方式来控制页面...
simpleGrid示例-人事信息管理系统
12-08
自己开发的simpleGrid表格控件，目前只是测试版本，附带一个hta应用作为示例，欢迎大家试用并提出意见。
SimpleGrid ActiveX控件
12-29
<br> SimpleGrid ActiveX控件 是一个使用简单的Active/X表格（Grid）控件，适用于Visual C++ 或 Visual Basic应用程序。有许多方法和属性可以控制表格外观，每一个单元都可以通过下拉列表或复选框选择，可以正常编辑。<br><br> SimpleGrid ActiveX控件的主要特点： 表格单元可以设置为可编辑或只读； 表格单元可以定义到内容列表，然后通过下拉列表框进行选择编辑； 表格单元可以定义到内容复选框； 表格单元可以定义到内容选择按钮； 输入单元的数据可以是整型或浮点型，而且自动有效； 当一个编辑完成时能触发一个事件，因此可以执行用户确认； 只要可编辑单元被选中就会触发一个事件，因此，如果不希望编辑这个单元，可以通过设置一个标志位来阻止编辑； 只要标题被点击就会触发一个事件； 只要按钮被点击就会触发事件，因此可以弹出内容菜单； 当在最后一行打回车键时就会自动产生新的一行，可以对新行进行数据初始化； 可以禁止或允许选中行/列/单元的可视化图标； 整个表格或单元的背景和文字颜色可设置； 象每一栏有标题一样，可以给每一行加标题，而且可以设置为只读，而其他为可编辑； 使用双缓冲来消除屏幕抖动； 表格可根据内容调整大小，也可以设置为大小固定； 表格可以自动从ADO记录，CSV文件或SAFEARRAY移植。
SimpleGrid－可拖动，可排序
12-30
一个支持ie和ff可拖动可排序的表格组件，调用相当简单.总大小7kb。很小，很强大。
simplegrid-framework:简单网格-框架是一个非常简单的响应式网格系统，可以在项目中使用。 任何样式，任何设计。 只是网格！ 网格的基础是一个容器，其宽度是台式机屏幕宽度的80％，移动版屏幕宽度的96％。 该容器分为12列。 因此，无论使用哪种设备，您的网站都将以80％或96％的比例扩大。 总是！
05-15
简单网格框架 简单网格-框架是一个非常简单的响应式网格系统，可以在项目中使用。 任何样式，任何设计。 只是网格！ 网格的基础是一个容器，其宽度是台式机屏幕宽度的80％，移动版屏幕宽度的96％。 该容器分为12列。 因此，无论使用哪种设备，您的网站都将以80％或96％的比例扩大。 总是！
SimpleGridLayout:Android Metro风格的布局
05-24
SimpleGridLayout 一种metro风格UI的实现，用起来很适合。 截图 使用方法 < com xss=removed xss=removed xss=removed xss=removed xss=removed xss=removed xss=removed>
强化学习：gym自定义可视化环境实例
BBJG_001的博客
03-12 7545
原文地址 分类目录——强化学习 先观察一下环境测试的效果 Gym环境的主要架构 查看gym.Env类的主要结构如下 其中主要会用到的是metadata、step()、reset()、render()、close() metadata：元数据，用于支持可视化的一些设定，改变渲染环境时的参数，如果不想改变设置，可以无 step()：用于编写智能体与环境交互的逻辑；它接受一个动作（acti...
强化学习环境：Gym本地库中添加自己编写的环境
热门推荐
xl.zhang的博客
03-06 1万+
1. 找到本地gym库地址下的envs目录，可能是：python3.6/site-packages/gym/envs。 envs下面有多个目录，选择一个你的环境所属的目录（不是很重要，选择相近类别即可） 2.假如我们选择的是classic_control目录，进入该目录。 3.把自己编写的环境文件（比如myenv.py）拷贝至该目录。 4.打开该目录下的__init__.py...
[译] Make your own custom environment：gym-设定自己的环境
panbaoran913的博客
10-14 583
本文档概述了为创建新环境而设计的Gym中包含的创建新环境和相关有用包装器、实用程序和测试。您可以克隆健身房示例来使用此处提供的代码。
simplegrid输入输出1 (20 分)
08-15
Simplegrid是一种用于网格布局的CSS框架，可以帮助我们快速创建响应式的网格系统。输入输出是指在使用Simplegrid时，给定一组项目，我们希望这些项目能够按照定义的网格布局进行排列和展示。 在Simplegrid中，我们...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值