网站的每一处代码都加上注解，以便浏览！

效果图：

<!doctype html>
  <html lang="zh-cn">
  <head>
  <meta charset="utf-8">
  <!--
  width - viewport的宽度 height - viewport的高度
  initial-scale - 初始的缩放比例
  maximum-scale - 允许用户缩放到的最大比例
  user-scalable - 用户是否可以手动缩放 -->
  <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
  <!--导入bootstrap.min.css样式库-->
  <link rel="stylesheet" href="css/bootstrap.min.css">
  <!--导入style样式库-->
  <link rel="stylesheet" href="css/style.css">
  <!--导入bootstrap.min.js库-->
  <title>首页</title>
  </head>
  <!--
  (一)
  导航栏部分的注解：
  顶部导航栏nav标签的使用，HTML5中的新元素标签<nav>用来将具有导航性质的链接划分在一起，使代码结构在语义化方面更加准确，同时对于屏幕阅读器等设备的支持也更好。
   
  第一步：创建<nav></nav>标签。引入样式navbar,样式navbar-default是默认的样式 样式navbar-fixed-top设置是将导航栏固定在顶部，不随页面的滚动而看不见。
  第二步：创建一个div标签。引入了响应式样式容器container的样式，相当一个可以盛放东西的篮子，可以在里面添加东西。
   
  第三步：向 <div> 元素添加一个标题 class .navbar-header。当分辨率够小的时候，有不同的显示button 就是那个选择按钮 span就是横线。折叠起来的导航栏实际上是一个带有 class .navbar-toggle 及两个 data- 元素的按钮。第一个是 data-toggle，用于告诉 JavaScript 需要对按钮做什么，第二个是 data-target，指示要切换到哪一个元素。三个带有 class .icon-bar 的 <span> 创建所谓的汉堡按钮。这些会切换为 .nav-collapse <div> 中的元素。
  注意加data-toggle="collapse"。不然不会出现想要的效果。创建一个<img>标签作为网站的logo。用<a></a>标签提供链接，可以链接到任何一个网站。
   
  第四步：首先创建一个form标签，为其引入navbar-form的样式，navbar-right是在导航栏的右边。设置提交方式为post。method="post"。然后再创建一个<div>标签为<div>引入form-group的样式，<input>设置为text类型的搜索框，（最常见的表单文本字段是输入框 input。用户可以在其中输入大多数必要的表单数据。Bootstrap 提供了对所有原生的 HTML5 的 input 类型的支持，包括：text、password、datetime、datetime-local、date、month、time、week、number、email、url、search、tel 和 color。适当的 type 声明是必需的，这样才能让 input 获得完整的样式。）在里面引入form-control glyphicon-search样式，placeholder 属性提供可描述输入字段预期值的提示信息（hint）。。最后再添加一个button按钮，设置为submit类型，然后再引入样式btn btn-success这是成功的样式。
   
  第五步：首先创建一个<div>为其引入collapse navbar-collaspse样式 为其id加上navbar-collapse。然后创建<ul>标签，为其引入nav navbar-nav navbar-right样式。最后创建<li>标签，想要多少个就加多少个<li>。如果是当前的网页的话，就在<li>引入active的样式，作用是显示当前的网页。用<a>标签提供超链接<span>引入图片样式glyhicon 根据需要可设置不同的图片。这里首页设为glyhicon-home\资讯设置为glyphicon-list-alt\论坛设置为glyphicon-education\关于设置为glyphicon-question-sign。
  以上就是导航栏的注解，需要不同效果可以自行修改设置以达到满意。
  -->
  <!--
  （二）
  轮播图注解：
  轮播（Carousel）插件是一种灵活的响应式的向站点添加滑块的方式。除此之外，内容也是足够灵活的，可以是图像、内嵌框架、视频或者其他您想要放置的任何类型的内容。
  第一步：首先创建一个<div>标签 设置其id为myCarousel 引入carousel slide类样式插件。
  第二步：
  (1)首先创建轮播图下方的点击切换点：
  轮播指标：
  创建<ol>与<li>标签，在<ol>标签中引入carousel-indicatosrs的样式。即我们通常看见的轮播图下方的小点点指标，一点就切换。接下来在多个<li>标签中设置data-target="#myCarousel"，并且再添加data-slide-to="0" ，多个<li>的话以此类推可data-slide="0"上+1。class="active"是为当前图片。#myCarousel即为<a>标签提供标识符，左右点击切换图片。
  (2)轮播图片
  创建轮播图片的第一个<div>，在<div>中引入carousel-inner样式插件。然后创建第二个<div>用于放图片，并且引入item样式,如果是当前图片那么就必不可少这个样式:active。可以通过 .item 内的 .carousel-caption 元素向幻灯片添加标题。接下来在<div>设置背景颜色style="background：XXXXXX"，就是我们看见轮播图背景。
   
  第三步：轮播导航
  使用两个<a>标签，在href中添加#myCarousel用于识别<li>中设置好的#myCarousel。添加data-slide="prev"意思是上一张图片。next是下一张图片。引入carousel-control left样式 left是在左边
  <span> 设置方向图标在<span>中引入glyphicon-chevron-left样式是在轮播图片的左边的方向图片。另一个<a>的<span>中设置glyphicon-chevron-right为右边图标。
   
  加注解
  通过 data 属性：使用 data 属性可以很容易控制轮播（Carousel）的位置。
  属性 data-slide 接受关键字 prev 或 next，用来改变幻灯片相对于当前位置的位置。
  使用 data-slide-to 来向轮播传递一个原始滑动索引，data-slide-to="2" 将把滑块移动到一个特定的索引，索引从 0 开始计数。
  data-ride="carousel" 属性用于标记轮播在页面加载时就开始动画播放。
  -->
  <!-- 轮播（Carousel）指标 -->
  <!--
  (三)
  中间部分媒体对象组件注解：
   
  1.首先创建一个<div>引入tab1样式，tab1样式可自己设置，就是一个调整位置和添加背景。
  2.然后再创建一个<div>引入container容器样式，显示在正中间。<h2>以及<p>的内容可以自行添加。
  3.最后使用Grid系统的单元col-md-6 col样式插件为了在内容中嵌套默认的网格，添加一个新的div .row，并再创一个新的 div.col-md-* 列内添加一组 .col-md-* 列。
  被嵌套的行应包含一组列。
  在添加<div>引入media media-left设置图片img显示在左边 另外再创建一个<div>引入media-body样式插件作为media内容部分，运用<h4>media-heading作为标题头<p>添加所需要的内容。
  以此类推多创建<div class="col-md-6 col">存放在<div class="row">里可以达到很好的效果。
  具体效果请运行本网站查看，谢谢！
  -->
  <!--
  (四)
  1.首先创建一个<div>引入tab3样式，tab3样式可自己设置，这里的tab3样式是调整位置。
  2.然后再创建一个<div>引入container容器样式，显示在正中间。
  3.最后添加一个新的<div>引入row的样，创建两个<div>，运用Grid系统的单元在第一个<div>设置成<div class="col-md-6 col-sm-6">
   
  第二个设置成<div class="text col-md-6 col-sm-6">。
  本网站这里设置：
  第一个<div>里面的内容是图片。
  第二个<div>使用折叠效果：
  1、data-toggle="collapse" 添加到您想要展开或折叠的组件的链接上。
  2、href 或 data-target 属性添加到父组件，它的值是子组件的 id。
  3、data-parent 属性把折叠面板（accordion）的 id 添加到要展开或折叠的组件的链接上。
  -->
  <!--
  (五)
  网站<footer>部分注解
  1、首先创建<footer>标签，引入main-footer样式。再创建一个<div>标签，引入container样式。作用:凸显居中。
  2、然后创建一个<div>引入row样式。运用Grid系统的单元在另创建的<div>里面引入col-sm-4样式。
  3、最后再创建<div class="col-sm-4">包括起来，另外创建<div class="content tag-cloud">（标签云）可以设置多个标签云
  -->
   
  <body>
  <nav class="navbar navbar-default navbar-fixed-top">
  <div class="container">
  <div class="navbar-header">
  <a href="index.html" class="navbar-brand logo">
  <img src="img/logo.jpg" alt="WO世界">
  </a>
  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse">
  <span class="icon-bar"></span>
  <span class="icon-bar"></span>
  <span class="icon-bar"></span>
  </button>
  </div>
  <form class="navbar-form navbar-right " role="search">
  <div class="form-group">
  <input type="text" class="form-control glyphicon-search" placeholder="搜索">
  </div>
  <button type="submit" class="btn btn-success">GO</button>
  </form>
  <div class="collapse navbar-collapse" id="navbar-collapse">
  <ul class="nav navbar-nav navbar-right">
   
  <li class="active">
  <a href="index.html">
  <span class="glyphicon glyphicon-home">
  </span>
  首页
  </a>
  </li>
   
  <li>
  <a href="information.html">
  <span class="glyphicon glyphicon-list-alt">
  </span>
  资讯
  </a>
  </li>
  <li>
  <a href="luntang.html">
  <span class="glyphicon glyphicon-education"
  >
  </span>
  论坛
  </a>
  </li>
   
  <li>
  <a href="about.html">
  <span class="glyphicon glyphicon-question-sign">
  </span>
  关于
  </a>
  </li>
   
  </ul>
  </div>
  </div>
  </nav>
   
  <div id="myCarousel" class="carousel slide">
  <ol class="carousel-indicators">
  <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
  <li data-target="#myCarousel" data-slide-to="1"></li>
  <li data-target="#myCarousel" data-slide-to="2"></li>
  </ol>
  <!-- 轮播（Carousel）项目 -->
  <div class="carousel-inner">
  <div class="item active" style="background:#223240">
  <img src="img/01.jpg" alt="第一张">
  </div>
  <div class="item" style="background:#F5E4DC;">
  <img src="img/02.jpg" alt="第二张">
  </div>
  <div class="item" style="background:#DE2A2D;">
  <img src="img/03.jpg" alt="第三张">
  </div>
   
  </div>
  <!-- 轮播（Carousel）导航 -->
  <a href="#myCarousel" data-slide="prev" class="carousel-control left">
  <span class="glyphicon glyphicon-chevron-left"></span>
  </a>
  <a href="#myCarousel" data-slide="next" class="carousel-control right">
  <span class="glyphicon glyphicon-chevron-right"></span>
  </a>
  </div>
   
  <div class="tab1">
  <div class="container">
  <h2 class="tab-h2">
  Code之生活还是生存
  </h2>
  <p class="tab-p">
  Code强大的人生，必须由脚踏实地来支撑!
  </p>
  <div class="row">
  <div class="col-md-6 col">
  <div class="media">
   
  <div class="media-left">
  <a href="#">
  <img src="img/eclipse.jpg" width="170" height="120" alt="" class="media-middle">
  </a>
  </div>
   
  <div class="media-body">
  <h4 class="media-heading">Eclipse</h4>
  <p>Eclipse 是一个开放源代码的、基于Java的可扩展开发平台。就其本身而言，它只是一个框架和一组服务，用于通过插件组件构建开发环境。
  </p>
  </div>
  </div>
  </div>
   
  <div class="col-md-6 col">
  <div class="media">
   
  <div class="media-left">
  <a href="#">
  <img src="img/H5.jpg" width="170" height="120" alt="" class="media-middle">
  </a>
  </div>
   
  <div class="media-body">
  <h4 class="media-heading">HTML5</h4>
  <p>标准通用标记语言下的一个应用HTML标准自1999年12月发布的HTML4.01后，
  后继的HTML5和其它标准被束之高阁，为了推动Web标准化运动的发展，一些公司联合起来，
  成立了一个叫做 Web Hypertext Application Technology Working Group （Web超文本应用技术工作组 -WHATWG） </p>
  </div>
  </div>
  </div>
   
  <div class="col-md-6 col">
  <div class="media">
   
  <div class="media-left">
  <a href="#">
  <img src="img/php.jpg" width="170" height="120" alt="" class="media-middle">
  </a>
  </div>
   
  <div class="media-body">
  <h4 class="media-heading">PHP</h4>
  <p>PHP（外文名:PHP: Hypertext Preprocessor，中文名：“超文本预处理器”）是一种通用开源脚本语言。语法吸收了C语言、Java和Perl的特点，利于学习，使用广泛，主要适用于Web开发领域。PHP 独特的语法混合了C、Java、Perl以及PHP自创的语法。它可以比CGI或者Perl更快速地执行动态网页。</p>
  </div>
  </div>
  </div>
   
  <div class="col-md-6 col">
  <div class="media">
   
  <div class="media-left">
  <a href="#">
  <img src="img/w3c.jpg" width="170" height="120" alt="" class="media-middle">
  </a>
  </div>
   
  <div class="media-body">
  <h4 class="media-heading">W3C</h4>
  <p>万维网（World Wide Web）是作为欧洲核子研究组织的一个项目发展起来的，这那里 Tim Berners-Lee 开发出万维网的雏形。
  Tim Berners-Lee - 万维网的发明人 - 目前是万维网联盟的主任。
  W3C 在 1994 年被创建的目的是，为了完成麻省理工学院（MIT）与欧洲粒。</p>
  </div>
  </div>
  </div>
  </div>
  </div>
  </div>
   
  <div class="tab3">
  <div class="container">
  <div class="row">
   
  <div class="col-md-6 col-sm-6">
  <img src="img/boot.jpg" class="auto img-responsive center-block" alt="">
  </div>
  <div class="text col-md-6 col-sm-6">
  <div class="panel panel-default">
  <div class="panel-heading">
  <h4 class="panel-title">
  <a data-toggle="collapse" data-parent="#accordion"
  href="#collapseTwo">
  Bootstrap的优势
  </a>
  </h4>
  </div>
  <div id="collapseTwo" class="panel-collapse collapse">
  <div class="panel-body">
  1、受欢迎意味着很多人的参与，因此会有很多教程和文章，有更多的实例和网站使用它，会有更多的第三方扩展，能够更好的与现实的web开发项目结合。禁得住未来的考验；<br/>
  2、框架还在活跃的开发中，最近发布了bootstrap4，拥有了box-flex布局等更新，紧跟最新的web技术的发展；<br/>
  3、bootstrap发布已经5个年头了，相对来说是比较成熟的框架，在大量的真是项目中充分地使用和测试，一个字：稳；<br/>
  4、bootstrap拥有完善的文档，这样可以加快学习的进程，减少学习成本，而且它的学习成本也不算很高，只需要有一些html,css,js基础就可，这对于公司培养新人是非常重要的一个参考点；<br/>
  5、框架非常的详细，大量的组件样式，这既是优点也是缺点，因为定制化很高，你可以直接拿过来就用。另一方面，这意味着你如果有自己特殊的需求，就需要重新易自定义。添加新的css规则要比复写现有的样式规则方便多了，而且如果你在现有的样式上添加新的样式，这肯定会增加css文件的大小。<br/>
  </div>
  </div>
  </div>
  <div class="panel panel-default">
  <div class="panel-heading">
  <h4 class="panel-title">
  <a data-toggle="collapse" data-parent="#accordion"
  href="#collapseThree1">
  Bootstrap的历史
  </a>
  </h4>
  </div>
  <div id="collapseThree1" class="panel-collapse collapse">
  <div class="panel-body">
  基本结构：Bootstrap 提供了一个带有网格系统、链接样式、背景的基本结构。这将在 Bootstrap 基本结构 部分详细讲解。
  CSS：Bootstrap 自带以下特性：全局的 CSS 设置、定义基本的 HTML 元素样式、可扩展的 class，以及一个先进的网格系统。这将在 Bootstrap CSS 部分详细讲解。
  组件：Bootstrap 包含了十几个可重用的组件，用于创建图像、下拉菜单、导航、警告框、弹出框等等。这将在 布局组件 部分详细讲解。
  JavaScript 插件：Bootstrap 包含了十几个自定义的 jQuery 插件。您可以直接包含所有的插件，也可以逐个包含这些插件。这将在 Bootstrap 插件 部分详细讲解。
  定制：您可以定制 Bootstrap 的组件、LESS 变量和 jQuery 插件来得到您自己的版本。此走向了成功。
  </div>
  </div>
  </div>
  <div class="panel panel-default">
  <div class="panel-heading">
  <h4 class="panel-title">
  <a data-toggle="collapse" data-parent="#accordion"
  href="#collapseThree2">
  Bootstrap的工程
  </a>
  </h4>
  </div>
  <div id="collapseThree2" class="panel-collapse collapse">
  <div class="panel-body">
  作为一个PHP工程师，大部分时间都和服务器端语言打交道，从而在前端javascript以及美工，CSS兼容性上有着一定程度的弱势。常常因为要设计一个简单而又美观的界面或是图标寻求设计师的帮助。然而Bootstrap却可以很简单的解决这一切。
   
  首先介绍下Bootstrap，GitHub上这样介绍 bootstrap：简单灵活可用于架构流行的用户界面和交互接口的html,css,javascript工具集。基于html5、css3的bootstrap，具有大量的诱人特性：友好的学习曲线，卓越的兼容性，响应式设计，12列格网，样式向导文档，自定义JQuery插件，完整的类库，基于Less等。本系列教程遵循官方文档结构来介绍bootstrap，包括手脚架（Scaffolding),基础CSS,组件,javascript插件，使用LESS与自定义.本文主要介绍Bootstrap的基础布局–Scaffolding.
   
  这里提供两个地方，里面的Docs和API方法已经写的非常详细了，相信你一定能很快掌握它。
  </div>
  </div>
  </div>
  <div class="panel panel-default">
  <div class="panel-heading">
  <h4 class="panel-title">
  <a data-toggle="collapse" data-parent="#accordion"
  href="#collapseThree3">
  Bootstrap工程师
  </a>
  </h4>
  </div>
  <div id="collapseThree3" class="panel-collapse collapse">
  <div class="panel-body">
  PHP技术人才，正迎合了目前的互联网的发展趋势；PHP作为非常优秀的、简便的Web开发语言，和Linux，Apache，MySQL紧密结合，形成LAMP的开源黄金组合，不仅降低使用成本，还提升了开发速度，满足最新的互动式网络开发的应用，这使得php软件工程师成为一个发展迅速的职业。
  </div>
  </div>
  </div>
   
   
  </div>
  </div>
  </div>
   
  <div class="tab2">
  <div class="container">
  <div class="row">
  <div class="col-md-6 col-sm-6">
  <img src="img/bs.png" class="auto img-responsive content-block" alt="" style="width:620px; height:360px;">
  </div>
   
  <div class="text col-md-6 col-sm-6">
  <div class="widget">
  <ul class="list-group">
  <h3>工欲善其事，必先利其器</h3>><br/>
  <h5>Web工具资源精选，让你的工作得心应手，工作效率更高效。</h5>
  <li class="list-group-item"><a href="#">Jquery</a></li>
  <li class="list-group-item"><a href="#">bootstrap</a></li>
  <li class="list-group-item"><a href="#">eclipse</a></li>
  <li class="list-group-item"><a href="#">php</a></li>
  <li class="list-group-item">
  <span class="badge"><a href="#">新</span>
  html5</a>
  </li>
  <li class="list-group-item"><a href="#">android</a></li>
  <li class="list-group-item"><a href="#">Linux组件</a></li>
  <li class="list-group-item"><a href="#">JavaScript工具
  </a></li>
  </ul>
   
  </div>
  </div>
  </div>
  </div>
  </div>
  </div>
   
  <footer class="main-footer bj">
  <div class="container">
  <div class="row">
   
  <div class="col-sm-4">
  <div class="widget">
  <h4 class="title">友情链接</h4>
  <div class="content friend-links">
  <a href="#" target="_blank">Bootstrap中文网</a>
  <a href="#" title="Laravel中文网" target="_blank">Laravel中文网</a>
  </div>
  </div>
  </div>
   
  <div class="col-sm-4">
  <div class="widget">
  <h4 class="title">我们用到的技术</h4>
  <div class="content tag-cloud">
  <a href="#" target="_blank">Bootstrap</a>
  <a href="#" target="_blank">Ghost</a>
  <a href="#" target="_blank">BootCDN</a>
  <a href="#" target="_blank">Grunt</a>
  <a href="#" target="_blank">jQuery</a>
  <a href="#" target="_blank">Babeljs</a>
  <a href="#" target="_blank">Lodash</a>
  </div>
  </div>
  </div>
   
  <div style="padding-top:5px;">
  <div class="container">
  <div class="row">
  <div class="col-sm-4">
  <div class="widget">
  <h4 class="title">标签云</h4>
  <div class="content tag-cloud">
  <a href="#">Laravel</a>
  <a href="#">Laravel入门教程</a>
  <a href="#">Laravel 5</a>
  <a href="#">Laravel 5.2</a><br/>
  <a href="#">Eloquent</a><br/>
  <a href="#">新版本发布</a>
  <a href="#">Laravel 5.1</a>
  <a href="#">laravle5</a>
  <a href="#">Composer</a>
  <a href="#">PHP</a><br/>
  <a href="#">ORM</a>
  <a href="#">Artisan</a>
  <a href="#">Lumen</a>
  <a href="#">LTS</a>
  <a href="#">安装</a>
  <a href="#">...</a>
  </div>
  </div>
  </div>
  </div>
  </div>
  </div>
  </div>
  </div>
  </footer>
  <script src="js/jquery.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <script type="text/javascript">
  //轮播自动播放
  $('#myCarousel').carousel({
  //自动4秒播放
  interval : 4000,
  });
   
  $(window).load(function () {
  $('.text').eq(0).css('margin-top', ($('.auto').eq(0).height() - $('.text').eq(0).height()) / 2 + 'px');
  });
   
   
  $(window).resize(function () {
  $('.text').eq(0).css('margin-top', ($('.auto').eq(0).height() - $('.text').eq(0).height()) / 2 + 'px');
  });
   
  $(window).load(function () {
  $('.text').eq(1).css('margin-top', ($('.auto').eq(1).height() - $('.text').eq(1).height()) / 2 + 'px');
  });
   
  $(window).resize(function () {
  $('.text').eq(1).css('margin-top', ($('.auto').eq(1).height() - $('.text').eq(1).height()) / 2 + 'px');
  });
   
  </script>
  </body>
  </html>
   
 

