网易云课堂（页面布局）

小沐爱编程

已于 2022-10-30 16:43:07 修改

阅读量614

点赞数

分类专栏： HTML5基础 CSS 文章标签：前端 html css

于 2022-10-30 16:14:46 首次发布

本文链接：https://blog.csdn.net/SDXYGZH/article/details/127600871

版权

本文介绍了网易云课堂的页面布局实现，包括效果图展示及HTML和CSS代码的详细讲解，提供源代码素材供下载。

摘要由CSDN通过智能技术生成

网易云课堂（页面布局）

效果图

在这里插入图片描述

html

	<!-- header -->
	<header>
		<div class="wrap">
			<img src="logo.png" alt="logo">
			<nav>
				<a href="#" class="active">首页</a>
				<a href="#" class="active">课程分类</a>
				<a href="#" class="active">微专业</a>
				<a href="#" class="active">我的学习</a>
				<a href="#" class="active">后台管路</a>
			</nav>
		</div>
	</header>
	<!-- banner  -->
	<section class="banner">
		<ul>
			<li class="center"></li>
			<li class="left"></li>
			<li class="right"></li>
		</ul>
	</section>
	<section class="main">
		<div class="bg-center">
			<aside>