bmy/ClassContent
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
编码猿
2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
历届学生/熊坤/项目案例/仿简书/img/logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
历届学生/熊坤/项目案例/仿简书/img/meta-left.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

BIN
历届学生/熊坤/项目案例/仿简书/img/right-text.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.7 KiB

BIN
历届学生/熊坤/项目案例/仿简书/img/search.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.6 KiB

BIN
历届学生/熊坤/项目案例/仿简书/img/user-logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 19 KiB

BIN
历届学生/熊坤/项目案例/仿简书/img/wirte.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.5 KiB

260
历届学生/熊坤/项目案例/仿简书/index.html Normal file
View File

@@ -0,0 +1,260 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
body,ul{
margin: 0;
padding: 0;
}
a {
text-decoration: none;
}
ul li {
list-style: none;
}
.left {
float: left;
}
.menu {
height: 56px;
border-bottom: 1px solid #f0f0f0;
box-sizing: border-box;
position: fixed;
width: 100%;
background: #fff;
}
.menu-left {
float: left;
height: 56px;
}
.menu-left img {
height: 100%;
}
.menu-center {
width: 945px;
padding: 0 15px;
margin: 0 auto;
}
.center-left ul li {
float: left;
}
.center-left ul li a{
font-size: 17px;
color: #333;
padding: 15px 15px 15px 0;
display: inline-block;
}
.center-left li:first-child {
margin-right: 10px;
width: 64px;
}
.center-left li:nth-child(2) {
margin-right: 10px;
}
.center-left li:last-child {
padding-left: 15px;
margin-right: 10px;
}
.center-left li:last-child input {
width: 160px;
height: 38px;
border-radius: 40px;
outline: none;
border: none;
background: #eee;
padding-left: 20px;
box-sizing: border-box;
margin-top: 9px;
font-size: 14px;
background: url("./img/search.png") no-repeat #eee;
background-position: 129px;
}
.center-right {
float: right;
padding-right: 33px;
padding-top: 2px;
}
.center-right li {
float: left;
margin-left: -16px;
}
.center-right li:first-child img,
.center-right li:last-child a {
padding: 15px;
}
.center-right li:last-child a {
display: inline-block;
margin-left: 10px;
margin-right: 6px;
font-size: 15px;
color: #969696;
}
.menu-right {
position: absolute;
right: 22px;
}
.menu-right a {
display: inline-block;
font-size: 15px;
}
.menu-right a:first-child {
width: 80px;
height: 38px;
border: 1px solid rgba(236,97,73,.7);
border-radius: 20px;
text-align: center;
line-height: 38px;
color: #ea6f5a;
margin: 9px 5px 0 15px;
}
.menu-right a:last-child {
width: 100px;
height: 38px;
line-height: 38px;
color: #ffffff;
border: 1px solid rgba(236,97,73,.7);
border-radius: 20px;
text-align: center;
background: #ee6548;
margin-left: 5px;
margin-right: 12px;
box-sizing: border-box;
}
.menu-right a:last-child img{
vertical-align: middle;
}
.content {
margin: 0 auto;
width: 620px;
padding-top: 109px;
}
.content-title h1 {
font-size: 34px;
font-weight: 700;
line-height: 1.3;
}
.content-user {
margin: 30px 0 40px;
overflow: hidden
}
.user-logo {
width: 48px;
height: 48px;
border-radius: 100%;
border: 1px solid #ddd;
box-sizing: border-box;
}
.info {
margin-left: 8px;
}
.info a {
color: #333;
margin-right: 3px;
font-size: 16px;
}
.info span {
background: #42c02e;
font-size: 12px;
color: #fff;
width: 52px;
height: 17px;
display: inline-block;
border-radius: 40px;
text-align: center;
}
.meta {
margin-top: 5px;
font-size: 12px;
color: #969696;
}
.meta img {
width: 12px;
height: 13px;
vertical-align: middle;
}
</style>
</head>
<body>
<div class="main">
<div class="menu">
<div class="menu-left">
<img src="./img/logo.png" alt="">
</div>
<div class="menu-center">
<div class="center-left">
<ul>
<li>
<a href="https://www.jianshu.com/">首页</a>
</li>
<li>
<a href="">下载App</a>
</li>
<li>
<input type="text" name="" placeholder="搜索">
</li>
</ul>
</div>
<div class="center-right">
<ul>
<li>
<img src="./img/right-text.png" alt="文字">
</li>
<li>
<a href="">登录</a>
</li>
</ul>
</div>
</div>
<div class="menu-right">
<a href="">注册</a>
<a href="">
<img src="./img/wirte.png" alt="" srcset="">
写文章
</a>
</div>
</div>
<div class="content">
<div class="content-title">
<h1>使用Vue-cli搭建多页面应用时对项目结构和配置的调整</h1>
</div>
<div class="content-user">
<a href="" class="left">
<img class="user-logo" src="./img/user-logo.png" alt="用户头像">
</a>
<div class="info left">
<a href="">大春春</a>
<span>+ 关注</span>
<div class="meta">
<img src="./img/meta-left.png" alt="">
0.5 2017.05.07 15:47* 字数 588 阅读 29690评论 60喜欢 89赞赏 1
</div>
</div>
</div>
<div class="content-arcie">
<p>前提：在这里使用的是webpack模板进行搭建</p>
<h3>第一步、安装Vue-cli并且进行初始化</h3>
<p>然后使用vue init <template(模板名，我这里使用的是webpack)> <项目文件夹名称(我这里使用的是project)>初始化一个Vue项目模板
这时候Vue-cli的准备工作就完成了，这时候可以通过npm run dev进入开发环境，启动后是这个样子的，但是此时的脚手架的配置都是针对单页面应用进行的，入口只有一个index.html，所以下一步就要对项目目录的结构进行一些调整
这时候Vue-cli的准备工作就完成了，这时候可以通过npm run dev进入开发环境，启动后是这个样子的，但是此时的脚手架的配置都是针对单页面应用进行的，入口只有一个index.html，所以下一步就要对项目目录的结构进行一些调整
这时候Vue-cli的准备工作就完成了，这时候可以通过npm run dev进入开发环境，启动后是这个样子的，但是此时的脚手架的配置都是针对单页面应用进行的，入口只有一个index.html，所以下一步就要对项目目录的结构进行一些调整
这时候Vue-cli的准备工作就完成了，这时候可以通过npm run dev进入开发环境，启动后是这个样子的，但是此时的脚手架的配置都是针对单页面应用进行的，入口只有一个index.html，所以下一步就要对项目目录的结构进行一些调整
这时候Vue-cli的准备工作就完成了，这时候可以通过npm run dev进入开发环境，启动后是这个样子的，但是此时的脚手架的配置都是针对单页面应用进行的，入口只有一个index.html，所以下一步就要对项目目录的结构进行一些调整
这时候Vue-cli的准备工作就完成了，这时候可以通过npm run dev进入开发环境，启动后是这个样子的，但是此时的脚手架的配置都是针对单页面应用进行的，入口只有一个index.html，所以下一步就要对项目目录的结构进行一些调整
</p>
</div>
</div>
</div>
</body>
</html>