css3 写网格

迈不过友情╰ 2023-02-11 10:28 35阅读 0赞

<style type="text/css">
    .stripe{ 
         width: 620px;
        height: 450px;
        margin: 50px;
        background: linear-gradient(90deg,rgba(200,0,0,1) 20%,transparent 0), linear-gradient(rgba(255, 0, 0, 1) 20%,transparent 0);
        background-size: 1px 49px;
    }
    </style>
    <div class="stripe"></div>

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI1NzQxMDcx_size_16_color_FFFFFF_t_70]

<div class="stripe"></div>
    <style type="text/css">
    .stripe{ 
      width: 250px;
      height: 150px;
      margin: 50px;
      background: linear-gradient(90deg,rgba(200,0,0,.5) 50%,transparent 0),
                  linear-gradient(rgba(200,0,0,.5) 50%,transparent 0);
      background-size: 30px 30px;
    }
    </style>

![在这里插入图片描述][20200523125444207.png]

在这里插入代码片

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI1NzQxMDcx_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200523125223237.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI1NzQxMDcx,size_16,color_FFFFFF,t_70
[20200523125444207.png]: https://img-blog.csdnimg.cn/20200523125444207.png

发表评论取消回复

表情：

评论列表（有 0 条评论，35人围观）

还没有评论，来说两句吧...

相关阅读

相关【前端】CSS-Grid网格布局

目录一、grid布局是什么二、grid布局的属性三、容器属性 1、display ①、语句

我会带着你远行/ 2023年10月15日 15:56/ 0 赞/ 99 阅读

相关 CSS - 网格布局（grid）

目录什么是网格布局网格布局与弹性布局的比较网格布局中的概念名词网格容器 display:grid、display:inline-grid 网格轨道 grid-

川长思鸟来/ 2023年09月28日 14:17/ 0 赞/ 4 阅读

相关 css网格_CSS网格容器

css网格 CSS | 网格容器 (CSS | Grid Containers) There are numerous ways to display our list

淩亂°似流年/ 2023年03月05日 09:47/ 0 赞/ 303 阅读

相关 css3 写网格

<style type="text/css"> .stripe{ width: 620px; height: 450px;

迈不过友情╰/ 2023年02月11日 10:28/ 0 赞/ 36 阅读

相关 css 网格布局_CSS网格布局：Fr单元

css 网格布局介绍 (Introduction) With CSS Grid Layout, we get a new flexible unit: the Fr

短命女/ 2022年12月07日 11:53/ 0 赞/ 300 阅读

相关 css 网格布局_使用CSS网格创建布局

css 网格布局 The following introduction to CSS Grid is an extract from Tiffany’s book, [CSS

今天药忘吃喽~/ 2022年12月03日 09:21/ 0 赞/ 61 阅读

相关 css 网格布局_CSS网格布局与CSS框架辩论

css 网格布局 With cutting-edge CSS standards like [CSS Grid Layout][] and [Flexbox][], codi

女爷i/ 2022年12月03日 01:43/ 0 赞/ 316 阅读

相关 CSS display:grid 网格布局

主要属性： grid-template-columns：//竖向排列 grid-template-rows：//横向排列 Grid 布局与 Flex 布局有一定的相似

Love The Way You Lie/ 2022年11月26日 01:44/ 0 赞/ 324 阅读

相关 CSS3创意菱形网格小说推荐js特效

[下载地址][Link 1] CSS3创意菱形网格小说推荐特效是一款非常有创意的图片网格布局特效，鼠标悬停图片倾斜显示。 ![20744469e1374a391207f71

ゝ一世哀愁。/ 2022年09月17日 01:55/ 0 赞/ 258 阅读

相关 css grid网格布局

初次认识grid布局，看了官方的文档也很明了（[官方文档][Link 1]），然后通过自己的语言和理解，重新对他进行了总结。 > 摘要：网格布局是网站设计的基础，CSS网格模

比眉伴天荒/ 2022年01月12日 07:07/ 0 赞/ 441 阅读