2016.3.15__H5页面实战__第七天
假设您认为这篇文章还不错，能够去H5专题介绍中查看很多其它相关文章。
个人简书地址：
dhttp://www.jianshu.com/users/5a2fd0b8fb30/latest_articles
阶段測试–映纷创意首页
今日制作一个站点首页。
官网地址：http://www.infinistudio.cn/
今日制作效果图：
今日制作站点逻辑概念：
既然已经分析过了界面要求和逻辑，那么我们来開始制作第一个页面。
首先是通过 Photoshop 去获取咱们站点的详细图标等。
在之后，分别去创建相应的目录，内部包括你的 CSS ， images 等目录。
创建之后，咱们正式開始今天的代码部分。
警告：下面代码部分，标签内容相应闭合，假设须要复制，请前往文章最底部。
首先咱们先来引入咱们的外部样式表。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="css/layout.css">
</head>
<body>
</body>
</html>头部
之后咱们来去在 BODY 中创建咱们的首页 logo 还有四个button。
为了方便查看。header 部分的 CSS 样式表。会在 header 部分结束的时候统一贴出来，大家稍安勿躁。
<div class="header">
<a href="#"><img src="data:images/title2.png"/></a>
<ul>
<li><a href="#">HOME</a></li>
<li><a href="#">WORK</a></li>
<li><a href="#">CONTACT</a></li>
<li><a href="#">JOIN US</a></li>
</ul>
</div>Header部分 CSS 代码
/*首先来设置整个界面的文字样式，清除边距*/
*{
margin: 0px;
font-size: 17px;
font-family: "黑体";
}
/*为整个代码区域附上一个灰色的背景色*/
body{
background-color: rgb(242 , 242, 242);
}
/*===========================================================*/
/* 头部 */
/*===========================================================*/
.header{
width: 100%;
height: 113px;
background-color: rgba(0, 0, 0, 0.5);
/*元素框从文档流全然删除。并相对于其包括块定位。
包括块可能是文档中的还有一个元素或者是初始包括块。
元素原先在正常文档流中所占的空间会关闭，就好像元素原来不存在一样。
元素定位后生成一个块级框。而不论原来它在正常流中生成何种类型的框。
只是其包括块是视窗本身.*/
position: fixed;
/*设置图片居中*/
text-align: center;
/*设置阴影效果 属性分别相应 ： 横向距离 竖向距离 阴影距离 阴影颜色*/
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.5);
}
/*调整头部 logo 尺寸*/
.header img{
margin: 15px;
width: 140px;
height: 55px;
}
ul{
list-style-type: none;
}
ul a{
/*text-decoration: underline; 下滑线*/
/*text-decoration: line-through; 删除线*/
/*取消a的下滑线*/
text-decoration: none;
}
a{
color: rgba(255, 255, 255, 0.5);
}
/*伪类代码 a:hover 当我们的鼠标放在我们的 a 标签上。咱们能够去设置颜色或者大小等*/
a:hover{
color: white;
}
li{
/* display 属性规定元素应该生成的框的类型:默认inline。此元素会被显示为内联元素。元素前后没有换行符。
*/
display: inline;
/*设置边距 属性为两个的时候。第一个属性设置上下高度 第二个属性设置左右宽度*/
margin: 0px 30px;
padding:0px 20px;
}主体
创建了上方的用户 logo 和四个button。咱们接下来要開始制作咱们的主体部分了。主体首先是一个用户引导图，下面配上文字和内容，下方还有相应的点。
首先咱们来创建咱们的引导图
<div class="content">
-
<div class="content_top">
<div class="content_banner">
<a href="#" class="img_bannder"><img class="img_bannder" src="data:images/banner.jpg" alt="" /></a>
<p class="banner_title_bg">
优酷2014全视频之夜
</p>
<div class="xiaodiandian">
<p class="dian"> ・ </p>
<p class="dian"> . </p>
<p class="dian"> ・ </p>
<p class="dian"> ・ </p>
<p class="dian"> ・ </p>
<p class="dian"> ・ </p>
</div>
</div>
<div class="content_introduce">
<p class="line"></p>
<p class="introduce"> Infini Studio (映纷创意)是一家创意设计机构。专注于品质型动画影像的创意与设计。我们使用设计、动画、特效及多种创新形式（Motion Graphic），将信息与内容进行动态视觉化创意呈现。并由动画导演、设计师、插画师、三维艺术家共同协作完毕。服务的范围包括广告、影视、交互、新媒体等。</p>
</div>
</div>
</div>创建了引导图之后。还须要创建下方的赞助商图标。
<div class="content_company">
<p class="line"></p>
<div class="company_logo">
<img src="data:images/1.jpg"/>
<img src="data:images/2.jpg"/>
<img src="data:images/3.jpg"/>
<img src="data:images/4.jpg"/>
<img src="data:images/5.jpg"/>
<img src="data:images/6.jpg"/>
<img src="data:images/7.jpg"/>
<img src="data:images/8.jpg"/>
<img src="data:images/9.jpg"/>
<img src="data:images/10.jpg"/>
<img src="data:images/11.jpg"/>
<img src="data:images/12.jpg"/>
<img src="data:images/13.jpg"/>
<img src="data:images/14.jpg"/>
</div>
</div>咱们的小界面部分。
<div class="content_bottom">
<div class="news_item">
<a href="#"><img src="data:images/news1.png"/></a>
<p>吴亦凡 -- 器官的纷争</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news2.png"/></a>
<p>联想企业业务</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news3.png"/></a>
<p>ME</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news4.png"/></a>
<p>聚划算《世界聚在眼前》</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news5.png"/></a>
<p>头条号</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news1.png"/></a>
<p>吴亦凡 -- 器官的纷争</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news2.png"/></a>
<p>联想企业业务</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news3.png"/></a>
<p>ME</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news4.png"/></a>
<p>聚划算《世界聚在眼前》</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news5.png"/></a>
<p>头条号</p>
</div>
</div>
</div>CSS代码
/*===========================================================*/
/* 内容区域 */
/*===========================================================*/
.content{
width: 70%;
height: 1620px;
margin: auto;
}
/*banner、公司介绍、合作企业*/
/*设置详细图片距离顶部标题栏的距离*/
.content_top{
width: 100%;
height: 690px;
margin-top: 130px;
}
/*横幅*/
.content_banner{
width: 100%;
height: 490px;
}
/*设置标题栏下 图片的 尺寸*/
.content_banner .img_bannder{
width: 100%;
height: 420px;
/*position: relative;*/
}
/*设置提示语大小颜色*/
.banner_title_bg{
margin-top: -3px;
text-align: center;
background-color: rgba(0, 0, 0, 0.5);
color: white;
padding: 5px 0px;
}
.xiaodiandian{
margin-top: 10px;
text-align: center;
}
.dian{
display: inline;
}
/*公司介绍*/
/*设置公司介绍所占得位置大小*/
.content_introduce{
width: 100%;
height: 80px;
}
.line{
margin: 0px 10px;
background-color: gray;
height: 1px;
/*透明Opacity：调整元素透明度。*/
opacity: 0.1;
}
/*设置介绍文字的样式*/
.introduce{
padding: 10px;
font-size: 13px;
color: darkgray;
line-height: normal;
}
/*合作企业底部图片大小*/
.content_company{
width: 100%;
height: 100px;
}
div.company_logo{
text-align: center;
}
div.company_logo img{
width: 60px;
height: 38px;
/*须要注意：当设置属性为四个时， 属性分别相应 上 右 下 左 */
padding: 10px 10px 0px 10px;
}
/*===========================================================*/
/* 视频展示 */
/*===========================================================*/
/*首先设置每个视频图片居中*/
.content_bottom{
width: 100%;
height: 830px;
text-align: center;
}
/*接下来来规定一下图片的位置尺寸*/
.news_item{
/*这里设置 28% 主要是由于想一行 放入三列 28% * 3 = 84% 详细看实际情况而定*/
width: 28%;
height: 150px;
float: left;
text-align: center;
margin: 20px;
background-color: white;
/*设置圆角 3 px 像素*/
border-radius: 3px;
box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5);
}
/*设置背景图片*/
.news_item img{
width: 100%;
height: 78%;
border-radius: 3px;
}
/*设置图片文字*/
.news_item p{
text-align: center;
padding: 5px;
color: rgba(0, 0, 0, 0.5);
}
/*设置鼠标放上去。透明度减少*/
a:hover{
opacity: 0.5;
}这时候应该就已经设置完主体和头部了。那我们离完毕也就不远了。
我们继续来设置我们的文章结尾。
<div class="footer">
<table>
<tr>
<td class="one">
<img src="data:images/contact1.jpg"/>
<img src="data:images/contact2.jpg"/>
<img src="data:images/contact3.jpg"/>
</td>
<td class="two">
<p class="vertical_line"></p>
</td>
<td class="three">
<img class="footer_logo" src="data:images/footer_logo.jpg"/>
<p>Infini Studio | 映纷创意</p>
<p>北京市朝阳北路107号院</p>
<p>Email:infinistudio@foxmail.com</p>
<p>QQ:7585917</p>
<p>weibo:@InfiniStudio</p>
</td>
</tr>
</table>
</div>CSS 代码部分
/*===========================================================*/
/* 尾部 */
/*===========================================================*/
/*设置尾部距离*/
.footer{
width: 100%;
height: 215px;
background-color: rgb(224, 224, 224);
margin-bottom: 40px;
}
/*更改尾部图片大小*/
.footer img{
width: 36px;
height: 30px;
margin-top: 5px;
}
/*更改文字大小*/
.footer p{
color: gray;
padding: 3px 0px;
font-size: 15px;
}
table{
width: 100%;
}
td.one{
width: 48%;
text-align: right;
/*设置元素的垂直对齐方式*/
vertical-align: top;
}
td.two{
width: 1%;
text-align: center;
height: 100%;
}
.vertical_line{
margin-top: 5px;
height: 195px;
width: 1px;
background-color: gray;
opacity: 0.2;
}
td.three{
width: 48%;
text-align: left;
}
img.footer_logo{
margin-top: -10px;
width: 145px;
height: 60px;
}这时候，咱们的界面首页就基本完毕了，可是还是有很多的功能须要优化，可是咱们如今所学习的水平有限，等咱们技术好一点了，我会带着大家，用更高级的方式，从新制作一次这个界面。
欢迎大家留言挖坟。
今天就到这里。欢迎大家跟着我，每天10分钟，一起学习 H5.
附录：
代码源代码：
html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="css/layout.css">
</head>
<body>
<div class="header">
<a href="#"><img src="data:images/title2.png"/></a>
<ul>
<li><a href="#">HOME</a></li>
<li><a href="#">WORK</a></li>
<li><a href="#">CONTACT</a></li>
<li><a href="#">JOIN US</a></li>
</ul>
</div>
<div class="content">
-
<div class="content_top">
<div class="content_banner">
<a href="#" class="img_bannder"><img class="img_bannder" src="data:images/banner.jpg" alt="" /></a>
<p class="banner_title_bg">
优酷2014全视频之夜
</p>
<div class="xiaodiandian">
<p class="dian"> ・ </p>
<p class="dian"> . </p>
<p class="dian"> ・ </p>
<p class="dian"> ・ </p>
<p class="dian"> ・ </p>
<p class="dian"> ・ </p>
</div>
</div>
<div class="content_introduce">
<p class="line"></p>
<p class="introduce"> Infini Studio (映纷创意)是一家创意设计机构，专注于品质型动画影像的创意与设计。我们使用设计、动画、特效及多种创新形式（Motion Graphic），将信息与内容进行动态视觉化创意呈现。并由动画导演、设计师、插画师、三维艺术家共同协作完毕。
服务的范围包括广告、影视、交互、新媒体等。
</p>
</div>
<div class="content_company">
<p class="line"></p>
<div class="company_logo">
<img src="data:images/1.jpg"/>
<img src="data:images/2.jpg"/>
<img src="data:images/3.jpg"/>
<img src="data:images/4.jpg"/>
<img src="data:images/5.jpg"/>
<img src="data:images/6.jpg"/>
<img src="data:images/7.jpg"/>
<img src="data:images/8.jpg"/>
<img src="data:images/9.jpg"/>
<img src="data:images/10.jpg"/>
<img src="data:images/11.jpg"/>
<img src="data:images/12.jpg"/>
<img src="data:images/13.jpg"/>
<img src="data:images/14.jpg"/>
</div>
</div>
</div>
<div class="content_bottom">
<div class="news_item">
<a href="#"><img src="data:images/news1.png"/></a>
<p>吴亦凡 -- 器官的纷争</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news2.png"/></a>
<p>联想企业业务</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news3.png"/></a>
<p>ME</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news4.png"/></a>
<p>聚划算《世界聚在眼前》</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news5.png"/></a>
<p>头条号</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news1.png"/></a>
<p>吴亦凡 -- 器官的纷争</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news2.png"/></a>
<p>联想企业业务</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news3.png"/></a>
<p>ME</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news4.png"/></a>
<p>聚划算《世界聚在眼前》</p>
</div>
<div class="news_item">
<a href="#"><img src="data:images/news5.png"/></a>
<p>头条号</p>
</div>
</div>
</div>
<div class="footer">
<table>
<tr>
<td class="one">
<img src="data:images/contact1.jpg"/>
<img src="data:images/contact2.jpg"/>
<img src="data:images/contact3.jpg"/>
</td>
<td class="two">
<p class="vertical_line"></p>
</td>
<td class="three">
<img class="footer_logo" src="data:images/footer_logo.jpg"/>
<p>Infini Studio | 映纷创意</p>
<p>北京市朝阳北路107号院</p>
<p>Email:infinistudio@foxmail.com</p>
<p>QQ:7585917</p>
<p>weibo:@InfiniStudio</p>
</td>
</tr>
</table>
</div>
</body>
</html>
CSS 代码：
/*首先来设置整个界面的文字样式，清除边距*/
*{
margin: 0px;
font-size: 17px;
font-family: "黑体";
}
/*为整个代码区域附上一个灰色的背景色*/
body{
background-color: rgb(242 , 242, 242);
}
/*===========================================================*/
/* 头部 */
/*===========================================================*/
.header{
width: 100%;
height: 113px;
background-color: rgba(0, 0, 0, 0.5);
/*元素框从文档流全然删除，并相对于其包括块定位。
包括块可能是文档中的还有一个元素或者是初始包括块。
元素原先在正常文档流中所占的空间会关闭。就好像元素原来不存在一样。
元素定位后生成一个块级框，而不论原来它在正常流中生成何种类型的框。
只是其包括块是视窗本身.*/
position: fixed;
/*设置图片居中*/
text-align: center;
/*设置阴影效果 属性分别相应 ： 横向距离 竖向距离 阴影距离 阴影颜色*/
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.5);
}
/*调整头部 logo 尺寸*/
.header img{
margin: 15px;
width: 140px;
height: 55px;
}
ul{
list-style-type: none;
}
ul a{
/*text-decoration: underline; 下滑线*/
/*text-decoration: line-through; 删除线*/
/*取消a的下滑线*/
text-decoration: none;
}
a{
color: rgba(255, 255, 255, 0.5);
}
/*伪类代码 a:hover 当我们的鼠标放在我们的 a 标签上，咱们能够去设置颜色或者大小等*/
a:hover{
color: white;
}
li{
/* display 属性规定元素应该生成的框的类型:默认inline。此元素会被显示为内联元素，元素前后没有换行符。*/
display: inline;
/*设置边距 属性为两个的时候，第一个属性设置上下高度 第二个属性设置左右宽度*/
margin: 0px 30px;
padding:0px 20px;
}
/*===========================================================*/
/* 内容区域 */
/*===========================================================*/
.content{
width: 70%;
height: 1620px;
margin: auto;
}
/*banner、公司介绍、合作企业*/
/*设置详细图片距离顶部标题栏的距离*/
.content_top{
width: 100%;
height: 690px;
margin-top: 130px;
}
/*横幅*/
.content_banner{
width: 100%;
height: 490px;
}
/*设置标题栏下 图片的 尺寸*/
.content_banner .img_bannder{
width: 100%;
height: 420px;
/*position: relative;*/
}
/*设置提示语大小颜色*/
.banner_title_bg{
margin-top: -3px;
text-align: center;
background-color: rgba(0, 0, 0, 0.5);
color: white;
padding: 5px 0px;
}
.xiaodiandian{
margin-top: 10px;
text-align: center;
}
.dian{
display: inline;
}
/*公司介绍*/
/*设置公司介绍所占得位置大小*/
.content_introduce{
width: 100%;
height: 80px;
}
.line{
margin: 0px 10px;
background-color: gray;
height: 1px;
/*透明Opacity：调整元素透明度；*/
opacity: 0.1;
}
/*设置介绍文字的样式*/
.introduce{
padding: 10px;
font-size: 13px;
color: darkgray;
line-height: normal;
}
/*合作企业底部图片大小*/
.content_company{
width: 100%;
height: 100px;
}
div.company_logo{
text-align: center;
}
div.company_logo img{
width: 60px;
height: 38px;
/*须要注意：当设置属性为四个时， 属性分别相应 上 右 下 左 */
padding: 10px 10px 0px 10px;
}
/*===========================================================*/
/* 视频展示 */
/*===========================================================*/
/*首先设置每个视频图片居中*/
.content_bottom{
width: 100%;
height: 830px;
text-align: center;
}
/*接下来来规定一下图片的位置尺寸*/
.news_item{
/*这里设置 28% 主要是由于想一行 放入三列 28% * 3 = 84% 详细看实际情况而定*/
width: 28%;
height: 150px;
float: left;
text-align: center;
margin: 20px;
background-color: white;
/*设置圆角 3 px 像素*/
border-radius: 3px;
box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5);
}
/*设置背景图片*/
.news_item img{
width: 100%;
height: 78%;
border-radius: 3px;
}
/*设置图片文字*/
.news_item p{
text-align: center;
padding: 5px;
color: rgba(0, 0, 0, 0.5);
}
/*设置鼠标放上去，透明度减少*/
a:hover{
opacity: 0.5;
}
/*===========================================================*/
/* 尾部 */
/*===========================================================*/
/*设置尾部距离*/
.footer{
width: 100%;
height: 215px;
background-color: rgb(224, 224, 224);
margin-bottom: 40px;
}
/*更改尾部图片大小*/
.footer img{
width: 36px;
height: 30px;
margin-top: 5px;
}
/*更改文字大小*/
.footer p{
color: gray;
padding: 3px 0px;
font-size: 15px;
}
table{
width: 100%;
}
td.one{
width: 48%;
text-align: right;
/*设置元素的垂直对齐方式*/
vertical-align: top;
}
td.two{
width: 1%;
text-align: center;
height: 100%;
}
.vertical_line{
margin-top: 5px;
height: 195px;
width: 1px;
background-color: gray;
opacity: 0.2;
}
td.three{
width: 48%;
text-align: left;
}
img.footer_logo{
margin-top: -10px;
width: 145px;
height: 60px;
}
2016.3.15__H5页面实战__第七天的更多相关文章
- SAS数据挖掘实战篇【七】
SAS数据挖掘实战篇[七] 6.5 SAS EM数据挖掘-----预测模型 1 问题定义 目标:建立模型预测贷款申请的信用状态,选择最优的模型来预测和减少损失. 数据集:SAMPSIO.DMAGE ...
- WinDbg调试CPU占用高的问题 试验+实战 《第七篇》
一.High CPU试验 1.示例代码 static void Main(string[] args) { Console.Clear(); Console.WriteLine("到命令行下 ...
- 数据库技术丛书:SQL Server 2016 从入门到实战(视频教学版) PDF
1:书籍下载方式: SQL Server2016从入门到实战 PDF 下载 链接:https://pan.baidu.com/s/1sWZjdud4RosPyg8sUBaqsQ 密码:8z7w 学习 ...
- Spring Boot 2.0 返回JSP页面实战
1. 模板引擎JSP的限制 在开始之前呢,我觉得我们有必要先去了解下 Spring Boot 2.0 官方文档中提到的如下内容: 模板引擎 除了REST Web服务之外,还可以使用Spring MVC ...
- 构建NetCore应用框架之实战篇（七）：BitAdminCore框架登录功能源码解读
本篇承接上篇内容,如果你不小心点击进来,建议从第一篇开始完整阅读,文章内容继承性连贯性. 构建NetCore应用框架之实战篇系列 一.简介 1.登录功能完成后,框架的雏形已经形成,有必要进行复习. 2 ...
- Android 使用SwipeBackLayout实现滑动返回上一级页面——实战来袭
我们知道.APP在设计上习惯性的把返回button放在屏幕的左上角,那么,在非常多时候(尤其是大屏幕手机),操作改返回button,就会有诸多不便了.为了更加方便实现"返回"功能. ...
- 2016.11.29 activiti实战--第19章--统一身份管理（含自定义用户与数组的实现）
学习资料:<Activiti实战> 第十九章 统一身份管理 本章讲解如何统一业务系统与activiti的用户管理系统. 第5章的时候已经讲解过activiti的用户与组.一般来说业务系统都 ...
- 基于 abp vNext 和 .NET Core 开发博客项目 - Blazor 实战系列（七）
系列文章 基于 abp vNext 和 .NET Core 开发博客项目 - 使用 abp cli 搭建项目 基于 abp vNext 和 .NET Core 开发博客项目 - 给项目瘦身,让它跑起来 ...
- 【无私分享：ASP.NET CORE 项目实战（第七章）】文件操作 FileHelper
目录索引 [无私分享:ASP.NET CORE 项目实战]目录索引 简介 在程序设计中,我们很多情况下,会用到对文件的操作,在 上一个系列 中,我们有很多文件基本操作的示例,在Core中有一些改变,主 ...
随机推荐
- HDU 5778 abs （暴力枚举）
abs Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 131072/131072 K (Java/Others) Problem De ...
- XtraBackUp 热备份工具
是一款强大的在线热备份工具 备份的过程中,不锁表 使用percona-xtrabackup-24-2.4.7-1.el7.x86_64.rpm yum源安装: 1.安装Percona的库: ...
- chart 图片组件 生成后不能动态更新，需要销毁dom，从新载入 用 v-if 和 this.$nextTick(() => {
<chart-box v-if="cbData1Bool" cb-text="基本概况" chartBoxSele="饼状图" :cb ...
- 监控java进程是否正常运行
@echo off set _task=java.exe :checkstart for /f "tokens=1" %%n in ('tasklist ^| find " ...
- 解决sqlplus无法退格问题
# wget http://download.openpkg.org/components/cache/rlwrap/rlwrap-0.42.tar.gz # tar -zxf rlwrap-0. ...
- 用springmvc的@RequestBody和@ResponseBody 接收和响应json格式数据
1.controller @Controller @RequestMapping("/rest/v1") public class WelcomeController { @Req ...
- 条款8：别让异常逃离析构函数（prevent exception from leaving destructors）
NOTE: 1.析构函数绝对不要吐出异常.如果一个被析构函数调用的函数可能抛出异常,析构函数应该扑捉任何异常,然后吞下他们(不传播)或结束程序. 2.如果客户需要对某个操作函数运行期间抛出的异常做出反 ...
- Ubuntu16.04安装MySql5.7
安装方式有好多种,这里选择使用APT安装. 主要参考文档为官方文档:https://dev.mysql.com/doc/mysql-apt-repo-quick-guide/en/#apt-repo- ...
- [MVC]Controller
1,控制器中所有的动作方法必须声明为public,如声明为private或protected,将不被视为动作方法. 如果将Action声明为private,或者是添加[NonAction]属性,则不对 ...
- cf842d Vitya and Strange Lesson
#include <iostream> #include <cstdio> using namespace std; int s[2000005][2], cnt, n, m, ...