- 博客(4)
- 收藏
- 关注
RSS订阅原创 双飞翼布局详解
作用：圣杯布局和双飞翼布局解决的问题是相同的，就是两边顶宽，中间自适应的三栏布局，中间栏要在放在文档流前面以优先渲染。原理：双飞翼布局为了让中间div内容不被遮挡，直接在中间div内部创建子div用于放置内容，在该div里用margin-left和margin-right为左右两栏div留出位置。css代码：.header,.footer{ height: 200px; width: 100%; background-color: #0000FF; }
2022-03-21 22:52:55
6258
4
原创 圣杯布局详解
作用：圣杯布局和双飞翼布局解决的问题是相同的，就是两边顶宽，中间自适应的三栏布局，中间栏要在放在文档流前面以优先渲染。原理：圣杯布局为了让中间div内容不被遮挡，将中间div设置了padding-left和padding-right后，将左右两个div用margin和相对定位布局，position: relative并分别配合right和left属性，以便左右两栏div移动后不遮挡中间div。css代码：.header,.footer{ height: 200px;
2022-03-21 22:38:16
2928
1
原创 边框制作三角形
代码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> div{ width: 0px; height:0px; border: 100px solid white; border-left-color:blue; } &l
2022-03-21 21:37:24
85
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人