CSS布局

最新推荐文章于 2024-08-26 08:04:31 发布
最新推荐文章于 2024-08-26 08:04:31 发布
阅读量123 收藏
点赞数
分类专栏： css html 学习 文章标签： css html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44303404/article/details/106427520
版权
css 同时被 3 个专栏收录
12 篇文章 0 订阅
订阅专栏
html
5 篇文章 0 订阅
订阅专栏
学习
5 篇文章 0 订阅
订阅专栏

CSS布局学习笔记

1.绝对定位
属性：position 值：absolute
通过制定left，top绝对定位一个元素。
（1）设置了绝对定位的元素，相当于该元素被从原文档中删除了。

<style>
    p.abs{
      position: absolute;
      left: 150px;
      top: 50px;
    }
     
    </style>
     
    <p >正常文字1</p>
    <p >正常文字2</p>
    <p class="abs" >绝对定位的文字3</p>
    <p >正常文字4</p>
    <p >正常文字5</p>

（2）绝对定位是基于最近的一个绝对定位了的父容器。
实例代码：

<style>
    p.abs{
      position: absolute;
      left: 100px;
      top: 50px;
    }
    .absdiv{
      position: absolute;
      left: 150px;
      top: 50px;
      width:215px;
      border: 1px solid blue;
    }
    </style>
     
    <div>
    <p >正常文字a</p>
    <p >正常文字b</p>
    <p >正常文字c</p>
    <p >正常文字d</p>
    <p >正常文字e</p>
    <p >正常文字f</p>
    <p >正常文字g</p>
    </div>
     
    <div class="absdiv">
    这是一个定位了的div
    <p class="abs" >绝对定位的文字</p>
    </div>

（3）通过绝对定位可以把一个元素放在另一个元素上，这样位置就重复了。重复了，就存在一个谁掩盖谁的问题。 这个时候就可以使z-index属性， 当z-index的值越大，就表示放上面，z-index:越小就表示放下面。（有一种层次之间的关系。）

<style>
    img#i1{
      position: absolute;
      left: 60px;
      top: 20px;
      z-index:1;
    }
       
      img#i2{
      position: absolute;
      left: 60px;
      top: 120px;
      z-index:-1;
    }
      
    </style>
      
    <div>
    <p >正常文字a</p>
    <p >正常文字b</p>
    <p >正常文字c</p>
    <p >正常文字d</p>
    <p >正常文字e</p>
    <p >正常文字f</p>
    <p >正常文字g</p>
    </div>
     
    <img id="i1" src="https://how2j.cn/example.gif" />
    <img id="i2" src="https://how2j.cn/example.gif" />

2.相对定位
属性：position 值：relative
与绝对定位不同的是，相对定位不会把该元素从原文档删除掉，而是在原文档的位置的基础上，移动一定的距离。

<style>
    p.r{
      position: relative;
      left: 150px;
      top: 50px;
    }
      
    </style>
      
    <p >正常文字1</p>
    <p >正常文字2</p>
    <p class="r" >相对定位的文字3</p>
    <p >正常文字4</p>
    <p >正常文字5</p>

讲一个有趣的事情：
在这里插入图片描述
这是一个小练习。练习代码如下：

<!-- 相对定位和绝对定位的练习。 -->
<style>
    p.abs{
        position: absolute;
        top: 67px;
    }

    p.rel{
        position: relative;
        left: 150px;
    }
</style>

<p >正常文字1</p>
<p >正常文字2</p>
<!-- 相对定位文字3相对于本来的位置定位，向右平移150px单位 -->
<p class="rel">相对定位文字3</p>
<!-- 正常文字4相对于body定位，因为上面没有一个是已经绝对定义的。 -->
<p class="abs" >正常文字4</p>
<p >正常文字5</p>

3.浮动
浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。
属性：float 值： left,right

（1）文字向右浮动：浮动后，坑位让出来，并且是在原来的高度的基础上，向右浮动。

<style>
  .f{
    float: right;
  }
</style>

<div>正常文字1</div>
<div>正常文字2</div>
<div class="f">向右浮动的文字</div>
<div>正常文字4</div>
<div>正常文字5</div>