用bootstrap框架弄的网站。（首页）的更多相关文章

  1. 继上一篇bootstrap框架（首页）弄的资讯页面

    还是和上一篇首页一样给出每一步的注解: 做的有点简单,但是,以后还是会加深的.毕竟是初学者嘛! <html lang="zh-cn">   <head>   ...

  2. Bootstrap框架(基础篇)之按钮,网格,导航栏,下拉菜单

    一,按钮 注意:虽然在Bootstrap框架中使用任何标签元素都可以实现按钮风格,但个人并不建议这样使用,为了避免浏览器兼容性问题,个人强烈建议使用button或a标签来制作按钮. 框架中提供了基础按 ...

  3. Bootstrap 框架 day57

    Bootstrap框架  Bootstrap介绍 Bootstrap是Twitter开源的基于HTML.CSS.JavaScript的前端框架. 它是为实现快速开发Web应用程序而设计的一套前端工具包 ...

  4. ThinkPHP框架快速开发网站

    使用ThinkPHP框架快速搭建网站 这一周一直忙于做实验室的网站,基本功能算是完成了.比较有收获的是大概了解了ThinkPHP框架.写一些东西留作纪念吧.如果对于同样是Web方面新手的你有一丝丝帮助 ...

  5. Web前端学习笔记：Bootstrap框架

    很久之前就有很多人给我推荐twitter的Bootstrap框架,但是直到前几天我才真正学习了下Bootstrap,的确是相当棒的框架,至少从视觉体验上超越了很多以前碰到了前端UI框架.今天我要聊聊B ...

  6. 基于BootStrap框架构建快速响应的GPS部标监控平台

    最近一个客户要求将gps部标平台移植到bootStrap框架作为前端框架,符合交通部796部标只是他们的一个基本要求,重点是要和他们的冷链云物流平台进行适配.我自己先浏览了客户的云物流平台的界面,采用 ...

  7. BootStrap框架

    简介: Bootstrap,来自 Twitter,是目前很受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷,是一个CSS ...

  8. Bootstrap框架(基础篇)之列表,表格,表单

    继续上篇的基础部分延伸,主要说一下列表,表格,表单相关Bootstrap框架变化以及基础知识. 1.列表篇 除了HTML提供的三种基本列表样式: 无序列表 <ul> <li>… ...

  9. css去掉使用bootstrap框架后打印网页时预览效果下的超链接

    在我们写网页的时候,超链接是链接各个页面的桥梁,也是搜索引擎爬虫(spider)收录网站页面的关键,因此,在每个网页中会有许多的超链. 今天,一个同行妹妹在使用了bootstrap框架来搭建自己的网站 ...

