浮动元素之间没有缝隙，这和行内块还是不一样的，有点区别的！ 2) 浮动元素与兄弟盒子之间的关系 注意：解决浮动的四种办法，后三种都是针对浮动元素的父元素的。 ...
分类：
Web程序 时间：
2020-01-22 18:34:02
阅读次数：
103
最近几个月一直用vue在写手机端的项目，主要写业务逻辑，在js方面投入的时间和精力也比较多。这两天写页面明显感觉css布局方面的知识有不足，所以复习一下布局方法。 两栏布局 1、浮动 .box1 .left { float: left; width: 100px; height: 100px; ba ...
分类：
Web程序 时间：
2020-01-21 21:37:40
阅读次数：
79
CSS布局 一、左右布局 1、float实现左右布局 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <link rel="stylesheet" href="index01.css"> <title>居中布局的几个实现方 ...
分类：
其他好文 时间：
2020-01-18 11:07:05
阅读次数：
111
布局其实就是想办法怎样将一些元素横向的排列起来，纵向由于块级元素的存在会自动占据一行。 inline block 元素会占据一行而且可以调整宽高很适合将这些元素排列在一行，而且使用 inline block 元素排列没有清除浮动这样的问题。 但是，使用 inline block 布局两个元素之间会有 ...
分类：
Web程序 时间：
2020-01-04 10:52:04
阅读次数：
104
Gird布局 一、关于概念 网格布局（Grid）是一个很强大的 CSS 布局方案。它可以将网页划分为多个网格任意拼接的布局，可以灵活的运用并实现出多种布局形式。 (grid和inline-grid区别在于，inline-grid容器为inline特性，因此可以和图片文字一行显示；grid容器保持块状 ...
分类：
其他好文 时间：
2020-01-02 20:40:32
阅读次数：
86
目标 记忆 能够说出 CSS 的布局的三种机制 理解 能够说出普通流在布局中的特点 能够说出我们为什么用浮动 能够说出我们为什么要清除浮动 应用 能够利用浮动完成导航栏案例 能够清除浮动 能够使用PS切图工具 1.1 CSS 布局的三种机制 网页布局的核心——就是 用 CSS 来摆放盒子 。 CSS ...
分类：
其他好文 时间：
2019-12-31 18:39:20
阅读次数：
77
圣杯布局是一种很常见的css布局。要求： 上部和下部各自占领屏幕所有宽度。 上下部之间的部分是一个三栏布局。 三栏布局两侧宽度不变，中间部分自动填充整个区域。 中间部分的高度是三栏中最高的区域的高度。 我会用三种方法来实现圣杯布局，分别是浮动，flexbox以及css grid： HTML内容： < ...
分类：
其他好文 时间：
2019-12-28 13:03:19
阅读次数：
113
一、概述 网格布局（Grid）是最强大的 CSS 布局方案。 它将网页划分成一个个网格，可以任意组合不同的网格，做出各种各样的布局。以前，只能通过复杂的 CSS 框架达到的效果，现在浏览器内置了。 上图这样的布局，就是 Grid 布局的拿手好戏。 Grid 布局与 Flex 布局有一定的相似性，都可 ...
分类：
Web程序 时间：
2019-12-21 18:58:31
阅读次数：
129
CSS基础 CSS简介： CSS（cascading style sheets）：层叠样式表。 WEB标准中的表现标准语言，表现标准语言在网页中主要对网页信息的显示进行控制，简单说就是如何修饰网页信息的显示样式。 用来修饰XHTML或者XML等样式文件的计算机语言。 CSS语法： 选择符表示要定义样 ...
分类：
Web程序 时间：
2019-12-21 18:37:36
阅读次数：
186
一 CSS布局的三种机制 1.标准流 2.浮动(盒子脱离标准流 浮起来 盒子水平排列) 3.定位(将盒子定在某一位置 自由的漂浮在其他盒子上面 css 离不开定位 特别是js特效) 二 为什么使用定位 要实现以上效果，不使用定位是非常困难的 将盒子定在某一个位置，自由的漂浮在其他盒子(包括标准流和浮 ...
分类：
Web程序 时间：
2019-12-20 01:12:11
阅读次数：
97