在这里插入图片描述
（2）文字向左浮动：向左浮动后，会把“坑”让出来，这个时候"正常的文字4“ 就会过来试图占这个坑，但是，发现 “浮动的文字”并没有走，结果，就只好排在它后面了。

<style>
  .f{
    float:left;
  }
   
  </style>
   
  <div >正常文字1</div>
  <div >正常文字2</div>
  <div class="f">浮动的文字</div>
  <div >正常文字4</div>
  <div >正常文字5</div>

在这里插入图片描述
（3）图片浮动
当图片不浮动时，文字就会换行出现在下面；当图片浮动时，文字围绕着图片。和步骤2一样，当图片浮动的时候，就会让出这个“坑”出来，这个时候文字就试图去填补这个“坑”。
实例代码：

<style>
  .f{
    float:left;
  }
  
  div{
    width:320px;
  }
  </style>
  
  <div >
   <img src="https://how2j.cn/example.gif"/>
  
  <p>  当图片不浮动时，文字就会换行出现在下面
    当图片不浮动时，文字就会换行出现在下面
    当图片不浮动时，文字就会换行出现在下面
    当图片不浮动时，文字就会换行出现在下面
    当图片不浮动时，文字就会换行出现在下面
    当图片不浮动时，文字就会换行出现在下面
  </p>
  </div>
  
  <div >
   <img  class="f" src="https://how2j.cn/example.gif"/>
  
  <p>  当图片浮动时，文字围绕着图片
   当图片浮动时，文字围绕着图片
   当图片浮动时，文字围绕着图片
   当图片浮动时，文字围绕着图片
   当图片浮动时，文字围绕着图片
  </p>
  </div>

（4）文字不想围绕图片
不允许出现浮动元素。
属性:clear 值: left right both none
如果p左边出现了浮动的元素，如此例，则设置clear:left 即达到不允许浮动元素出现在左边的效果。
实例代码：

<style>
  .f{
    float:left;
  }
   
  div{
    width:320px;
  }
   
  .clearp{
    clear:left;
  }
   
  </style>
   
  <div >
   <img  class="f" src="https://how2j.cn/example.gif"/>
   
  <p>  当图片浮动时，文字围绕着图片
   当图片浮动时，文字围绕着图片
   当图片浮动时，文字围绕着图片
   当图片浮动时，文字围绕着图片
   当图片浮动时，文字围绕着图片
  </p>
  </div>
   
  <div >
  <img  class="f" src="https://how2j.cn/example.gif"/>
   
  <p class="clearp">  当图片浮动时，文字却不想围绕图片
  当图片浮动时，文字却不想围绕图片
  当图片浮动时，文字却不想围绕图片
  当图片浮动时，文字却不想围绕图片
   
  </p>
  </div>

在这里插入图片描述

（5）默认的div排列是会换行的，如果使用float就可以达到水平排列的效果，通常会用在菜单，导航栏等地方。如果超出了父容器，还会有自动换行的效果。

<style>
  div#floatingDiv{
    width:200px;
  }
  div#floatingDiv div{
     float:left;
  }
  </style>
  默认的div排列是会换行的
   
   <div>菜单1</div>
   <div>菜单2</div>
   <div>菜单3</div>
   
  如果使用float就可以达到水平排列的效果，通常会用在菜单，导航栏等地方
   
  如果超出了父容器，还会有自动换行的效果
   
  <div id="floatingDiv">
   <div>菜单1</div>
   <div>菜单2</div>
   <div>菜单3</div>
   <div>菜单4</div>
   <div>菜单5</div>
   <div>菜单6</div>
  </div>

4.显示方式
元素的display显示方式有多种，隐藏、块级、内联、内联-块级。
常用的有四种：
display:none 隐藏 示例代码
display:block 块级 示例代码
display:inline 内联 示例代码
display:inline-block 内联-块级

（1）display:none; 使得被选择的元素隐藏，并且不占用原来的位置。

（2）display:block; 表示块级元素
块级元素会自动换行，其上的width和height也能够生效。

<style>
  div,span{
     border: 1px solid lightgray;
     margin:10px;
     width:200px;
     height:100px;
  }
   
  .d{
    display:block;
  }
  </style>
    
  <div>普通的div块</div>
  <span>这是普通span</span> <span>这是普通span</span> <span>这是普通span</span>
  <span class="d">这是span,被改造成了块级元素</span>

