学习内容

  • 水平导航菜单
  • 垂直导航菜单
  • 下拉式导航菜单

能力目标

  • 制作tab标签导航菜单
  • 制作带箭头的导航菜单
  • 制作带信息提示的导航菜单
  • 制作垂直下拉导航菜单
  • 制作水平下拉导航菜单

本章简介

上一章节中讲解了 background 属性的用法，以及两种主流的背景特效——页面图片整合技术以及滑动门技术，设计师可以使用这两种技术制作出多种页面背景特效，如平滑投票、Tab 导航菜单等。

在Web 应用中，除了布局设计外，页面导航栏的设计也是站点设计中的一个重要组成部分，网站中的页面导航栏用于使用户在浏览时有明确的方向，可以快速地链接到相关内容页面，从而节省用户查找页面的时间，提高访问效率。所以，页面设计时需要选择合适的导航菜单，从而使页面的视觉效果更加清晰，操作更加方便、快捷。页面导航的形式主要包括水平导航菜单、垂直导航菜单以及下拉式导航菜单等，本章内容即将详细地讲解上述导航菜单的制作过程。

核心技能部分

5.1 水平导航菜单

门户网站中主导航菜单通常使用水平导航菜单，这是因为门户网站中的内容比较多，而且每个频道都有不同的样式区别。因此在页面的顶部设计一个风格而且不占用过多空间的水平导航菜单是最理想的选择。水平导航菜单分为横向文本导航和tab导航两种风格。

5.1.1      横向文本导航

横向文本导航适用于页面频道丰富且风格多样的大型网站，如网易、腾讯、MSN等，图 5.1.1即为网易首页。

横向文本导航实现思路：

使用 div搭建导航框架。网易的导航菜单主要分为站标和内容两部分，站标区不覆盖其他文字，可直接使用 img标签插入网易站标。使用 ul和 li搭建内容部分，ul 中使用两个 li方法分行显示内容块，再使用若干超链接定义菜单。

实现步骤：

（1）          使用 div和ul搭建导航菜单框架，代码如下：

<div class="globalMenu">
<div class="title">
    网站logo
</div>
<div class="content">
<div class="menu s1 stroke">
   <ul>
       <li>第一栏第一行</li>
       <li class="lineH">第一栏第二行</li>
   </ul>
</div>
<div class="menu s1 stroke">
   <ul>
       <li>第二栏第一行</li>
       <li class="lineH">第二栏第二行</li>
   </ul>
</div>
</div>
</div>
（2）          向结构中添加内容，代码片断如下：
<ul>
   <li>
    <ahref="#" class="tip">新闻</a>　
    <ahref="#">军事</a>
    <ahref="#">图片</a>
    <a href="#">评论</a>
   </li>
    <liclass="lineH">
    <ahref="#" class="tip">体育</a>　
    <ahref="#">篮球</a>
    <ahref="#">足球</a>
    <ahref="#">跳水</a>
   </li>
</ul>

（3）          定义每个组成部分的样式规则。globalMenu为导航栏容器样式，采用 ul 和 li将其分隔两行；title 为网站 logo样式；content为导航内容样式。其样式代码如下

