3w3p-2-learn

相关HTML 、CSS样式、布局学习

position
header
<header> 标签定义文档的页眉（介绍信息）。
font-weight

aside

section

nav

justify-content
The align-items property specifies the default alignment for items inside the flexible container.
justify-content:space-evenly
space-evenly : flex 容器起始边缘和第一个 flex 项之间的间距和每个相邻 flex 项之间的间距是相等。（愚人码头注：该属性以前很少看到，原因是以前浏览器不支持，chrome 也是 60 版本之后才支持。
参考

max-width
The max-width property is used to set the maximum width of an element.
This prevents the value of the width property from becoming larger than max-width.
width 与 max-widtn 区别？

flex 布局

flex-direction
The flex-direction property specifies the direction of the flexible items.

font-style
CSS中font-style的属性有Italic oblique,它们俩的区别是什么呢?

font-size
font-size 单位都有哪些？各代表什么意思？区别是什么？
px em rem
图标的font-size设置单位为 em ?
With the em size, it is possible to adjust the text size in all browsers.
em :
1em is equal to the current font size. The default text size in browsers is 16px.So, the default size of 1em is 16px.
The size can be calculated from pixels to em using this formula: pixels/16=em
Unfortunately, there is still a problem with older versions of IE.

align-items
align-items 属性定义flex子项在flex容器的当前行的侧轴（纵轴）方向上的对齐方式。使用每个弹性对象元素的 align-self 属性可重写 align-items 属性。
aligin-items: start-center

position
position:relative

background-size:cover

box-sizing
box-sizing 属性允许以特定的方式定义匹配某个区域的特定元素。
例如，假如您需要并排放置两个带边框的框，可通过将 box-sizing 设置为 "border-box"。这可令浏览器呈现出带有指定宽度和高度的框，并把边框和内边距放入框中。

align-wrap

媒体查询

CSS 媒体查询 @media

• 一般情况下在css文件开始的时候，先清除基本标签的默认样式

/* clear default */

html, body, h1, h2, h3, h4, h5, h6, p, ul {
  padding: 0;
  margin: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

ul li {
  list-style: none;
}

a {
  text-decoration: none;
}