效果如下：
在这里插入图片描述
备注：此处span块的width和height属性跟随div的变化。
也可以单独设置style属性。

span{
    width: 400px;
    height: 200px;
  }

当使用block时，该代码段有效。

（3）内联元素
display:inline; 表示内联元素
内联元素前后没有换行，并且在其上的width和height也无效。 其大小由其中的内容决定。

<style>
  div,span{
     border: 1px solid lightgray;
     margin:10px;
     width:200px;
     height:100px;
  }
   
  .s{
    display:inline;
  }
  </style>
   
  <span>这是普通span</span> <span>这是普通span</span> <span>这是普通span</span>
    
  <div class="s">这是div，被改造成了内联元素</div>

在这里插入图片描述
（4）内联-块级
内联是不换行，但是不能指定大小；块级时能指定大小，但是会换行。

有时候，需要元素处于同一行，同时还能指定大小，这个时候，就需要用到内联-块级 inline-block。对内联元素or外联元素都能改造。

<style>
  span{
     display:inline-block;
     border: 1px solid lightgray;
     margin:10px;
     width:100px;
  }
  </style>
  像这样 ，每个都能设置宽度 ，同时还能在同一行。
  <br>
   
  <span>盖伦</span>
  <span>蒙多医生</span>
  <span>奈德丽</span>
  <span>蒸汽机器人</span>

在这里插入图片描述
（5）其他
其他的显示方式像
list-item 显示为列表
table 显示为表格
inline-table 显示为前后无换行的表格
table-cell 显示为单元格

5.元素居中

<style>
  div{
     border: solid 1px lightgray;
     /* 设置外边距10px */
     margin: 10px;
  }
  span{
     border: solid 1px lightskyblue;
  }
</style>
<div> 默认情况下div会占用100%的宽度,所以无法观察元素是否居中</div>
 
<div style="width:300px;margin:0 auto">
  设置本div的宽度，然后再使用样式 margin: 0 auto来使得元素居中</div>
 
<span style="width:300px;margin:0 auto">
  span 是内联元素，无法设置宽度，所以不能通过margin:0 auto居中</span>
 
<div style="text-align:center">
  <span>span的居中可以通过放置在div中，然后让div text-align实现居中</span>
</div>

在这里插入图片描述
一个小疑问：底部居中怎么实现？

<style>
  div{
    background-color: tan;
    width: 98%;
    text-align: center;
    padding-top: 30px;
    padding-bottom: 30px ;
  }
  div.buttom{
    position:absolute;
    bottom: 10px;
  }
  span.special{
    margin-right: 100px;
  }
</style>

<div class="buttom">
  <span class="special">
    <a href="">公司简介</a>
  </span>
  <span class="special">
    <a href="">公司动态</a>
  </span>
  <span class="special">
    <a href="">产品介绍</a>
  </span class="special">
  <span class="special">
    <a href="">联系我们</a>
  </span>
  <span>
    <a href="">关于我们</a>
  </span>
</div>

6.左侧固定

<style>
    .left{
      width:200px;
      float:left;
      background-color:pink
     }
     .right{
       overflow:hidden;
       background-color:lightskyblue;
     }
   </style>
    
   <div class="left">左边固定宽度</div>
    
   <div class="right">右边自动填满</div>

右边自动填满，宽度根据窗口大小自己调整。
在这里插入图片描述
设置右边的高度为200px，如下：

<style>
    .left{
      width:200px;
      float:left;
      background-color:pink
     }
     .right{
       overflow:hidden;
       background-color:lightskyblue;
     }
   </style>
    
   <div class="left">左边固定宽度</div>
    
   <div class="right" style="height: 100px;">右边自动填满</div>

在这里插入图片描述
将overflow一行注释掉，得到：

<style>
    .left{
      width:200px;
      float:left;
      background-color:pink
     }
     .right{
       /* overflow:hidden; */
       background-color:lightskyblue;
     }
   </style>
    
   <div class="left">左边固定宽度</div>
    
   <div class="right" style="height: 100px;">右边自动填满</div>

