【前端】利用html+css实现脚手架企业页面【HTML+CSS+JavaScript(JS)】

效果：

代码：

免费下载：https://download.csdn.net/download/cc2855816075/80144740

注意：

1.float浮动的元素会脱离标准流，当一个div中的所有元素都脱标时，div将失去大小，因为没有元素将它撑开撑大，所以常见的解决办法有两个：
①在原处放一个和他一样大小的div帮他占位置。
②利用clear:both消除float浮动带来的影响。

<!-- ★★★去除float造成的影响★★★ -->
				<div style="clear: both;"></div>

2.空格为后代选择器，选择所有后代。

.odr-1-a,.odr-1-b{/* ★★★并集选择器不是空格,而是逗号!!★★★ */
	width: 49%;
	display: inline-block;
	line-height: 36px;
}

3.“>”是子元素选择器 ，选取的一定是直接后代（儿子）。

4.vertical-align意味垂直方向的对齐方式，一般对图片作用。

.odr-4-1{
	margin-top: 6px;
	vertical-align: top;/*★★★很重要，不然对不齐★★★*/
}

background-color: #e2e2e2;
	/* ★★★这个是修改无序列表前面原点样式的属性★★★ */