從頭來第五步正常使用服務器（Tomcat）使用IDEA開發前後端

1.Apache Tomcat和IDEA

簡單的說tomcat就是一個小型的本地的服務器，便於程序員調試程序，觀察網站。

簡介	環境	重要目錄
Tomcat是由Apache軟件基金會屬下Jakarta項目開發的Servlet容器，按照Sun Microsystems提供的技術規範，實現了對Servlet和JavaServer Page（JSP）的支持，並提供了作爲Web服務器的一些特有功能，如Tomcat管理和控制平臺、安全局管理和Tomcat閥等。由於Tomcat本身也內含了HTTP服務器，因此也可以視作單獨的Web服務器。但是，不能將Tomcat和Apache HTTP服務器混淆，Apache HTTP服務器是用C語言實現的HTTPWeb服務器；這兩個HTTP web server不是捆綁在一起的。Apache Tomcat包含了配置管理工具，也可以通過編輯XML格式的配置文件來進行配置。	Tomcat提供了一個Jasper編譯器用以將JSP編譯成對應的Servlet。Tomcat的Servlet引擎通常與Apache或者其他Web服務器一起工作。除了用於開發過程中的調試以及那些對速度和事務處理只有很小要求的用戶，很少會將Tomcat單獨作爲Web服務器。但隨着版本的更新，正有越來越多的用戶將其單獨作爲Web服務器用以那些對速度和可靠性有較高要求的環境中。	Tomcat 重要目錄/bin - Tomcat 腳本存放目錄（如啓動、關閉腳本）。 .sh 文件用於 Unix 系統； .bat 文件用於 Windows 系統。/conf - Tomcat 配置文件目錄。/logs - Tomcat 默認日誌目錄。/webapps - webapp 運行的目錄。

IntelliJ IDEA
IntelliJ IDEA也是JetBrains全家桶中的一員，是一種商業化銷售的Java集成開發環境（Integrated Development Environment，IDE）工具軟件，由JetBrains軟件公司（前稱爲IntelliJ）開發，提供Apache 2.0開放式授權的社區版本以及專有軟件的商業版本，開發者可選擇其所需來下載使用。
能夠集成的環境

2.單獨使用tomcat

打開apache-tomcat的目錄

1）將已經打包成war的網頁放到webapps目錄下

2)在bin目錄下，打開startup.bat（war自動解壓）

