【无标题】

最新推荐文章于 2023-04-19 07:30:00 发布
最新推荐文章于 2023-04-19 07:30:00 发布
阅读量159 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_61687202/article/details/121674237
版权

学成在线 编程 人工智能 课程 职业规划
关键词由CSDN通过智能技术生成

 

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>学成在线-不是所有的网站都叫学成在线</title>
	<link rel="stylesheet" href="style.css">
</head>
<body>
	<!-- header头部模块开始 -->
	<div class="header w">
		<!-- logo -->
		<div class="logo">
			<img src="images/logo.png" alt="">
		</div>
		<!-- nav -->
		<div class="nav">
			<ul>
				<li><a href="#">首页</a></li>
				<li><a href="#">课程</a></li>
				<li><a href="#">职业规划</a></li>
			</ul>
		</div>
		<!-- search -->
		<div class="search">
			<input type="text" value="输入关键词">
			<button></button>
		</div>
		<!-- user -->
		<div class="user">
			<img src="images/user.jpg" alt="">
			lilei-hanmm
		</div>
	</div>
	<!-- header头部模块结束 -->
	<!-- banner 部分start -->
	<div class="banner">
		<div class="w">
			<!-- 左侧 subnav  -->
			<div class="subnav">
				<ul>
					<li><a href="#">前端开发 <span>></span></a></li>
					<li><a href="#">后端开发 <span>></span></a></li>
					<li><a href="#">移动开发 <span>></span></a></li>
					<li><a href="#">人工智能 <span>></span></a></li>
					<li><a href="#">商业预测 <span>></span></a></li>
					<li><a href="#">云计算&大数据 <span>></span></a></li>
					<li><a href="#">运维&从测试 <span>></span></a></li>
					<li><a href="#">UI设计 <span>></span></a></li>
					<li><a href="#">产品 <span>></span></a></li>
				</ul>
			</div>
		    <!-- 右侧 course -->
		    <div class="course">
		        <div class="course-hd">
				    我的课程表
			    </div>
			    <div class="course-bd">
				    <ul>
					    <li>
						    <h4>继续学习 程序语言设计</h4>
						    <p>正在学习-使用对象</p>
					    </li>
					    <li>
						    <h4>继续学习 程序语言设计</h4>
						    <p>正在学习-使用对象</p>
					    </li>
					    <li>
						    <h4>继续学习 程序语言设计</h4>
						    <p>正在学习-使用对象</p>
					    </li>
					</ul>
				    <a class="all" href="#">全部课程</a>
					
			    </div>
		    </div>
		</div>
	</div>
	<!-- banner 部分end -->
	<div class="goods w">
		<h3>精品推荐</h3>
		<div class="goods-item">
			|      <a href="#">TQuery</a>
			|      <a href="#">Spark</a>
			|      <a href="#">MySQL</a>
			|      <a href="#">JavaWeb</a>
			|      <a href="#">HTML</a>
			|      <a href="#">CSS</a>
		</div>
		<div class="mod">
			修改兴趣
		</div>
	</div>
	<div class="box w">
		<div class="box-hd clearfix">
			<h3>精品推荐</h3>
			<a href="#">查看全部</a>
		</div>
		<div class="box-bd" clearfix>
			<ul>
				<li>
					<img src="images/pic.jpg" alt=""/>
					<h4>Think PHP 50. 博客系统实战项目训练</h4>
					<p><span>高级</span> · 1125人在学习</p>
				</li>
				<li>
					<img src="images/pic.jpg" alt=""/>
					<h4>Think PHP 50. 博客系统实战项目训练</h4>
					<p><span>高级</span> · 1125人在学习</p>
				</li>
				<li>
					<img src="images/pic.jpg" alt=""/>
					<h4>Think PHP 50. 博客系统实战项目训练</h4>
					<p><span>高级</span> · 1125人在学习</p>
				</li>
				<li>
					<img src="images/pic.jpg" alt=""/>
					<h4>Think PHP 50. 博客系统实战项目训练</h4>
					<p><span>高级</span> · 1125人在学习</p>
				</li>
				<li>
					<img src="images/pic.jpg" alt=""/>
					<h4>Think PHP 50. 博客系统实战项目训练</h4>
					<p><span>高级</span> · 1125人在学习</p>
				</li>
				<li>
					<img src="images/pic.jpg" alt=""/>
					<h4>Think PHP 50. 博客系统实战项目训练</h4>
					<p><span>高级</span> · 1125人在学习</p>
				</li>
				<li>
					<img src="images/pic.jpg" alt=""/>
					<h4>Think PHP 50. 博客系统实战项目训练</h4>
					<p><span>高级</span> · 1125人在学习</p>
				</li>
				<li>
					<img src="images/pic.jpg" alt=""/>
					<h4>Think PHP 50. 博客系统实战项目训练</h4>
					<p><span>高级</span> · 1125人在学习</p>
				</li>
				<li>
					<img src="images/pic.jpg" alt=""/>
					<h4>Think PHP 50. 博客系统实战项目训练</h4>
					<p><span>高级</span> · 1125人在学习</p>
				</li>
				<li>
					<img src="images/pic.jpg" alt=""/>
					<h4>Think PHP 50. 博客系统实战项目训练</h4>
					<p><span>高级</span> · 1125人在学习</p>
				</li>
			</ul>
		</div>
	</div>
	<!--精品内容结束-->
	<!--页脚开始-->
	<div class="footer">
		<div class="w">
            <div class="copyright">
			    <img src="images/footer.png" alt="">
                <p>学成在线致力于普及中国最好的教育它与中国一流大学和机构合作提供在线课程。<br>
				    © 2017年XTCG Inc.保留所有权利。-沪ICP备15025210号</p>
			    <a href="#">下载APP</a>
			</div>
			<div class="links">
				<dl>
					<dt>
						关于学成网
					</dt>
					<dd>
						关于
					</dd>
					<dd>
						管理团队
					</dd>
					<dd>
						工作机会
					</dd>
					<dd>
						客户服务
					</dd>
					<dd>
						帮助
					</dd>
				</dl>
				<dl>
					<dt>
						新手指南
					</dt>
					<dd>
						如何注册
					</dd>
					<dd>
						如何选课
					</dd>
					<dd>
						如何拿到毕业证
					</dd>
					<dd>
						学分是什么
					</dd>
					<dd>
						考试未通过怎么办
					</dd>
				</dl>
				<dl>
					<dt>
						合作伙伴
					</dt>
					<dd>
						合作机构
					</dd>
					<dd>
						合作导师
					</dd>
				</dl>
			</div>
		</div>
	</div>
	<!--页脚结束-->




