- 如果把网页想象成自己的房子，html文件就像墙体结构，将房子分为几个框架，区分哪个房子是客厅、食堂和卧室等等
- css是房子的风格，墙体颜色 地板风格等等。
- javascript文件是你的交互性组件，可以想象成电视遥控器或者车库门遥控开关，它们会让房子的某些元素发生变化。
- 用chrome浏览器选择右上角三行的按钮，选择工具里的开发者工具可以看到页面的结构。
- 一个box模型有Margin外边距，border边框，padding内边距和content内容这几个元素构成了网页上的边框
- 内边框padding的作用是在content内容的周围清理出一片区域，该区域会采用方框的背景颜色，因此它也是方框内部空间的一部分来直接保护内容。
- 边框border继承box的颜色属性。
- margin没有颜色，完全透明。可以将其看作是两个boxes之间的空白。
- 整个box的实际显示度是（border宽+内边距宽）*2+内容宽度。这些值哪一个发生了变化时都需要重新计算。
定义边框宽度：
* {
outline: 1px solid red !important;
}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
.image { //这是链接到html文件当中的image这一个类，定义image这个类的样式
max- 460px;
}
.description {
max- 705px;
}
定位元素是css中最复杂的概念之一，弹性方框布局flexible box layout是一个强大的工具，是一个弹性的方框，可以高效地在容器或者idv内布局。
如果要将两个元素并排放置，则要把父级容器的显示属性改为flex
例如这个父级div是app类，子级是image和description.
要在页面中插入图片 无比要把图片存储到页面能够访问的位置。
响应式网页：会随着网页窗口的大小自动调整大小。
设计响应式的网页就不能将列宽设为固定的像素，而是使用百分比。