<style type="text/css">
body {margin-top:250px;font-size:12px; }
div,img,ul,ol{margin: 0; padding: 0; border: 0; }
/* 超链接样式 */
a:link {color: #1f3a87;text-decoration:none;}
a:visited {color: #83006f;text-decoration:none;}
a:hover {color: #bc2931; text-decoration:underline;}
a:active {color: #bc2931;}
/* 导航容器*/
.globalMenu{
    margin:0auto;
    width:550px;
    height:45px;
    background:#fff;
    border:1pxsolid #CBCBCB;
}
/*导航Logo部分*/
.globalMenu .title{
    float:left;
    width:140px;
    padding:6px0 0;
    text-align:center;
}
/*导航内容部分*/
.globalMenu .content{
    float:left;
    width:400px;
    margin:5px0 0;
}
/*定义菜单栏样式*/
.globalMenu .content .menu{
    float:left;
    overflow:hidden;
    height:36px;
    width:150px;
    border-right:1pxsolid #ccc;/*定义菜单栏目的右边框*/
}
.globalMenu .content .menu li{
    text-align:left;
    padding:2px0 0 10px;
    list-style-type:none;
}
.globalMenu .content .lineH{
    line-height:22px;
}
.globalMenu .content .tip{
    font-weight:bold;
}
</style>

5.1.1      Tab导航

导航菜单文本内容较少时，建议使用tab导航。这样可以强化页面视觉效果，拍拍购物网站即采用该导航形式，如图 5.1.3所示。

实现思路：

使用 div搭建菜单容器，采用无序列表ul 和 li标签实现菜单结构，a标签定义内容；使用float属性定义 li标签为浮动元素，display属性结合width、height定义超链接大小。

实现步骤：

（1）       定义导航菜单结构，代码如下：

<body>
<div id="navlist">
<ul>
    <li><a href="#">首页</a></li>
    <li><a href="#">商城</a></li>
    <li><a href="#">全球购</a></li>
    <li><a href="#">拍卖</a></li>
    <li><a href="#">礼物</a></li>
    <li><a href="#">促销</a></li>
</ul>
</div>
</body>

（2）       定义无序列表样式规则，代码如下：

<style type="text/css">
#navlist ul{
    list-style-type:none;
}
#navlist li{
    float: left;
}
#navlist li a{
    color: #000000;
    text-decoration: none;
    display: block;
    padding-top: 4px;
    width: 97px;
    height: 22px;
    text-align: center;
    background-color: #ECECEC;
    margin-left: 2px;
}
#navlist li a:hover{
    background-color: #BBBBBB;
    color: #FFFFFF;
}
</style>

5.1 垂直导航菜单

垂直导航是网站导航的另一种重要形式，它是指将导航菜单安放于页面左右两侧并进行自上而下排列的导航形式。一些大型购物网站如当当网、淘宝网等采用该导航形式进行商品分类，如图5.1.5所示。

垂直导航菜单形式多样，以下列举两种常见的垂直导航：箭头导航和提示信息导航。

5.1.1      箭头导航

箭头导航的主要优点在于导航的直观性，如图 5.1.6、图 5.1.7所示。

实现思路：

在 CSS 中，设置 span标签的宽度和高度为 0；加粗边框，设置上下边框的颜色为白色，左右边框的颜色为深色，实现代码如下。

5.1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"content="text/html; charset=gb2312" />
<title>箭头效果</title>
<style type="text/css">
span{
    display:block;/*设置为块级元素*/
    position:absolute;/*使用绝对定位*/
    height:0;
    width:0;
    border:solid50px #fff;/*设置默认的边框样式*/
    overflow:hidden;/*隐藏超出范围的内容*/
    border-left-color:#f00;/*左边框的颜色*/
    border-right-color:#f00;/*右边框的颜色*/
}
</style>
</head>
<body>
<span></span>
</body>
</html>
箭头导航由若干超链接构成，每个超链接文本前后添加绝对定位的 span标签，以设置左右箭头span标签在链接状态下隐藏、悬停状态下显示。
实现步骤：
（1）       制作导航菜单结构，代码如下：
<body>
<div id="menu">
    <a href="#"><spanclass="left"></span>首页<span class="right"></span></a>
    <a href="#"><spanclass="left"></span>相册<span class="right"></span></a>
    <ahref="#"><span class="left"></span>日志<spanclass="right"></span></a>
    <a href="#"><spanclass="left"></span>留言<span class="right"></span></a>
    <a href="#"><spanclass="left"></span>朋友<span class="right"></span></a>
</div>
</body>
（2）       编写span和a标签样式规则，代码如下：
<style type="text/css">
#menu {
    font-family:Arial;
    font-size:16px;
    width:140px;
    margin:0 auto;
    border: 3px double #ccc;
}
#menu a {
    text-decoration:none;/*文字无下划线*/
    text-align:center;/*文字水平居中对齐*/
    display:block;/*设置为块级元素*/
    padding:4px;/*内边距*/
    background-color:#fff;
    border:1px solid  #fff;
    position:relative;/*使用相对定位*/
    width:130px;
}
#menu a span {
    display:none;
}
#menu a:hover span {
    display:block; /*设置为块级元素*/
    position:absolute;/*使用绝对定位*/
    height:0;/*高度为0*/
    width:0; /*宽度为0*/
    border:solid 8px #fff;/*设置默认的边框样式*/
    top:4px;/*竖直方向的定位*/
    overflow:hidden;
}
#menu a:hover span.left {
    border-left-color:#00f;
    left:8px;
}
#menu a:hover span.right {
    border-right-color:#00f;
    right:8px;
}
</style>