在这里插入图片描述
感受一下对比和效果。
overflow:hidden的作用并不是刚好补满剩下的，把这个去掉，也可以观察到补满剩下的效果。 补满剩下效果是float:left做到的，.right会自动补满剩下的。

关于overflow的更多内容

overflow的作用：溢出隐藏、清除浮动、解决外边距塌陷等等。

7.垂直居中
（1）单独一行垂直居中：line-height

<style>
    #d {
    line-height: 100px;
    }
    div{
      border:solid 1px lightskyblue;
    }
    </style>
     
    <div id="d">line-height 适合单独一行垂直居中</div>

（2）多行居中：借助设置相同的上下内边距，实现垂直居中效果，可以用在多行文本上。

<style>
    #d {
        padding: 30 0;
    }
    div{
        border:solid 1px lightskyblue;
    }
    </style>
     
    <div id="d">多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容 多行内容  </div>

（3）display:table-cell
首先通过display: table-cell;把div用单元格的形式显示，然后借用单元格的垂直居中vertical-align: middle; 来达到效果。
这样对图片也可以居中，上一步 line-height就不能对图片居中。

<style>
    div{
        display: table-cell;
        height: 200px;
        vertical-align: middle;
        border: skyblue solid 1px;
        /* margin-right: 10px; */
    }
</style>

<div>div板块1</div>
<div>div板块2</div>

在这里插入图片描述
备注：当修改了display：table-cell。就不能设置margin属性了。

8.左右固定，中间自适应布局

<style>
    .left{
      width:200px;
      float:left;
      background-color:pink
     }
     .right{
      width:200px;
      float:right;
      background-color:pink
     }
     .center {margin:0 200px;   background-color:lightblue}
   </style>
     
   <div class="left">左边固定宽度</div>
   <div class="right">左边固定宽度</div>
    <div class="center">中间自适应</div>
    
   </head>
    
   <body>
    
   </html>

备注：margin:0 200px和overflow:hidden可以达到相同的效果。

<style>
    .left{
        float: left;
        background-color: skyblue;
        width: 200px;
    }
    .right{
        /* 这里不设置宽度 */
        float: right;
        background-color: skyblue;
    }
    .center{
        overflow: hidden;
        background-color: tan;
    }
</style>

<div class="left">这是左边的空间</div>
<div class="right">这是右边的空间</div>
<div class="center">这是中间的空间</div>

同时，注意left，right，center的顺序。如果按照左中右的顺序，不能达到预期的效果。

因为浏览器解析的顺序会影响显示效果。

如果按左右中的顺序，浏览器会先把左右两个float的元素渲染出来，这两个元素是浮动的 不占空间，因此后面的center元素会放到上面的位置上，而居中是由margin设置的。

如果按左中右的顺序，浏览器先解析左边的float元素且不占空间，然后解析center时当做div解析，因为div是块级元素，所以会补足剩下的行，而后来的右float元素在这一行中没有空间了，只能挤到下一行了。

9.一个div始终贴在下方
首先把蓝色div设置为相对定位，然后把内部的绿色div设置为绝对定位， bottom: 0表示贴在下面。如果不把div设置为相对定位，效果不一样。

<style>
    #div1{
            position: relative;
            height: 300px;
            width: 90%;
            background-color: skyblue;
    }
    #div2{
            position: absolute;
            bottom: 0;
            height: 30px;
            width: 100%;
            background-color: lightgreen;
    }
</style>
     
<div id="div1">
    <div id="div2"> 无论蓝色div高度如何变化，绿色div都会贴在下面</div>
</div>

外层div相对定位： 因为内层div视它为父元素。 而它相对定位后别人还能占坑。
内层绝对定位：保证一直在外层的底部，而不是想对他自身。
子绝父相。

10.span之间存在空格，用float解决。

<style>
    span.solve{
        float: left;
    }
</style>

多个span块连续编写不会出现空格:
<span>没有空格的span</span><span>没有空格的span</span><span>没有空格的span</span>
<br>
<br>多个span块回车编写会出现空格：
<span>有空格的span</span>
<span>有空格的span</span>
<span>有空格的span</span>
<br>
<br>用float来解决空格的问题：
<span class="solve">没有空格的span</span>
<span class="solve">没有空格的span</span>
<span class="solve">没有空格的span</span>
<br>
<br>最后要记得清除浮动保持下面的内容不重复在一起。
<div style="clear: both;color: grean;"></div>
<div>后续内容</div>