</body>
</html>
/*css 初始化代码 css reset*/
/*清除元素默认的内外边距*/
* {
	margin: 0;
	padding: 0;
}
/*清除列表样式*/
li {
	list-style: none;
}
/*去掉button 默认自带的边框*/
button {
	border: none;
}
body {
	background-color: #f3f5f7;
	/*方便写代码 一会别忘了删除*/
	/*height: 3000px;*/
}
a {
	text-decoration: none;
}
/*清除浮动的*/
.clearfix:before,
.clearfix:after {
	content: "";
	display: table;
}
.clearfix:after {
	clear: both;
}
.clearfix {
	*zoom: 1;
}
/*版心 1200 水平居中*/
.w {
	width: 1200px;
	margin: auto;
}
/*header start*/
.header {
	height: 42px;
	/*background-color: pink;*/
	margin: 30px auto;
}
.logo {
	float: left;
	margin-right: 60px;
}
.nav {
	float: left;
}
.nav ul li {
	float: left;
}
.nav ul li a {
	display: block;
	height: 40px;
	padding: 0 10px;
	margin-right: 20px;
	line-height: 40px;
	font-size: 18px;
	color: #050505;
	text-decoration: none;
}
/*鼠标经过链接 才有底边框*/
.nav ul li a:hover {
	border-bottom: 2px solid #00a4ff;
}
.search {
	float: left;
	margin-left: 70px;
}
.search input {
	float: left;
	width: 340px;
	height: 40px;
	border: 1px solid #00a4ff;
	border-right: 0;
	padding-left: 20px;
	color: #ccc;
}
.search button {
	float: left;
	width: 50px;
	height: 42px;
	background: url(images/btn.png);
}
.user {
	float: left;
	height: 42px;
	line-height: 42px;
	margin-left: 30px;
	font-size: 14px;
	color: #666;
}
/*banner start*/
.banner {
	height: 420px;
	background: #1c036c url(images/banner2.jpg) no-repeat top center;
}
.subnav {
	float: left;
	width: 150px;
	height: 420px;
	padding: 0 20px;
	/*背景半透明*/
	background: rgba(0, 0, 0, .3);
}
.subnav li {
	height: 45px;
	line-height: 45px;
}
.subnav li a {
	color: #fff;
	font-size: 14px;
	text-decoration: none;
}
.subnav li a:hover {
	color: #00b4ff;
}
.subnav  span {
	float: right;
}

