这两天主要学习了CSS盒模型和CSS定位。学习笔记如下：CSSboxmodelboxmodel也叫盒子模型，其结构如下：W3school的翻译很好。它将margin和padding翻译成outermargin和innermargin以避免混淆。下面对盒模型的结构进行介绍：1.paddinginnermargins：可以按照上、右、下、左的顺序设置，也可以按上、右、下、左的顺序设置。不允许使用负值，可以使用px、em、ex、cm、百分比作为单位。注意：em是元素字体的高度。如果内联文本的当前字体大小没有手动设置，则它是相对于浏览器的默认字体大小。Ex是字母x的高度（Theheightoftheletter"x"）。这个高度通常是字体大小的一半。如果内联文本的当前字体大小没有手动设置，则它是相对于浏览器的默认字体大小。如果使用百分比作为单位，则百分比值是相对于父元素的宽度计算的。比如段落的父元素是div元素，padding的百分比值是根据div的宽度计算的。2.border边框：在元素的背景上绘制边框。1)border-style是最重要的属性。因为没有这个属性，就没有边界。一个边框可以定义多种样式，顺序为上、右、下、左。（也可以像border-left-style一样指定某条边）例子：p{border-style:solidsolidsolidnone;}p{border-style:solid;border-left-style:none;}两者是等价的，但是左边要放在后面，否则会被前面设置四边的属性覆盖。2）边框的宽度可以用border-width指定。也可以使用上、右、下、左的顺序，也可以指定单边的宽度（同上样式规则）。很重要：一定要输入border-style属性！否则，该属性默认为none，无论宽度是多少，都视为0（没有边框）。3）边框颜色：border-color。规则和上面两个一样。透明是一种透明的颜色。适用于具有样式和宽度的透明边框。Tips：以上三个边框属性的取值：说明：1）只输入一个值，四个边都有这个值；2）输入两个值，第一个是上下，第二个是左右；3）输入三个值，第一个向上，第二个左右，第三个向下；4)输入四个值，分别是上、右、下、左。3.外边距默认值为0，但浏览器会提供预定的样式。（即段落上下的空行）marginmerge：简单来说就是两个相邻的margin（包括空元素的上下外边框），如果它们之间没有内margin或者border，则会发生合并。（这也是一系列连续段落中段落间隔不大的原因之一）CSS定位和CSS定位相关内容的语言表达有些复杂，所以本章注释大部分直接抄自W3Cschool的CSS教程“CSS定位”一章。有些已经用他们自己的语言进行了处理，这样更通俗易懂。CSS提供定位和浮动属性，允许您构建柱状布局，将布局的一部分重叠在另一部分之上，并完成过去通常需要使用多个表格的任务。定位的基本思想很简单，它允许你定义一个元素的框相对于它的正常位置应该出现的位置，或者相对于父元素、另一个元素甚至浏览器窗口本身的位置。关于盒子：div、h1或p元素通常被称为块级元素。这意味着这些元素显示为一个内容，一个“块框”。相比之下，span和strong等元素被称为“内联元素”，因为它们的内容显示在一行内，或称为“内联框”。您可以更改使用显示属性生成的框的类型。这意味着通过将display属性设置为block，您可以使行内元素（例如元素）表现得像块级元素。也可以通过将display设置为none使生成的元素完全没有框架。这样，该框及其所有内容将不再显示，也不会占用文档中的任何空间。但在一种情况下，即使未明确定义块级元素也会创建它们。当一些文本被添加到块级元素（如div）的开头时，就会发生这种情况。即使文本没有被定义为段落，它也会被视为一个段落： Somemoretext. 一些文字