一个空白的div块不会占空间。因此

<div style="clear: both;color: grean;"></div>

不会占据一行的空间。

yanwuhc
关注
专栏目录
css布局的特点,DIV+CSS布局标准优点解析
weixin_36452281的博客
08-04 1281
你对DIV+CSS布局标准是否熟悉，这里向大家描述一下DIV+CSS布局标准的优点，比如所它可以大大缩减页面代码，提高页面浏览速度,缩减带宽成本；缩短改版时间；使得CSS代码编写更方便等。DIV+CSS布局标准的优点业界越来越关注DIV+CSS的标准化设计，大到各大门户网站，小到不计其数的个人网站，在DIV+CSS标准化的影响下，网页设计人员已经把这一要求作为行业标准。那么什么是DIV+CSS标准...
DIV+CSS布局
XUYIGE的博客
11-13 1919
DIV+CSS布局方法 DIV+CSS的网页标准化设计是web标准中的一种新的布局方式，正逐渐代替传统的表格（Table）布局。尤其适合内容信息量大、板块多且经常进行版面更新的大型门户网站使用。DIV+CSS构建网页，采用层（DIV）布局，并且使用层叠样式表（CSS）来实现页面的外观，给网站浏览者更好的体验。 DIV+CSS布局的优势： 1、表现和内容分离，便于站点重构页面 DIV+CSS模式具有...
如何解决CSS布局错乱问题：从浮动到Flexbox
最新发布
官方推荐
08-26 7788
如何解决CSS布局错乱问题：从浮动到Flexbox
DIV＋CSS布局
zg0601的博客
10-17 1万+
DIV+CSS布局
css 布局的几种方式
热门推荐
zhang6223284的博客
08-21 6万+
前言 1 table 布局 2 flex 布局 2.1 盒模型 2.2 display / poistion 2.3 flexbox 布局 3 float 布局 前言 CSS 的布局应该是 CSS 体系中的重中之重了，主要的布局方式有 table 表格布局（早期），float 浮动布局和 flex 布局，还有针对于移动端的响应式布局，不论是工作还是面试都是非常重要的知识...
前端练习-CSS布局
qq_42385482的博客
02-08 2177
前端练习-CSS布局 文章目录前端练习-CSS布局在线练习一、盒模型CSS1 盒模型 - content-boxCSS2 盒模型 - border-boxCSS3 盒模型- 外边距折叠二、浮动CSS4 浮动CSS5 浮动 - 清除三、定位CSS7 定位 - inheritCSS8 定位 - absoluteCSS9 定位 - absolute - 评注CSS10 定位 - z-indexCSS11 定位 - relativeCSS12 定位 - fixedCSS13 定位 - fixed - 广告四、dis
html+css布局
sh2001824的博客
07-26 2907
布局
div+css布局
qq_62898618的博客
01-08 3377
1. position属性：用于定义一个元素是否：absolute（绝对），relative（相对），static（静态），或者fixed（固定） 1.1 absolute:绝对定位，距top和left的距离，一般与js结合使用，比如页面漂浮的广告。 1.2 relative：相对定位，指的是相对自己默认的位置。 1.3 static：默认 1.4 fixed：固定 2. z-index属性：决定层的先后顺序和覆盖关系，值高的元素会覆盖值比较低的元素 ...
前端面试题之CSS布局问题
Jet_Lover的博客
04-12 2万+
前端CSS布局问题垂直居中DIV两栏布局左边固定右边自适应三栏布局左右固定中自适应 垂直居中DIV HTML部分 <div class="father"> <div class="son">我是垂直居中的div</div> </div> 这里简单给出几种 1.绝对定位（盒子宽高已知） .father { position: relative; width: 500
移动端css布局大全
weixin_43465508的博客
04-06 1439
（建议用body作为主盒子，从这个开始以下的代码多套了一个盒子，因为多了一层dom，会影响性能，如果不注重性能，就用从这个代码之后的代码，如果考虑性能，自行改成上面这种就可以，自己去掉一层盒子就OK了）设置display：table；第一种：display：flex，外边距自动填充margin：auto;设置成三行三列就ok，具体怎么写，看心情就好。第二种：display: flex;第一种：display: flex;第二种：display: flex;
高效学习CSS布局之道
11-26
高效学习CSS布局之道：通过244个范例掌握网页样式与布局技术
div+css布局大全
03-22
下面，我们将深入探讨div+css布局的相关知识点。 1. **Div元素**：HTML中的`<div>`（division）元素是一个通用容器，用于组合HTML元素，为页面提供结构。通过设置`<div>`的类或ID属性，我们可以对多个元素进行分组...
Div_CSS.rar_DIV css布局_css大全_css布局
09-23
**Div+CSS布局详解** Div（Division）+CSS（Cascading Style Sheets）布局是网页设计中的核心概念，它能够帮助开发者实现灵活、高效的页面结构和样式控制。本资料包包含"Div_CSS.pdf"，是一份全面的学习Div+CSS布局...
DIV+CSS布局基本流程及实例介绍
01-20
都说用DIV+CSS布局来设计网站便于优化，容易被收录，那么你对DIV+CSS布局的用法是否了解？CSS布局是网页html通过DIV标签+CSS样式表代码开发制作的（html）网页的统称。DIV+CSS布局是现在非常流行的布局方法，替代了...
Vue | 带有左右点击按钮可控制滑动的列表
weixin_44303404的博客
04-03 9465
效果 功能点 大概有如下两个功能点： 列表横向排列 点击左右两个按钮可以左右移动每个item（附加动画） 思路 列表横向排列可以使用flex布局解决，主要逻辑在左右滑动的控制上面。 在样式上来看，左右滑动其实可以看成：改变position为relative时属性left值。 具体分析如下： 如上图，蓝色为外层div，红色为内层div。 内层div装有列表的各项item，所以它的宽度可能会大于外层div的宽度。外层div采用定宽，同时设置overflow: hidden，使内层div突出的部分隐藏起来
关于修改ant-design-vue组件样式的问题
weixin_44303404的博客
03-13 2574
今天写代码的时候遇到要覆盖ant-design-vue组件的样式问题，做个笔记。 如下有个html结构，应用了antdv的一些相关组件。 <div class="middle"> <a-menu v-model="current" mode="horizontal"> <a-menu-item key="releaseTask" @click="changeTag('hall-index')"> <rout
flex布局常用属性
weixin_44303404的博客
12-27 1136
flex布局 flex布局是一种相对简单，但实现效率高的布局。相比于传统布局，flex布局有高度自适应、操作方便、布局极为简单的特点。一般会使用在移动端以及不考虑兼容性的网页端上面。 传统布局和flex布局的区别： 传统布局：兼容性好、布局繁琐、局限性，不能在移动端很好的布局。 flex布局：高度自适应、操作方便、布局极为简单、移动端应用很广泛、PC端浏览器支持情况比较差、IE 11或者更低的版本，不支持或者仅仅部分支持。 flex布局原理 flex布局：flexible Box的缩写，意为弹性布局，任何一
CSS手写一个时间轴组件(Vue)
weixin_44303404的博客
04-11 1116
效果 分析 每一个时间轴块为一个整体，如下图： 将这个整体分为几部分：左边小圆点node、左边时间线line、右边title、右边内容content。 这样一来，可以将这个整体分成左右两部分。 左边部分的小圆点可以用一个div元素设置border-radis:50%来实现，下面的线实际上是一个空div增加了边框是属性。右边部分从上往下书写就好。 左边的两个部分可以用position:relative进行定位。 为了让组件可以跟随content的内容变化而变化，不设置height属性，直接默认auto就好
CSS布局大全：掌握纯CSS布局的秘诀
CSS布局大全 CSS布局大全是一本详细介绍CSS布局的电子书籍，从HTML结构化到CSS布局的实现，都被涵盖在内。本书的主要内容包括HTML结构化、CSS布局入门、CSS选择器、CSS布局技巧等。 一、HTML结构化 在学习CSS布局...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值