上述代码中，链接要求设置为相对定位，为绝对定位的span标签提供定位参考，效果如图 5.1.8所示；否则，span标签就近寻找包含块为基准进行定位，如本例中超链接没有设置为相对定位，span标签将以body为基准定位

#menu a:hover span.intro {

font-size:12px;

display:block;

position:absolute; /*绝对定位*/

left:150px;

top:0px;

padding:5px;

width:100px;

height:auto;

background-color:#eee;

color:#000;

border:1px dashed #234;

}

注意：提示框不能挤压其他元素，制作方式应与箭头类似；采用绝对定位，并保证脱离标准文档。

5.1 下拉式导航菜单

当页面版式比较紧凑时，页面设计适合使用下拉式导航菜单。该菜单形式充分利用现有空间并分类显示页面内容，如娃哈哈企业网等采用该菜单形式，如图 5.1.11所示。

5.1.1      垂直列表下拉导航

垂直列表下拉导航如图 5.1.12所示。ily:"Times New Roman";mso-hansi-font-family:"Times New Roman";mso-bidi-font-family:"Times New Roman";mso-font-kerning:1.0pt;mso-ansi-language:EN-US;mso-fareast-language:ZH-CN;mso-bidi-language:AR-SA'>所示。

实现思路：

垂直列表下拉导航采用无序列表嵌套定义的方式实现，嵌套ul作为二级子菜单；一级菜单中定义li为浮动元素且向左浮动，并保证在一条水平线上。

实现步骤：

（1）       定义垂直列表下拉导航结构，代码如下：

<div class="menu">
   <ul>
       <li><a href="#" >首页</a></li>
       <li><a href="#" >新闻</a>
           <ul>
               <li><a href="#">国际新闻</a></li>
               <li><a href="#">国内新闻</a></li>
               <li><a href="#">体育新闻</a></li>
          </ul>
     </li>
       <li><a href="#" id="current">财经</a>
           <ul>
               <li><a href="#">股票市场</a></li>
                <li><a href="#">证券行情</a></li>
                <li><a href="#">保险代理</a></li>
           </ul>
     </li>
       <li><a href="#">联系我们</a></li>
   </ul>
</div>
（2）       定义一级菜单样式规则，代码如下：
.menu{
    border:none;
    font-family:verdana,geneva,arial,helvetica,sans-serif;
    font-size:14px;
    font-weight:bold;
    color:8e8e8e;
}
.menu ul{
    background:url(menu-bg.gif)top left repeat-x;
    height:43px;
    list-style:none;
}
.menu li{
    float:left;
}
.menu li a{
    color:#666666;
    display:block;
    font-weight:bold;
    line-height:43px;
    padding:0px25px;
    text-align:center;
    text-decoration:none;
}
.menu li a:hover{
    color:#000000;
}
（3）       定义二级菜单样式规则，代码如下：
.menu li ul{
    background:#e0e0e0;
    border-left:2pxsolid #0079b2;
    border-right:2pxsolid #0079b2;
    border-bottom:2pxsolid #0079b2;
    display:none;
    height:auto;
    position:absolute;
    width:130px;
    z-index:200;
}
.menu li:hover ul{
    display:block;
}
.menu li li {
    display:block;
    width:130px;
}
.menu li ul a{
    display:block;
    font-size:12px;
    text-align:left;
}
.menu li ul a:hover{
    background:#949494;
    color:#000000;
}
当鼠标悬停于一级菜单时，使用display：block；显示嵌套的无序列表。
（4）       设置当前选中菜单样式，代码如下：
.menu #current{
    background:url(current-bg.gif)top left repeat-x;
    color:#ffffff;
}

5.1.1      水平列表下拉导航

水平列表下拉导航

实现思路：

水平列表下拉导航在垂直列表导航菜单基础上实现，使用float:left；设置嵌套 li 为浮动元素，并保证所有li元素水平显示。

实现步骤：

（1）       水平列表下拉导航结构与垂直列表下拉导航菜单的结构相同。

（2）       定义嵌套ul 的样式规则，代码如下： 

.menu li ul{
    background:#e0e0e0;
    border-left:2pxsolid #0079b2;
    border-right:2pxsolid #0079b2;
    border-bottom:2pxsolid #0079b2;
    display:none;
    height:auto;
    position:absolute;/*绝对定位*/
    width:225px;
    z-index:200;
}
.menu li:hover ul{
    display:block;/*块状显示*/
    width:auto;/*宽度自适应*}
.menu li ul li {
    float:left;
    border-left:1pxsolid white;
    line-height:1.5em;/*设置高度为1.5个字宽*/
}