.course{
	float: right;
	margin-top: 50px;
	width: 230px;
	height: 300px;
	background-color: #fff;
}
.course-hd{
	height: 48px;
	line-height: 48px;
	text-align: center;
	background-color: #9bceea;
	font-size: 18px;
	color: #fff;
	font-weight: 700;
}
.course-bd{
	padding: 0 15px;
}
.course-bd ul{
	padding-top: 10px;
}
.course-bd li{
	height: 50px;
	margin-top: 10px;
	border-bottom: 1px solid #efefef;
}
.course-bd li h4{
	font-size: 16px;
	color: #a5a5a5;
}
.all{
	display: block;
	margin-top: 10px;
	height: 38px;
	line-height: 38px;
	border: 1px solid #22b0ff;
	text-align: center;
	color: #00a4ff;
	font-size: 16px;
}
.goods{
	height: 60px;
	line-height: 60px;
	background-color: #fff;
	margin-top: 10px;
	box-shadow: 2px 2px 2px rgba(0,0,0, .2);
}
.goods h3{
	float: left;
	margin: 0 30px;
	font-size: 16px;
	color: #00a4ff;
}
.goods-item{
	float: left;
	color: #bfbfbf;
}
.goods-item a{
	margin: 0 30px;
	font-size: 16px;
	color: #050505;
}
.mod{
	float: right;
	font-size: 14px;
	color: #00a4ff;
	margin-right: 30px;
}
.box{
	margin-top: 15px;
}
.box-hd{
	height: 60px;
	line-height: 60px;
}
.box h3{
	float: left;
	font-size: 20px;
	color: #494949;
}
.box a{
	float: right;
	font-size: 12px;
	color: #a5a5a5;
}
.box-bd{
	width: 1215px;
}
.box-bd li{
	float: left;
	width: 228px;
	height: 270px;
	margin-bottom: 15px;
	margin-right: 15px;
	background-color: #fff;
	box-shadow: 2px 2px 2px rgba(0,0,0, .2);
}
.box-bd img{
	width: 100%;
}
.box-db h4{
	margin: 20px;
	font-size: 14px;
	color: #050505;
}
.box-bd p{
	margin: 20px 25px;
	font-size: 12px;
	color: #999999;
}
.box-bd span{
	color: #ff7c2d;
}
.footer{
	padding-top: 30px;
	height: 420px;
	background-color: #fff;
}
.copyright{
	float: left;
}
.copyright p{
	margin: 30px 0;
	font-size: 12px;
	color: #666666;
}
.copyright a{
	display: block;
	width: 120px;
	height: 35px;
	line-height: 35px;
	border: 1px solid #00a4ff;
	text-align: center;
	color: #00a4ff;
}
.links{
	float: right;
}
.links dl{
	float: left;
	margin-left: 100px;
}
.links dt{
	height: 30px;
	font-size: 16px;
	color: #333333;
}
.links dd{
	font-size: 12px;
	color: #333333;
}

