commit
cff94b93d0
File diff suppressed because one or more lines are too long
@ -1,97 +0,0 @@
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
||||
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
|
||||
sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
|
||||
monospace;
|
||||
}
|
||||
header{
|
||||
height: 64px;
|
||||
width:100%;
|
||||
background-color: black;
|
||||
}
|
||||
.head_li{
|
||||
display: block;
|
||||
float: left ;
|
||||
color:white;
|
||||
font-size:16px;
|
||||
text-align: center;
|
||||
line-height: 64px;
|
||||
margin-left: 30px;
|
||||
}
|
||||
.head_li a{
|
||||
text-decoration: none;
|
||||
color:white;
|
||||
}
|
||||
.head_li a:hover{
|
||||
color: darkgray;
|
||||
}
|
||||
.head_lis{
|
||||
display: block;
|
||||
float: left ;
|
||||
color: aliceblue;
|
||||
font-size:16px;
|
||||
text-align: center;
|
||||
line-height: 64px;
|
||||
margin-left: 30px;
|
||||
}
|
||||
*{
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.icon-touxiang{
|
||||
font-size:32px;
|
||||
}
|
||||
.head_fr{
|
||||
float: right;
|
||||
margin-right: 30px;
|
||||
}
|
||||
.box1{
|
||||
margin: 50px auto;
|
||||
background-color: antiquewhite;
|
||||
width: 1200px;
|
||||
height: 345px;
|
||||
}
|
||||
.boxTwo:hover{
|
||||
background-color: white;
|
||||
color:black;
|
||||
}
|
||||
.boxOne{
|
||||
width:160px;
|
||||
height: 345px;
|
||||
background-color:black;
|
||||
float: left;
|
||||
opacity: 0.8;
|
||||
}
|
||||
li{
|
||||
list-style: none;
|
||||
}
|
||||
.boxTwo{
|
||||
display: block;
|
||||
background-color:transparent;
|
||||
width:160px;
|
||||
height:40px;
|
||||
font-size:16px;
|
||||
color:white;
|
||||
text-align:left;
|
||||
text-decoration: none;
|
||||
}
|
||||
.lunbotu{
|
||||
width: 1200px;
|
||||
height: 345px;
|
||||
background-color: transparent;
|
||||
}
|
||||
.contentStyle{
|
||||
height:10px;
|
||||
width: 10px;
|
||||
color: #fff;
|
||||
line-height: 10px;
|
||||
text-align: center;
|
||||
background-color: #364d79;
|
||||
};
|
||||
@ -1,64 +0,0 @@
|
||||
import React, { useState } from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import './index.css';
|
||||
import './iconfont/iconfont.css';
|
||||
import { Carousel } from 'antd';
|
||||
let head = (
|
||||
<div className='app'>
|
||||
<header>
|
||||
<div className='head_fl'>
|
||||
<ul>
|
||||
<li className='head_li'><a href='#'>首页</a></li>
|
||||
<li className='head_li'><a href='#'>实践课程</a></li>
|
||||
<li className='head_li'><a href='#'>实践项目</a></li>
|
||||
<li className='head_li'><a href='#'>教学课堂</a></li>
|
||||
<li className='head_li'><a href='#'>在线竞赛</a></li>
|
||||
<li className='head_li'><a href='#'>教学案例</a></li>
|
||||
<li className='head_li'><a href='#'>交流问答</a></li>
|
||||
<li className='head_li'><a href='#'>大学开源</a></li>
|
||||
<li className='head_li'><a href='#'>工程认证</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className='head_fr'>
|
||||
<ul>
|
||||
<li className='head_lis'><i className='iconfont icon-sousuo1'></i></li>
|
||||
<li className='head_lis'><i className='iconfont icon-tianjia'></i></li>
|
||||
<li className='head_lis'><i className='iconfont icon-xiaoxi'></i></li>
|
||||
<li className='head_lis'><i className='iconfont icon-touxiang'></i></li>
|
||||
</ul>
|
||||
</div>
|
||||
</header>
|
||||
<div className='box1'>
|
||||
<div className='boxOne'>
|
||||
<ul>
|
||||
<li><a href='#' className='boxTwo'>程序语言设计 <sapn style={{ textAline: 'right' }}>{'>'}</sapn></a></li>
|
||||
<li><a href='#' className='boxTwo'>计算机基础</a></li>
|
||||
<li><a href='#' className='boxTwo'>计算机系统能力</a></li>
|
||||
<li><a href='#' className='boxTwo'>云计算与大数据</a></li>
|
||||
<li><a href='#' className='boxTwo'>人工智能</a></li>
|
||||
<li><a href='#' className='boxTwo'>软件工程</a></li>
|
||||
<li><a href='#' className='boxTwo'>Web开发</a></li>
|
||||
<li><a href='#' className='boxTwo'>更多</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className='lunbotu'>
|
||||
<img src='https://ali-cdn.educoder.net/images/avatars/PortalImage/89?t=1640671464' ></img>
|
||||
|
||||
<Carousel autoplay>
|
||||
<div>
|
||||
<h3 className='contentStyle'>1</h3>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className='contentStyle'>2</h3>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className='contentStyle'>3</h3>
|
||||
</div>
|
||||
</Carousel>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
ReactDOM.render(head, document.getElementById('root'));
|
||||
Loading…
Reference in new issue