<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="utf-8"> <title>我的第一個網頁</title></head> <!-- 1.標籤建議全部小寫 --><body> 歡迎訪問我的網頁！ <!-- 屬性用引號引起來 --> <d ...
分类：
其他好文 时间：
2019-11-10 11:50:03
阅读次数：
120
display属性display属性用来控制一个元素及其子元素的格式化上下文，你应该在刚刚学习CSS的时候就知道，有些元素是块级元素，有些则是行内元素。有了display属性，你就可以切换元素不同的状态。比如说，通常一个h1元素是一个块级元素，但是通过切换，它就能以内联元素展现。这几年，我们也知道了Grid布局和弹性盒布局。我们只需要将display属性的值设置为display:grid或disp
分类：
Web程序 时间：
2019-11-08 09:30:23
阅读次数：
112
平时工作中会遇到动态给某个div加子元素，有时候为了简便，直接如下写法： var oBox = document.getElementById('box'); oBox .innerHTML = '<button onclick="change();">子元素</button>'; 还顺便给子元素添 ...
分类：
其他好文 时间：
2019-11-07 18:59:54
阅读次数：
103
10 分钟理解 BFC 原理 一、常见定位方案 在讲 BFC 之前，我们先来了解一下常见的定位方案，定位方案是控制元素的布局，有三种常见方案: 普通流 (normal flow) 在普通流中，元素按照其在 HTML 中的先后位置至上而下布局，在这个过程中，行内元素水平排列，直到当行被占满然后换行，块 ...
分类：
其他好文 时间：
2019-11-07 17:41:05
阅读次数：
99
flex布局 "阮一峰：flex布局教程" http://www.ruanyifeng.com/blog/2015/07/flex grammar.html 注意点： 任何一个容器都可以指定为flex布局 行内元素也可以使用flex布局：display：inline flex webkit内核的浏览 ...
分类：
其他好文 时间：
2019-11-01 00:05:32
阅读次数：
125
行内元素的特点有： 1、与其他元素在同一行 2、宽度(width)、高度(height)、内边距的top/bottom(padding-top/padding-bottom)和外边距的top/bottom(margin-top/margin-bottom)不可设置 其实这4个属性是可以设置的，但是不 ...
分类：
其他好文 时间：
2019-10-26 18:59:44
阅读次数：
62
``` Formal syntat:||; - flex元素上的属性 - flex-basis与flex-shrink,flex-grow就是改变了布局空白(available space)的行为 - 默认行为是flexbox有盈余,留在后面不做处理. - 上面三种元素的简写:flex - 元素间的... ...
分类：
Web程序 时间：
2019-10-22 20:13:02
阅读次数：
125
BFC(块级格式化上下文) BFC(Block formatting context) 直译为"块级格式化上下文"。 元素的显示模式 我们前面讲过 元素的显示模式 display。 分为 块级元素 行内元素 行内块元素 ，其实，它还有很多其他显示模式。 那些元素会具有BFC的条件 不是所有的元素模式 ...
分类：
Web程序 时间：
2019-10-21 17:43:53
阅读次数：
122
一、块级元素和行内元素的区别 （1）块级元素会独占一行，其宽度自动填满其父元素宽度； 行内元素不会独占一行，相邻的行内元素会排列在同一行，直至一行排不下才会换行，其宽度随元素的内容而变化。 （2）块级元素可以包含行内元素和块级元素；行内元素不能包含块级元素。 （3）行内元素设置width、heigh ...
分类：
其他好文 时间：
2019-10-20 17:38:29
阅读次数：
59
CSS的定位机制 1.普通流（标准流） 默认状态，元素自动从左往右，从上往下排列 块元素的特征： 独占一行 可以设置宽高 如果不设置宽度，宽度默认为容器的100% 常见的块元素：div p h1-h6 ul ol li dl dt d 行内元素的特征： 与其他元素同行显示 不可以设置宽和高 宽和高就 ...
分类：
Web程序 时间：
2019-10-18 12:47:10
阅读次数：
153