定义嵌套ul 的样式规则时，需要设置ul为绝对定位，并脱离标准文档流，否则一级菜单宽度将被改变

本章总结

在这一章里制作2个垂直方向的导航菜单。需要读者特别注意的有几个CSS基础知识和技巧。

（1）      相邻盒子的margin的垂直方向相遇的“塌陷”现象，水平方向则没有该现象。

（2）      在一些列盒子排列之后，如何对头尾盒子进行单独的样式设置，可以为它们单独设置类别，或者是伪类，但需要注意浏览器对伪类的支持情况。

（3）      通过粗边框的颜色设置可以产生出斜角效果，如果充分利用可以产生有趣的效果。

（4）      为了防止鼠标指针经过时造成边框的跳动，可以在通常状态添加与背景色相同的边框。

（5）      相对定位的含义是以自身原来所在的位置为基准进行偏移。

（6）      “包含块”的定义方法，绝对定位是以包含块为基准进行偏移。

为了使某个盒子绝对定位，它的上一级元素可以设为相对定位，从而变成“包含块”。

任务实训部分

实训任务1：双竖线菜单

训练技能点

Ø        利用border-left：和border-right制作双竖线菜单

需求说明

实现思路

（1）       每个菜单的左右两个边都有一条竖线，当鼠标指针划过时，竖线由灰色变为黑色。

（2）       菜单文字变为红色。

代码 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"content="text/html; charset=gb2312" />
<title>双竖线菜单</title>
</head>
<style type="text/css">
    #menu
    {
      width:120px;
      background:#ccc;
      font-family:Arial;
      font-size:14px;
      padding:8px;
      margin:0 auto;
    }
    #menu a,#menu a:visited
    {
      display:block;
      background-color:#fff;
      padding:4px 8px;
      color:#000;
      text-decoration:none;
      margin:8px 0;
      border-left:8px solid #9ab;
      border-right:8px solid #9ab;
    }
    #menua#first,#menu a#last
    {
      margin:0px;
    }
    #menua:hover
    {
      color:#f00;
      border-left:8px solid #000;
      border-right:8px solid #000;
    }
</style>
<body>
<div id="menu">
       <a href="#"id="first"> Home </a>
       <a href="#"> Contact</a>
       <a href="#"> Web Dev</a>
       <a href="#"> WebDesign</a>
       <a href="#"id="last"> Map</a>
</div>
</body>
</html>

实训任务2：双斜角横线菜单

训练技能点

Ø        使用相对流动定位设置页面元素位置

Ø       使用background-position属性定位背景

Ø       使用background-repeat属性设置平铺效果

需求说明

双斜角横线菜单

实现思路

（1）       与上一个案例不同之处在于，这里为了使菜单的文字之间有一定空白，并且使文字在菜单项中垂直居中，没有采用padding来实现。

关键代码： 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"content="text/html; charset=gb2312" />
<title>双斜角横线菜单</title>
</head>
<style type="text/css">
     #menu
     {
       width:9em;
       margin:0auto;
       font-family:Arial;
       font-size:14px;
       border:solid 1px #aaa;
     }
     #menu a,#menu a:visited
     {
       display:block;
       text-decoration:none;
       color:#000;
       line-height:1.4em;
       border:0.5em solid #fff;
     }
     #menu a:hover
     {
       color:#fff;
       background-color:#aaa;
       border-color:#ddd #aaa;
     }
</style>
<body>
<div id="menu">
    <ahref="#"> Home</a>
    <ahref="#"> Contact Us</a>
    <ahref="#"> Web Dev</a>
    <ahref="#"> Web Design</a>
    <ahref="#"> Map</a>
</div>
</body>
</html>

实训任务3：立体菜单

训练技能点

Ø        使用DIV+UL搭建垂直菜单框架

需求说明

立体菜单，效果如图��;mso-ascii-font-family:"Times New Roman";mso-hansi-font-family:"Times New Roman"'>使用background-position属性定位背景

Ø       使用background-repeat属性设置平铺效果

需求说明

双斜角横线菜单

实现思路

（1）       使用DIV+CSS搭建页面框架。

（2）       使用DIV+UL搭建导航菜单框架。

（3）       使用<div style=”clear:both”></div>实现浮动清除。

