模拟手机短信发送知识点

CSS部分
1.margin: 60px auto;
在居中的同时，会距离上边距60像素
2.background:url(img/iPhone.png) 0px 0px no-repeat;
类似于坐标，以左上角为起点，相当于坐标轴的第四象限。
展开为banckground-position
若后接百分数值：
假设你希望用百分数值将图像在其元素中居中，这很容易：

body
{
background-image:url(’/i/eg_bg_03.gif’);
background-repeat:no-repeat;
background-position:50% 50%;
}
这会导致图像适当放置，图像中描述为 50% 50% 的点（中心点）与元素中描述为 50% 50% 的点（中心点）对齐。

如果图像位于 0% 0%，其左上角将放在元素内边距区的左上角。如果图像位置是 100% 100%，会使图像的右下角放在右边距的右下角。

因此，如果你想把一个图像放在水平方向 2/3、垂直方向 1/3 处，可以这样声明：

body
{
background-image:url(’/i/eg_bg_03.gif’);
background-repeat:no-repeat;
background-position:66% 33%;
}

如果只提供一个百分数值，所提供的这个值将用作水平值，垂直值将假设为 50%。这一点与关键字类似。

background-position 的默认值是 0% 0%，在功能上相当于 top left。这

若后接长度值

长度值解释的是元素内边距区左上角的偏移。偏移点是图像的左上角。

比如，如果设置值为 50px 100px，图像的左上角将在元素内边距区左上角向右 50 像素、向下 100 像素的位置上：

body
{
background-image:url(’/i/eg_bg_03.gif’);
background-repeat:no-repeat;
background-position:50px 100px;
}

3. background-size: 350px 580px;可以设置北京的宽和高
   第一个值为宽，第二个值为高

4. overflow: auto;/加给Div，超出后自动加滚动条/

5. outline: none;//加给文本框，当鼠标点击选中时不会出现变色高亮效果

⭐6.当设置一个div时，如果将其中所有子元素都设置为position：absolute会导致父元素高度塌陷，无解！

JS部分

弹框实现思路：

往div中添加一个个布局好的小div，需要用到innerHTML：
?注意双引号中间套单引号，或者单引号中间套双引号，否则嵌套符号混乱导致无法实现响应功能

相当于添加如下代码到div中：
可以发现，innerHTML不光可以添加内容，还可以添加元素

其中 ： width:fit-content;//代表宽度自适应
max-width:170px;//最大宽度