随机推荐

  1. python 读写Oracle10g数据简介

    1.测试环境: Centos6 X86_64python 2.6 Oracle 10g 2.安装cx_Oracle 和 Oracle InstantClient: http://www.rpmfind ...

  2. mvc4站点支持.html

    MVc站点在配置通配符后,还需要配置这个才能支持.html.在自定义的路由中加入.自定义代码就可以支持子定义的html了.

  3. Mantis查看问题列表的列名修改_"P","#"两列

    在使用mantis的时候,点击菜单上的“查看问题”进去,就会罗列出当前的bug列表,可是列表的标题上存在着“P”和“#”的显示,个人觉得这两列在这里完全没有意义,或者说现有的显示使人觉得疑惑,究竟代表 ...

  4. （四）WebDriver常用方法

    点击和输入 前面我们已经学习了定位元素, 定位只是第一步, 定位之后需要对这个元素进行操作, 或单击(按钮) 或输入(输入框) , 下面就来认识 WebDriver 中最常用的几个方法: clear( ...

  5. 小于12px的字体大小在Chrome中不起作用

    今天遇见一个小问题,让人挺郁闷的,在Chrome浏览器中无法把字体变成12px以下.网上搜索以下,发现无论中文英文数字在网页中CSS设置小于12px后各大浏览器均支持,在谷歌chrome浏览器不支持解 ...

  6. apache ab 测试 apr_socket_connect(): 由于目标机器积极拒绝 无法连接

    遇到这种情况一般是你开的并行数量太多了...例如:ab -c 1000 -n 10000 http://localhost/index.html 如此大的请求就会挂掉,不过还是有补救措施的,可以通过增 ...

  7. 下学期第三次作业——SQA计划和验收测试规程设计

    一.SQA计划 1.目的 在做云医院这个项目中,严格遵循SQA的计划,确保软件的质量的到保证 2.范围 随着项目的进行,不断的去改变计划,在项目开发的整个生命周期内. 3.人员分工 姓名 角色 开始时 ...

  8. WPF产生不重复的随机数

    WPF产生不重复的随机数 在给定的区间范围(比如[50,99]),产生给定数量的随机数(不如10个),要求产生的随机数不重复首先给定变量min=50;max=99+1;//习惯与程序规定的编码不同所致 ...

  9. python图片黑白化

    #!/usr/bin/env python #-*- coding:utf-8 -*- from PIL import Image im = Image.open(r"C:\Users\wa ...

  10. hdu1215 七夕节---因子和

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1215 题目大意: 求N的因子和(不包括N本身) 解题思路: 模板传送门 #include<io ...