关键代码： 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"content="text/html; charset=gb2312" />
<title>立体菜单</title>
</head>
<style type="text/css">
      #menu
      {
        font-family:Arial;
        font-size:14px;
      }
      #menu a,#menu a:visited
      {
        text-decoration:none;
        text-align:center;
        color:#fff;
        display:block;
        width:10em;
        padding:0.25em;
        margin:0.5em auto;
        background-color:#8ab;
        border:2px solid #fff;
        position:relative;
      }
      #menu a:hover
      {
        top:2px;
        left:2px;
        border-color:#345 #cde #def #678;
      }
</style>
<body>
    <divid="menu">
         <a href="#"> Home</a>
         <a href="#"> ContactUs</a>
         <a href="#"> Web Dev</a>
         <a href="#"> WebDesign</a>
         <ahref="#"> Map</a>
    </div>
</body>
</html>

实训任务4：制作淘宝商城二级菜单

需求说明

完成淘宝商城二级菜单/b>

Ø       使用background-repeat属性设置平铺效果

需求说明

双斜角横线菜单

提示：

（1）       搭建二级菜单框架，代码如下： 

  <ulclass="menu">
      <li>
          <strong>珠宝饰品</strong>
          <div class="subcontent" style="z-index:199; top:-20px;color:#C3C;">
              <ul>
                   <li><a href="#">品牌手表/卡西欧</a></li>
                   <li><a href="#">流行手表/时尚腕表</a></li>
                   <li><a href="#">男生手表</a></li>
                   <li><a href="#">女生手表</a></li>
                   <li><a href="#">珠宝钻石</a></li>
                   <li><a href="#">天然翡翠</a></li>
                   <li><a href="#">18K黄金/18k白金</a></li>
                   <li><a href="#">宝石/红宝石/蓝宝石</a></li>
                   <li><a href="#">铂金/钯金</a></li>
                   <li><a href="#">饰品/流行首饰/日韩货</a></li>
              </ul>
             <b style="top:25px;"></b>
          </div>
      </li>
      <li><strong>运动护卫</strong></li>
      <li><strong>手机数码</strong></li>
      <li><strong>家居生活</strong></li>
      <li><strong>家纺床品</strong></li>
      <li><strong>家电家具</strong></li>
      <li><strong>图书音像</strong></li>
      <li><strong>服饰鞋包</strong></li>
      <li><strong>丝质衣服</strong></li>
      <li><strong>绸缎衣服</strong></li>
       <li><strong>时尚经典</strong></li>
      <li><strong>黑色世界</strong></li>
      <li><strong>紫色蓝宝</strong></li>
</ul>

（2）       定义subcontent的样式规则，参考代码如下： 

/*二级菜单样式*/
.subcontent {
    font-size:12px;
    width:200px;
    display:none;
    position:absolute;/*绝对定位，是subcontent脱离标准文档流*/
    left:146px;
    top:-6px;
    background-color:#FFF  ;/*灰色*/
    border:2pxsolid #e27687;/*红色*/
    z-index:200;
}

（3）       定义b标签的样式规则，覆盖subcontent的左边框，使subcontent产生箭头效果，代码如下： 

/*覆盖subcontent的左边框 使subcentent产生箭头效果*/
.subcontent b{
    background:url(images/sc.png)no-repeat -620px -150px;
    display:block;
    height:17px;
    left:-7px;
    position:absolute;
    top:5px;
    width:18px;
}

（4）       定义鼠标悬停样式，鼠标悬停时显示subcontent，代码如下：

#header #all-items .menu li:hover div{

display:block;

}