3）在瀏覽器中輸入網址(http://localhost:8080/解壓目錄名/)查看網頁

關閉tomcat服務器在bin目錄下打開shutdown.bat

3.將tomcat工作環境集成到IDEA上

選擇編輯工作環境

選擇添加tomcat服務器

選擇本地的tomcat目錄位置即可

在IDEA中運行服務器
點擊小蟲子

運行成功，和tomcat中的效果一致成功集成。
例行代碼

<%--
  Created by IntelliJ IDEA.
  User: lenovo
  Date: 2020/1/27
  Time: 11:12
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="utf-8" %>

<html>
<head>
  <title>Web技術課程網站</title>
  <link rel="stylesheet" type="text/css" href="CSS文件/navigation.css">
  <link rel="stylesheet" type="text/css" href="CSS文件/new_kinds.css">
  <script type="text/javascript" src="Jquery/jquery.min.js"></script>
  <script type="text/javascript" src="JS/MainPage.js"></script>
  <script type="text/javascript" src="JS/script.js"></script>

  <!--實現圖片的輪播的css邏輯-->
  <style>
    .pic{
      width: 100%;
      height: 458px;
      margin: 10px auto;
      position: relative;
      overflow: hidden;
    }
    .content{
      /*<!--能存好多張圖 -->*/
      width: 99999px;
      height: 458px;
      position: absolute;
      left: 0px;
      top: 0px;

    }
    .content img{

    }
    .index{
      position: absolute;
      left: 300px;
      bottom: 5px;
      width: 200px;
      height: 20px;
      list-style: none;
    }
    .index li{
      width: 10px;
      height: 10px;
      border-radius: 50%;
      float: left;
      margin-left: 10px;
      background-color: rgba(100,100,100,0.3);
    }

    .left{
      width: 30px;
      height:50px;
      background-color:rgba(100,100,100,0.5);
      position: absolute;
      left: 0px;
      top: 150px;
      line-height: 50px;
      text-align: center;
      font-size: 20px;
      color: #fff;
      display: none;
    }
    .right{
      width: 30px;
      height:50px;
      background-color:rgba(100,100,100,0.5);
      position: absolute;
      right: 0px;
      top: 150px;
      line-height: 50px;
      text-align: center;
      font-size: 20px;
      color: #fff;
      display: none;
    }

    .class_li{
      list-style-type:none;
    }
  </style>

  <!--實現圖片的輪播的js邏輯-->
  <script type="text/javascript">
    $(function(){
      //每個固定的時間移動圖片
      var timer = setInterval(picLoop,2000);
      var index = 0;

      //定時移動圖片
      function picLoop(){
        index++;
        if (index==8) {index=0;}
        //偏移量 顯示的內容與容器初始內容的偏移量
        $(".content").animate({"left":-1290*index},500);
        $(".class_li").eq(index).css("background-color","red")
                .siblings().css("background-color","rgba(100,100,100,0.3)");
      }

      //定時器的控制
      $(".pic").hover(function(){
        clearInterval(timer);//clearInterval(timer)的作用只是將定時器停止，但是timer變量本身還是存在的
        $(".left").show();
        $(".right").show();
      },function(){
        timer = setInterval(picLoop,2000);//離開時啓動定時器
        $(".left").hide();
        $(".right").hide();
      });


      //小點控制顯示那張圖片
      $(".class_li").mouseover(function(){
        $(this).css("background-color","red")
                .siblings().css("background-color","rgba(100,100,100,0.3)");
        index = $(this).index();
        $(".content").animate({"left":-1290*index},300);

      })

      //左右移動圖片
      $(".left").click(function(){
        index--;
        if (index==-1) {index=7;}
        $(".content").animate({"left":-1290*index},300);
        $("li").eq(index).css("background-color","red")
                .siblings().css("background-color","rgba(100,100,100,0.3)");
      })
      $(".right").click(function(){
        index++;
        if (index==8) {index=0}
        $(".content").animate({"left":-1290*index},300);
        $("li").eq(index).css("background-color","red")
                .siblings().css("background-color","rgba(100,100,100,0.3)");
      })


    })
  </script>

</head>

<body>

<!--引入jQuery-->
<script language="JavaScript"  src="Jquery/jquery-3.4.1.js"></script>

<div id="Container">

  <!--網站log-->
  <div id="Header_img">
    <img src="CSS文件/Photos/Web.jpg" width="100%" height="50%" style="margin-bottom: 35px">

    <%
      String name= request.getParameter("name");
      String pinglun = request.getParameter("pinglun");
      if (pinglun!=null&&pinglun.equals("yes")){
    %>
    <script>
      alert("留言評論成功！");
    </script>
    <%
      }

      if (name==null||name==""){
        %>
    <span style="margin-top: 10px"><a class="font4" style="font-size: 18px" href="login.jsp">親，請先登錄！</a></span>
    <%
      }else {
        System.out.println("name:"+name);
        %>

   <span style="margin-top: 10px"><font class="font4" style="font-size: 18px">您好，<%=name%>同學！</font></span>
    <br>
    <br>
    <span><font class="font4" style="font-size: 18px">快去學習吧！</font></span>
    <%
      }

    %>

  </div>

  <!--實現圖片的輪播-->
  <div id="Header" class="pic">
    <div id="front" class="content">
      <a class="class_i" href="#"><img src="CSS文件/frontEnd/why.jpg" style="width: 1290px" height="458px"></a>
      <a class="class_i" href="#"><img src="CSS文件/frontEnd/html5.jpg" style="width: 1290px" height="458"></a>
      <a class="class_i" href="#"><img src="CSS文件/frontEnd/css.jpeg" style="width: 1290px" height="458"></a>
      <a class="class_i" href="#"><img src="CSS文件/frontEnd/js.png" style="width: 1290px" height="458"></a>
      <a class="class_i" href="#"><img src="CSS文件/frontEnd/jQuery.jpg" style="width: 1290px" height="458"></a>
      <a class="class_i" href="#"><img src="CSS文件/afterEnd/jsp.jpg" style="width: 1290px" height="458px"></a>
      <a class="class_i" href="#"><img src="CSS文件/afterEnd/jsf.jpg" style="width: 1290px" height="458px"></a>
      <a class="class_i" href="#"><img src="CSS文件/afterEnd/mysql.png" style="width: 1290px" height="458px"></a>
      <a class="class_i" href="#"><img src="CSS文件/afterEnd/node.png" style="width: 1290px" height="458px"></a>
    </div>
    <!--    圖片下面的小點    -->
    <ul class="index" style="align-self: center" >
      <li class="class_li" style=" background-color: red;"></li><!-- 起始點是紅色的 -->
      <li class="class_li"></li>
      <li class="class_li"></li>
      <li class="class_li"></li>
      <li class="class_li"></li>
      <li class="class_li"></li>
      <li class="class_li"></li>
      <li class="class_li"></li>
    </ul>
    <div class="right">></div>
    <div class="left"><</div>
  </div>


  <!--&lt;!&ndash;頭像上傳和登陸界面&ndash;&gt;-->
  <!--    <input type="file" id="chooseImage" name="file" value="上傳頭像">-->
  <!--    <div id="register">-->
  <!--        <img align="center" id="cropedBigImg" value='custom' alt="lorem ipsum dolor sit" data-address='' title="自定義背景" src="CSS文件/Photos/HeadImage.png"/><br><br><br><br>-->
  <!--        <input align="center" id="chooseImages" type='button' value='上傳頭像'  OnClick='getSrc()' class="btn"/><br>-->
  <!--        <input id="log" type="button" onclick="" value="登陸" class="new_button">-->
  <!--        &lt;!&ndash; 保存用戶自定義的背景圖片 &ndash;&gt;-->
  <!--    </div>-->

  <!--    <script>-->
  <!--//登陸界面-->
  <!--//將文件上傳按鈕隱藏-->
  <!--        $('#chooseImage').hide();-->

  <!--        function getSrc() {-->
  <!--            // alert("hello");-->
  <!--            //點擊按鈕實現頭像的上傳。-->
  <!--            $("#chooseImage").click();-->
  <!--        }-->
  <!--//將圖片上傳到指定位置-->
  <!--        $('#chooseImage').on('change',function(){-->
  <!--            var filePath = $(this).val(),         //獲取到input的value，裏面是文件的路徑-->
  <!--                fileFormat = filePath.substring(filePath.lastIndexOf(".")).toLowerCase(),-->
  <!--                src = window.URL.createObjectURL(this.files[0]); //轉成可以在本地預覽的格式-->

  <!--            // 檢查是否是圖片-->
  <!--            if( !fileFormat.match(/.png|.jpg|.jpeg/) ) {-->
  <!--                error_prompt_alert('上傳錯誤,文件格式必須爲：png/jpg/jpeg');-->
  <!--                return;-->
  <!--            }-->

  <!--            $('#cropedBigImg').attr('src',src);-->
  <!--        });-->


  <!--    </script>-->

  <!--主要的內容顯示界面-->
  <div id="PageBody">
    <!--左側導航頁-->
    <div id="SideBar">
      <img src="CSS文件/Photos/java.png" width="30" height="30" id="flag" style="margin-top: 35px"><br>
      <span id="box">
        <img src="CSS文件/Photos/title.gif" width="30" height="80" id="flag2" style="margin-top: 50px;margin-left: -30px">
        <div id="menu">
            <ul class="menu_ul">
                <li class="menu_li"><a onclick="refreshes()" class="menu_a" title="課程大綱在這裏">首頁</a></li>
                <li class="menu_li"><a onclick="homePage()" class="menu_a" title="開發工具和語言">總覽</a></li>
                <li class="menu_li"><a onclick="downloadPage()" class="menu_a" title="PPT瀏覽和下載">課件</a></li>
                <li class="menu_li"><a onclick="video()" class="menu_a" title="全部視頻在這裏">視頻</a></li>
                <li class="menu_li"><a onclick="forum()" class="menu_a" title="和小夥伴盡情的討論吧">論壇</a></li>
            </ul>
        </div>
        </span>
    </div>
    <!--實現導航菜單隱藏的js邏輯-->
    <script>

      $(document).ready(function () {
        $("#box").hover(function () {
          $("#menu").show(300);
        },function () {
          $("#menu").hide(300);
        });

      })

    </script>

    <!-- JS控制邏輯 -->
    <script>
      //引入jQuery並且使html文件進入div中
      function homePage(){
//設置背景圖片
        var m1 = document.getElementById("MainBody");
        m1.style.backgroundImage = 'url(CSS文件/Pictures/2.jpg)';
        var i = 1;
        if (i===1){
          m1.className = 'divBg';//css類的名字
        }

//jQuery載入html文件
        var m = $("#MainBody");

        m.load("Start.html");

        var foot = $("#Footer");
        foot.show();

      }
      //刷新當前頁面所以function不能由js文件導入到html中。
      function refreshes() {

        // alert("ok");

        window.location.reload();//刷新當前頁面.

      }

      //導入ppt下載的網頁
      function downloadPage() {

        var mm = document.getElementById("MainBody");

        mm.style.backgroundImage = "";//設置背景圖片爲空

        var m = $("#MainBody");
        m.load("pptBrowse.html");

        var foot = $("#Footer");
        foot.hide();

      }
      //引入留言的html
      function forum() {

        var foot = $("#Footer");
        foot.show();

        var m = $("#MainBody");

        m.load("answering.jsp");

        // alert("hello!");



      }
      //引入視頻下載的html
      function video() {

        var foot = $("#Footer");
        foot.show();


        var mm = document.getElementById("MainBody");

        mm.style.backgroundImage = "";//設置背景圖片爲空

        var m = $("#MainBody");

        m.load("HTMLVideo.html");



      }
    </script>


    <div id="MainBody">
      <img src="CSS文件/Photos/課程簡述.jpg" class="adapt2">
      <h2 class="h_nature">課程概述:</h2>
      <p class="p_nature">在互聯網迅速發展的今天，我們已能深切感受到互聯網帶給我們工作與生活方式上的巨大變化。瞭解互聯網的運作機制並掌握一些基本的Web程序設計的技巧與技能已成爲時代對目前大多數學習者的一項基本要求。該課程緊扣互聯網發展的趨勢，以“前臺+後臺”爲支撐，以“能力+項目”爲驅動，使學習者瞭解Web編程的基本框架，並在此基礎上培養學習者基本的Web編程技能。</p>
      <p class="p_nature">在內容組織上，該課程主要包括WEB原理、開發過程和環境部署；HTML語言基礎； CSS技術、JavaScript技術、JavaEE技術；重點介紹JSP、servlet及相關的數據庫應用開發。</p>

      <img src="CSS文件/Photos/課程大綱.jpg" class="adapt2">
      <h2 class="h_nature"> 課程大綱:</h2>

      <!--書籤導航-->
      <div id="bookmark">
        <img src="CSS文件/Photos/書籤.jpg" class="adapt3">
        <h3 class="h4_nature">書籤傳送</h3>
        <ul>
          <!-- 利用超鏈接創建書籤 需要藉助下面《a》標籤的name屬性-->
          <li class="no_disc"><a href="#1" class="bookmark">第一章</a><a href="#2" class="bookmark">第二章</a><a href="#3" class="bookmark">第三章</a><a href="#4" class="bookmark">第四章</a><a href="#5" class="bookmark">第五章</a></li>
          <li class="no_disc"><a href="#6" class="bookmark">第六章</a><a href="#7" class="bookmark">第七章</a><a href="#8" class="bookmark">第八章</a><a href="#9" class="bookmark">第九章</a><a href="#10" class="bookmark">第十章</a></li>
          <li class="no_disc"><a href="#11" class="bookmark">第十一章</a><a href="#12" class="bookmark">第十二章</a><a href="#13" class="bookmark">第十三章</a><a href="#14" class="bookmark">第十四章</a></li>
          <li class="no_disc"></li>
        </ul>
      </div>


      <h4 class="h4_nature"><a name="1">第一章 Web前端開發技術綜述：</a></h4> <!-- 利用超鏈接創建書籤 -->
      <ul class="ul_nature">
        <li>瞭解Web發展史；</li>
        <li> 掌握Web網站相關的基本概念；</li>
        <li>理解Web前端開發技術及其在Web網頁中的作用；</li>
        <li> 熟悉並學會使用常用的Web前端開發工具、瀏覽器工具。</li>
      </ul>

      <h4 class="h4_nature"><a name="2">第二章 HTML基礎：</a></h4>
      <ul class="ul_nature">
        <li>瞭解HTML 文檔的基本結構；</li>
        <li> 理解標記類型、標記語法；</li>
        <li> 學會body標記的屬性的設置方法；</li>
        <li>  學會給網頁添加註釋；</li>
        <li>理解meta元信息的作用；</li>
        <li>瞭解HTML文檔類型</li>
      </ul>

      <h4 class="h4_nature"><a name="3">第三章 格式化文字與段落：</a></h4>
      <ul class="ul_nature">
        <li>掌握標題字（h1～h6）標記語法及屬性語法。</li>
        <li> 理解文本格式化標記類型與作用，並學會使用各種樣式。</li>
        <li> 學會使用字體font 標記。</li>
        <li> 學會使用段落與排版標記。</li>
        <li> 學會使用各類格式化標記設計簡易的Web 頁面。</li>
      </ul>

      <h4 class="h4_nature"><a name="4">第四章 列表：</a></h4>
      <ul class="ul_nature">
        <li>瞭解列表的類型；</li>
        <li> 掌握無序列表、有序列表、定義列表標記語法及屬性語法；</li>
        <li> 瞭解菜單列表、目錄列表標記語法；</li>
        <li>學會使用無序、有序及定義列表設計Web網頁；</li>
        <li> 學會使用嵌套列表設計小型網站首頁。</li>
      </ul>

      <h4 class="h4_nature"><a name="5">第五章 超鏈接：</a></h4>
      <ul class="ul_nature">
        <li>掌握超鏈接的基本標記語法和屬性語法。</li>
        <li> 理解超鏈接分類、路徑、書籤等概念。</li>
        <li>學會使用超鏈接實現文件下載、FTP 下載、電子郵件鏈接、圖像鏈接。</li>
        <li>學會使用超鏈接製作書籤。</li>
        <li>學會使用浮動框架實現內嵌頁面的顯示。</li>
      </ul>

      <h4 class="h4_nature"><a name="6">第六章 圖像與多媒體文件：</a></h4>
      <ul class="ul_nature">
        <li>掌握圖像img標記語法及屬性設置方法。</li>
        <li> 學會設置圖像熱區鏈接。</li>
        <li>掌握滾動文字marquee標記語法及屬性設置方法。</li>
        <li>掌握背景音樂bgsound標記語法及屬性設置方法。</li>
        <li> 學會採用超鏈接插入動畫、音頻和視頻類等多媒體文件。</li>
      </ul>

      <h4 class="h4_nature"><a name="7">第七章 CSS基礎：</a></h4>
      <ul class="ul_nature">
        <li>理解CSS 的概念、特點。</li>
        <li> 掌握CSS 基本語法、選擇器分類與聲明的結構。</li>
        <li> 掌握CSS 的定義及引用的方式。</li>
        <li> 理解CSS 繼承與層疊的含義。</li>
      </ul>

      <h4 class="h4_nature"><a name="8">第八章 DIV與SPAN(1課時)：</a></h4>
      <ul class="ul_nature">
        <li>掌握DIV標記的基本用法、常用屬性。</li>
        <li> 理解DIV嵌套與層疊的含義。</li>
        <li> 掌握SPAN標記的語法，靈活使用SPAN標記。</li>
        <li>掌握DIV與SPAN標記在使用上的差異</li>
        <li> 學會使用DIV+CSS進行和簡易頁面佈局。</li>
      </ul>

      <h4 class="h4_nature"><a name="9">第九章 CSS樣式屬性(2課時)：</a></h4>
      <ul class="ul_nature">
        <li>熟悉CSS樣式設置中常用的單位。</li>
        <li> 掌握控制文字、文本、背景、顏色、列表等樣式的屬性及設置方法。</li>
        <li>理解CSS盒子模型。</li>
        <li> 掌握邊框、邊界、填充及內容等屬性及設置方法。</li>
      </ul>

      <h4 class="h4_nature"><a name="10">第十章 CSS+DIV頁面佈局（1-2課時）：</a></h4>
      <ul class="ul_nature">
        <li>熟練地使用DIV標記的CSS各類屬性。</li>
        <li>掌握CSS定義與引用方法，學會使用外部樣式表定義頁面樣式。</li>
        <li>熟悉各類常見的頁面佈局類型，能夠寫出相應的DIV結構及CSS規則。</li>
        <li>學會使用DIV+CSS進行頁面佈局，能夠編寫HTML代碼和CSS文件。</li>
      </ul>

      <h4 class="h4_nature"><a name="11">第十一章 表格：</a></h4>
      <ul class="ul_nature">
        <li> 掌握設計表格所有標記和屬性。</li>
        <li>掌握表格行標記的屬性及設置方法。</li>
        <li> 掌握表格單元格的跨行與跨列屬性的設置方法。</li>
        <li>掌握表格的嵌套方法。</li>
        <li>學會在表格中嵌入各種頁面元素。</li>
        <li>學會使用表格進行簡易網頁佈局。</li>
      </ul>

      <h4 class="h4_nature"><a name="12">第十二章 表單：</a></h4>
      <ul class="ul_nature">
        <li> 理解Web網頁中表單的概念與作用。</li>
        <li> 掌握表單結構語法及屬性語法。</li>
        <li> 掌握表單元素標記語法及屬性語法。</li>
        <li>掌握域和域標題標記語法。</li>
        <li>學會綜合運用表單及表單元素設計Web網頁。</li>
      </ul>

      <h4 class="h4_nature"><a name="13">第十三章 HTML5 基礎與CSS3 應用：</a></h4>
      <ul class="ul_nature">
        <li>熟悉掌握HTML5 新特性。</li>
        <li>掌握HTML5 頁面結構。</li>
        <li>學會使用HTML5 新增元素和新增屬性。</li>
        <li>掌握HTML5 新增表單元素及新增屬性的設置方法。</li>
        <li>學會使用HTML5 的Audio 和Video 媒體元素。</li>
        <li>學會HTML5 本地存儲開發簡易Web 應用。</li>
        <li>學會使用CSS3 的轉換、過渡和動畫等特性設計頁面的動態效果。</li>
        <li>學會設置與應用CSS3 文本效果及多列等屬性。</li>
      </ul>

      <h4 class="h4_nature"><a name="14">第十四章 JavaScript基礎：</a></h4>
      <ul  type="disc" class="ul_nature">
        <li>理解JavaScript程序的概念與作用；</li>
        <li>掌握JavaScript標識符和變量的概念及使用方法；</li>
        <li>掌握JavaScript常用運算符和表達式概念；</li>
        <li>掌握JavaScript中順序、分支、循環等3種程序控制結構語法；</li>
        <li>掌握JavaScript函數的定義方法，並學會使用；</li>
        <li>學會綜合運用JavaScript設計具有動態、交互功能的網頁。</li>
      </ul>


      <!--  letter-spacing:2px;line-height:1em;text-indent:2em字符間距，行高，首行縮進 -->

      <img src="CSS文件/Photos/學習.jpg" class="adapt4">
      <h2 class="h_nature">預備知識:</h2>
      <p class="p_nature">學習該課程，您應該具備以下條件：</p>
      <p class="p_nature"> 1、熟悉Java語言程序設計基礎知識；</p>
      <p class="p_nature"> 2、瞭解因特網與萬維網運行基本原理；</p>
      <p class="p_nature">3、對B/S及C/S有較清晰的認識；</p>
      <p class="p_nature"> 4、能夠分清楚前端與後臺的概念.</p>

      <img src="CSS文件/Photos/考試.jpg" class="adapt2">
      <h2 class="h_nature">考試要求:</h2>
      <p class="p_nature">一、成績組成，實驗成績50%，期末上級考試50%</p>
      <p class="p_nature"> 二、實驗成績</p>
      <p class="p_nature"> （1）採用課程相關技術實現Web技術課程網站，網站主要實現教學大綱、課程介紹等教學內容的瀏覽，教學課件和視頻資料的瀏覽下載，簡單的留言和回覆功能(20分)</p>
      <p class="p_nature">（2）選用一種與課程相關的技術開發已電子商務系統，實現商戶對網上商品的管理以及客戶在平臺上購物等基本功能。（30分）</p>
      <p class="p_nature"> 三、期末考試</p>
      <p class="p_nature"> （1）筆試，主要考察學生對基本概念和基本技術原理的掌握（20分）</p>
      <p class="p_nature">（2）上機考試，主要考察學生實際Web技術開發能力。（30分）</p>

      <img src="CSS文件/Photos/課外材料.jpg" class="adapt2">
      <h2 class="h_nature">課外資料:</h2>
      <p class="p_nature"><a href="https://www.icourse163.org/course/XJTU-1003679001" class="a1">Web編程技術(西安交通大學)</a> </p>
      <p class="p_nature"> <a href="http://pan.baidu.com/s/1bpDQStp" class="a1">儲久良課件下載（密碼：1lxv）</a> </p>
      <p class="p_nature"><a href="https://www.icourse163.org/course/NBCC-1001710008" class="a1">JSP開發應用(面向職業 )</a> </p>
      <!--防止頁眉阻擋文字-->
      <br>
      <br>

    </div>
  </div>

  <div id="Footer">
    <p>
      <a href="start2.html">刷新</a>
      2019-2020 Web 前端工作室 &copy
      <a href="mailto:[email protected]?subject=Hello%20again&body=有問題">有問題請聯繫我們</a>
    </p>
  </div>
</div>

</body>
</html>

4.bug記錄

1）解決光標變成黑塊

光標變成了黑塊，不能編輯代碼。光標變黑塊是因爲輸入方式變成了改寫方式，INSERT可以切換插入/改寫模式。（聯想FN+F12）

2）IntelliJ IDEA 配置 Chrome

Settings
Tools - Web Browsers

3）IDEA的複製粘貼快捷鍵失效解決方法

打開IDEA—>點擊Tools
把Vim Emulator 前面的√去掉就好了，這樣複製粘貼的快捷鍵就恢復正常了。

從頭來第五步正常使用服務器（Tomcat）使用IDEA開發前後端

1.Apache Tomcat和IDEA

2.單獨使用tomcat

1）將已經打包成war的網頁放到webapps目錄下

2)在bin目錄下，打開startup.bat（war自動解壓）

3）在瀏覽器中輸入網址(http://localhost:8080/解壓目錄名/)查看網頁

3.將tomcat工作環境集成到IDEA上

4.bug記錄

1）解決光標變成黑塊

2）IntelliJ IDEA 配置 Chrome

3）IDEA的複製粘貼快捷鍵失效解決方法

python gdal 安裝使用（Windows， python 3.6.8）

windows環境下git下載到git與GitHub連接

蘋果選擇ARM架構的cpu背後的“野心”和“理想”

mysql命令行下的基礎命令

在Vmware中創建蘋果虛擬機

山東大學衆智課程——網絡（圖）有關的實驗

Mac下配置sublime實現LaTeX

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結