柾L
关注
学成网首页素材内含html，css，psd
08-14
学成网首页素材内含html，css，psd，以及素材所需要的图片，该资源对应b站课程【黑马Pink老师】2020最新前端开发入门基础篇完整版 里面的第七天案例的所有内容
学成在线网页设计
qq_57110139的博客
12-02 248
111
网页的制作
qq_43174356的博客
10-24 3469
学成网 © 2017年XTCG Inc.保留所有权利。-沪ICP备15025210号 下载APP 关于学成网 团队管理 团队管理 团队管理 团队管理 团队管理 关于学成网 团队管理 团队管理 团队管理 团队管理 团队管理 关于学成网 团队管理 团队管理 团队管理 团队管理 团队管理 &lt;style&gt; * { margi...
学成在线（一）项目介绍
热门推荐
XiaoWangTongXuei的博客
01-23 3万+
CMS接口开发1 项目的功能构架1.1 项目背景1.2 功能模块1.3 项目原型2 项目的技术架构2.1技术架构2.2 技术栈2.3 开发步骤3 CMS需求分析3.1 什么是CMS3.2 静态门户工程搭建3.2.1 导入门户工程3.2.2 配置虚拟主机 在nginx中配置虚拟主机：3.2.3 SSI服务端包含技术3.3 CMS页面管理需求4 CMS服务端工程搭建注释也是必不可少的KaTeX数学公...
学成网首页案例HTML+CSS技巧分享
huahua123mh的博客
07-28 1450
一、建议准备工作 1.学成网首页psd文件 2.Cutterman切图工具（Ps插件） 二、布局构思 0）整体模块： 学成网首页案例 区域类名 区域 .header 头部区域 .banner 横幅广告区域 .goods 精品推荐导航区域 .box 精品推荐课程区域 .programer 编程入门区域 .web 前端开发区域 .footer 页脚区域 注意：因为.
Qt无标题窗口
05-21
在本文中，我们将深入探讨如何使用Qt框架创建一个无标题窗口，这在界面设计和自定义标题栏美化中非常有用。我们将关注`framelesswidget.cpp`、`main.cpp`、`framelesswidget.h`等核心文件，理解它们在实现无标题窗口...
VC去掉'无标题'字样的方法.zip
11-21
在使用Visual C++进行编程时，我们经常会在创建新的窗口或者对话框时默认看到标题栏显示为“无标题”。这可能会对用户界面的美观性和专业性造成一定的影响。本资料包提供了一种方法来帮助开发者去掉这个“无标题”...
visual c++取掉对话框窗口的 -无标题 字样的方法
08-04
在Visual C++编程环境中，创建窗口应用程序时，默认情况下，窗口标题栏可能会显示“-无标题”字样，这通常是由于没有正确设置窗口类或没有自定义窗口标题所导致的。要解决这个问题，我们需要深入理解Windows API中的...
c#实现无标题栏窗口的拖动
09-05
本篇文章将详细讲解如何在C#中实现这种无标题栏窗口的拖动以及其他基本操作。 首先，为了实现无标题栏窗口的拖动，我们需要处理窗体的鼠标事件。窗体的`FormBorderStyle`属性应设置为`None`，这会去除窗体的边框和...
delphi 无标题调整大小
11-26
在Delphi编程环境中，"无标题调整大小"通常是指创建没有标准标题栏的窗口，并允许用户通过拖动边界来调整其大小。这种设计通常用于自定义界面或创建无边框的对话框。以下是对这个主题的详细解释： 一、创建无标题...
Android 全屏无标题栏的三种实现方法
09-02
在Android应用开发中，有时我们需要实现全屏无标题栏的效果，以提供更加沉浸式的用户体验。以下将详细介绍三种在Android中实现全屏无标题栏的方法。 ### 方法一：通过Java代码 在Activity的`onCreate()`方法中，在...
无标题111111111111111111
最新发布
08-22
无标题111111111111111111
无标题fadsfadsfdsafdasfdasfdasfdasf
08-08
ffffadsfdasfdsafdasfdasfdasfdsf
无标题1123231212321
07-17
无标题1123231212321
无标题2321321321
08-05
321321
学成在线笔记+踩坑（1）——项目思路、架构、父工程和基础工程，Gogs使用
vincewm的博客
04-19 5567
项目思路、架构、父工程和基础工程，Gogs使用
学成网Html+CSS案例
qq_42066969的博客
12-07 327
学成网案例 index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
学成在线html
weixin_43945332的博客
07-20 470
style.css * { margin: 0; padding: 0; } body { /*设置整个页面的背景颜色*/ background-color: #f3f5f7; } li { /*使整个页面的li都无小黑点*/ list-style: none; } a { text-decoration: none; } .w { /*因为页面版心的宽是1202，因此这样可以简化代码*/ width: 1202px; marg
学成在线HTML代码,/index.html
weixin_42512936的博客
05-30 987
OpenSSL is arobust, commercial-grade, and full-featured toolkitfor the Transport Layer Security (TLS) and SecureSockets Layer (SSL) protocols. It is also a general-purposecryptography library. For mo...
设置无标题 android
05-02
在Android应用中，设置无标题是一种简洁和美观的设计方式，可以为用户提供更流畅的使用体验。以下是一些实现设置无标题的方法： 1. 在Android的Manifest文件中，找到对应Activity的标签，并添加”android:theme="@...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值