WEB入门.九 导航菜单的更多相关文章

  1. ABP入门系列（6）——定义导航菜单

    ABP入门系列目录--学习Abp框架之实操演练 完成了增删改查以及页面展示,这一节我们来为任务清单添加[导航菜单]. 在以往的项目中,大家可能会手动在layout页面中添加一个a标签来新增导航菜单,这 ...

  2. Web标准：四、纵向导航菜单及二级弹出菜单

    Web标准:四.纵向导航菜单及二级弹出菜单 知识点: 1.纵向列表 2.标签的默认样式 3.css派生选择器 4.css选择器的分组 5.纵向二级列表 6.相对定位和绝对定位   1)纵向列表 可以看 ...

  3. Slideout.js – 触摸滑出式 Web App 导航菜单

    Slideout.js 是为您的移动 Web 应用开发的触摸滑出式的导航菜单.它没有依赖,自由搭配简单的标记,支持原生的滚动,您可以轻松地定制它.它支持不同的 CSS3 转换和过渡.最重要的是,它只是 ...

  4. SharePoint自动化系列——Site/Web/List级别的导航菜单

    转载请注明出自天外归云的博客园:http://www.cnblogs.com/LanTianYou/ 需求:在不同的测试用例中,对脚本中不确定的因素需要和用户交互来确定,比如选择哪个site,选择哪个 ...

  5. Web标准：七、横向导航菜单

    Web标准:七.横向导航菜单 知识点: 1.横向列表菜单 2.用图片美化的横向导航 3.css Sprites   1)横向列表菜单 可以在第四节课的基础上来实现横向导航菜单,只要给li一个float ...

  6. Web前端开发实战6：CSS实现导航菜单结合二级下拉式菜单的简单变换

    前面几篇博文都在讲导航菜单和二级下拉式菜单,事实上有非常多方法都能够实现的.详细的情况还要视情况而定. 在后面学习到jQuery框架之后,会有更丰富的动画效果.因为在学习Ajax和jQuery的初步阶 ...

  7. Netsharp快速入门(之6) 基础档案(创建导航菜单)

    作者:秋时 杨昶   时间:2014-02-15  转载须说明出处 1.1     创建导航菜单 1.在Demo节点下,录入路径名称,并在下方录入两个导航页签名 2.建立分类,只要填路径名 3.双击基 ...

  8. web标准(复习)--7 横向导航菜单

    今天我们开始学习html列表,包含以下内容和知识点: 横向列表菜单 用图片美化的横向导航 css Sprites 一.横向列表菜单前边学习过纵向导航菜单,又学习了float属性,那么要实现横向导航菜单 ...

  9. web标准(复习)--4 纵向导航菜单及二级弹出菜单

    今天我们开始学习纵向导航菜单及二级弹出菜单,包含以下内容和知识点: 纵向列表 标签的默认样式 css派生选择器 css选择器的分组 纵向二级列表 相对定位和绝对定位 一.纵向列表纵向列表或称为纵向导航 ...

随机推荐

  1. PHP核心技术——反射

    反射: 反射指在PHP运行状态中,扩展分析PHP程序,导出或提取出关于类.方法.属性.参数等的详细信息,包括注释.这种动态获取信息以及动态调用对象方法的功能称为反射API class person{ ...

  2. Ubuntu下LimeSDR Mini使用说明

    本文内容.开发板及配件仅限用于学校或科研院所开展科研实验! 淘宝店铺名称:开源SDR实验室 LimeSDR链接:https://item.taobao.com/item.htm?spm=a230r.1 ...

  3. Java面试中的Spring方面问题

    1.一般问题 1.1. 不同版本的 Spring Framework 有哪些主要功能? VersionFeatureSpring 2.5发布于 2007 年.这是第一个支持注解的版本.Spring 3 ...

  4. 使用gdb和gdbserver调试Android C/C++程序

    1,http://www.gnu.org/software/gdb/download/,下载最新版本的gdb源代码包,我使用的是gdb-7.6.tar.gz,使用tar命令进行解包(tar -xvzf ...

  5. groupadd命令详解

    基础命令学习目录首页 原文链接:https://wtj6891.iteye.com/blog/2096076 groupadd创建组群 使用groupadd命令可以在系统中创建组群账户 语法: gro ...

  6. poweroff命令详解

    2019-02-17  基础命令学习目录首页   原文链接:https://www.cnblogs.com/Baron-Lu/p/6951297.html 在本篇中,我们会向你解释 shutdown. ...

  7. vue入门之单文件组件

    介绍 在很多 Vue 项目中,我们使用 Vue.component 来定义全局组件,紧接着用 new Vue({ el: '#container '}) 在每个页面内指定一个容器元素. 这种方式在很多 ...

  8. IOS上z-index和fixed定位无效

    IOS上z-index和fixed定位无效 在该元素上加: -webkit-transform:translateZ(1px); -moz-transform:translateZ(1px); -o- ...

  9. Scrum立会报告+燃尽图（Final阶段第二次）

    此作业要求参见:https://edu.cnblogs.com/campus/nenu/2018fall/homework/2481 项目地址:https://coding.net/u/wuyy694 ...

  10. java第四次实验报告

    课程:Java程序与设计     班级:1352 姓 名:池彬宁  小组成员: 20135212池彬宁 20135208贺邦 学号:20135212 成绩:             指导教师:娄嘉鹏  ...