实例
设置一个P元素的底部填充：
p{padding-bottom:2cm;}
属性定义及使用说明
padding-bottom属性设置一个元素的底部填充（空格）。
注意： 负值是不允许的。
| 默认值： | 0 |
|---|---|
2024年11月07日
实例
设置一个P元素的底部填充：
p{padding-bottom:2cm;}
属性定义及使用说明
padding-bottom属性设置一个元素的底部填充（空格）。
注意： 负值是不允许的。
| 默认值： | 0 |
|---|---|
2024年11月07日
作为 Web 开发人员，我们希望用户无论使用哪种浏览器浏览网页，HTML 元素的外观都是一样的。遗憾的是，由于浏览器的运行方式，情况并非如此。每个浏览器都有自己的默认样式表，其中规定了一些适用于元素的最基本规则。在大多数情况下，这些默认样式是有用的。但是，由于这些默认值的不同，有时会在特定浏览器中出现表现不一致的现象，影响用户的浏览体验。
2024年11月07日
2024年11月07日
在最初，浮动是用来实现文字环绕图片效果的，现在浮动是主流的页面布局方式之一。
元素浮动后的特点：
2024年11月07日
这个空隙怎么来的呢？是字体的高度影响，即使你没有字体，也有幽灵标签（行级空白）。以字母x为例，我们通常认为的是图片底部与字体底部对齐，其实不是，其对齐的是字母x的底部，而字母x下面还有部分高度，而图片属于非字体，所以就造成了底部空隙。
解决方案有2种。
1 父元素设置font-size:0,其原因是因为line-height的影响，因为此时的行高为fontsize*1,设置为没有行高，line-height:0,或者font-size:0 就不会产生底部字体高度。
2024年11月07日
浏览器加载页面是按从上到下顺序加载的。加载 JS 并执行的时候，会阻塞其他资源的加载。这是因为 JS 可能会有 DOM 、样式等等操作，所以浏览器要先加载这段 JS 并执行，再加载放在它后面的 HTML、CSS。
因此，加入一段巨大的 JS 放在最上面，浏览器首先要下载并执行，这段时间里面，页面是空白的。相比于加载了部分 HTML 和 样式 但是没有 JS 交互功能，显然是后者对于浏览者体验要好。
2024年11月07日
随时科技的进步，现在人们对物质的追求越来越高，想当初还是modem拨号上网时，我们会等上1到2分钟打开一个网站而高兴很久，而现在网速越来越快，同时访问的用户也越来越多，人们对速度的追求也越来越高， 当搜索一个物件时，一个页面如果10秒钟还没有出现内容时，我相信你会毫不犹豫中换另一个网站。
所以我们前端开发人员在开发一个项目时，首先要站在一个体验者的角度，以速度为先，这就要求我们对代码的效率有了更高的要求，那么哪些因素会影响到代码运行的效率呢?下面和千锋广州前端开发小编一起来看看吧！
2024年11月07日
实例
设置图像的底部边缘，在元素的底边上面5px：
img
{
position:absolute;
bottom:5px;
}
属性定义及使用说明
对于绝对定位元素，bottom属性设置单位高于/低于包含它的元素的底边。
对于相对定位元素，bottom属性设置单位高于/低于其正常位置的元素的底边。
注意：如果"position：static"，底部的属性没有任何效果。
2024年11月07日
position:fixed;用我自己的话来说，就是让你想要固定的东西固定。例如：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
body{
height: 2000px;
}
.photo{
width: 600px;
height: 600px;
position: fixed;
left: calc(50%-300px);
top: calc(50%-300px);
}
</style>
</head>
<body>
10月7日，昆凌在社交平台晒出自己荡秋千的美照。
照片中，昆凌长发披肩，头戴假日风草帽，
穿一袭白裙在海边荡着秋千，回眸甜笑，宛若仙子。
<div id="box1">
<img src="img/kunling.jpg" class="photo">
</div>
</body>
</html>