有效沟通问答-【官方】百战程序员_IT在线教育培训机构

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0"
         metadata-complete="false">
    <context-param>
        <param-name>key1</param-name>
        <param-value>BJSXT</param-value>
    </context-param>
    <context-param>
        <param-name>key2</param-name>
        <param-value>BJSXT</param-value>
    </context-param>
    <servlet>
        <servlet-name>demoServlet</servlet-name>
        <servlet-class>com.example.demo.DemoServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>demoServlet</servlet-name>
        <url-pattern>/demo.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>getRequestDataServlet</servlet-name>
        <servlet-class>com.example.demo.GetRequestDataServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>getRequestDataServlet</servlet-name>
        <url-pattern>/getinfo.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>getRequestHeaderServlet</servlet-name>
        <servlet-class>com.example.demo.GetRequestHeaderServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>getRequestHeaderServlet</servlet-name>
        <url-pattern>/getHeader.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>LanguageServlet</servlet-name>
        <servlet-class>com.example.demo.LanguageServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>LanguageServlet</servlet-name>
        <url-pattern>/Languages.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>RespByteServlet</servlet-name>
        <servlet-class>com.example.demo.RespByteServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>RespByteServlet</servlet-name>
        <url-pattern>/RespByte.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>RedirectServlet</servlet-name>
        <servlet-class>com.example.demo.RedirectServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>RedirectServlet</servlet-name>
        <url-pattern>/Redirect.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>DownFileServlet</servlet-name>
        <servlet-class>com.example.demo.DownFileServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>DownFileServlet</servlet-name>
        <url-pattern>/Down.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>GetBaseInfoServlet</servlet-name>
        <servlet-class>com.example.demo.GetBaseInfoServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>GetBaseInfoServlet</servlet-name>
        <url-pattern>/getBaseInfo.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>ContextReadInfoServlet</servlet-name>
        <servlet-class>com.example.demo.ContextReadInfoServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>ContextReadInfoServlet</servlet-name>
        <url-pattern>/Context.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>GlobalContainerServlet</servlet-name>
        <servlet-class>com.example.demo.GlobalContainerServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>GlobalContainerServlet</servlet-name>
        <url-pattern>/Global.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>GetConfigInfoServlet</servlet-name>
        <servlet-class>com.example.demo.GetConfigInfoServlet</servlet-class>
        <init-param>
            <param-name>key1</param-name>
            <param-value>BJSXT</param-value>
        </init-param>
        <init-param>
            <param-name>key2</param-name>
            <param-value>ITBZ</param-value>
        </init-param>
    </servlet>
    <servlet-mapping>
        <servlet-name>GetConfigInfoServlet</servlet-name>
        <url-pattern>/Config.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>CreatCookieSrvlet</servlet-name>
        <servlet-class>com.example.demo.CreatCookieSrvlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>CreatCookieSrvlet</servlet-name>
        <url-pattern>/Cookie.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>GetCookieDataServlet</servlet-name>
        <servlet-class>com.example.demo.GetCookieDataServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>GetCookieDataServlet</servlet-name>
        <url-pattern>/GetCookie.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>WelcomeServlet</servlet-name>
        <servlet-class>com.example.demo.WelcomeServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>WelcomeServlet</servlet-name>
        <url-pattern>/Welcome.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>CreateHttpSessionServlet</servlet-name>
        <servlet-class>com.example.demo.CreateHttpSessionServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>CreateHttpSessionServlet</servlet-name>
        <url-pattern>/CreatSession.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>GetHttpSessionDataServlet</servlet-name>
        <servlet-class>com.example.demo.GetHttpSessionDataServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>GetHttpSessionDataServlet</servlet-name>
        <url-pattern>/GetSessionData.do</url-pattern>
    </servlet-mapping>
    <session-config>
        <session-timeout>1</session-timeout>
    </session-config>
    <servlet>
        <servlet-name>WelcomeSessionServlet</servlet-name>
        <servlet-class>com.example.demo.WelcomeSessionServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>WelcomeSessionServlet</servlet-name>
        <url-pattern>/WelcomeSession.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>AutoStartServlet</servlet-name>
        <servlet-class>com.example.demo.AutoStartServlet</servlet-class>
        <init-param>
            <param-name>path</param-name>
            <param-value>image</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>AutoStartServlet</servlet-name>
        <url-pattern>/auto.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>ThreadSafeServlet</servlet-name>
        <servlet-class>com.example.demo.ThreadSafeServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>ThreadSafeServlet</servlet-name>
        <url-pattern>/Safe.do</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>FileUploadServlet</servlet-name>
        <servlet-class>com.example.demo.FileUploadServlet</servlet-class>
        <multipart-config>
            <file-size-threshold>2000</file-size-threshold>
        </multipart-config>
    </servlet>
    <servlet-mapping>
        <servlet-name>FileUploadServlet</servlet-name>
        <url-pattern>/fileupload.do</url-pattern>
    </servlet-mapping>
</web-app>

package com.example.demo;

import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.Part;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.UUID;

public class FileUploadServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        doPost(req, resp);
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        req.setCharacterEncoding("utf-8");
        String desc = req.getParameter("desc");
        Part part=req.getPart("file");
//        InputStream inputStream = part.getInputStream();
        String filename= UUID.randomUUID().toString()+part.getSubmittedFileName().substring(part.getSubmittedFileName().lastIndexOf("."));
        ServletContext servletContext = this.getServletContext();
        String realPath = servletContext.getRealPath("image"+filename);
        part.write(realPath);
        PrintWriter out=resp.getWriter();
        out .println("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");
        out.println("<HTML>");
        out.println(" <HEAD><TITLE>A Servlet</TITLE></HEAD>");
        out.println(" <BODY>");
        out.println("上传成功");
        out.println("</BODY>");
        out.println("</HTML>");
        out.flush();
        out.close();
    }
}

JAVA 全系列/第六阶段：JavaWeb开发/Servlet技术详解（旧） 32086楼

麻烦老师看一下我这哪里有问题吗？我单独访问nginx和tomcat都没有问题

JAVA 全系列/第十四阶段：分布式文件存储与数据缓存/Nginx 32087楼

老师这个报错是什么意思，密码不对么，，，，，

Python 全系列/第六阶段：数据库与AI协同技术实战/mysql的使用 32088楼

老师，这种输入输出的形式和创建Scanner对象的输入方式有什么不同呢？

JAVA 全系列/第二阶段：JAVA 基础深化和提高/IO 流技术（旧） 32089楼

老师你好，去settings搜索enco后，无论打什么代码都会出现这样的错误，是什么东西没调过来吗？

Python 全系列/第二阶段：Python 深入与提高/文件处理 32090楼

这是咋回事？ Xshell连不上虚拟机，但虚拟机好好的，而且也能ping得通，经常这样，连不上的时候只能重启电脑就又可以连上了

JAVA 全系列/第十八阶段：亿级高并发电商项目_架构/编码（旧）/电商：使用Nginx实现负载均衡及整体环境部署 32091楼

lass Employee:

  def __init__(self,name,salary):
    self.name = name
    self.__salary = salary

  def salary(self):
    print("薪资是：",self.__salary)
    return self.__salary

emp1 = Employee("王小丫",50000)
emp1.salary()

老师我想问一下，salary在第一个def构造法下已经被私有化了，但是在第二个def下仍然可以被调用出来。是说print理解为是一种外部操作，而调用这种是内部操作，所以虽然私有了，但还可以调用。谢谢

Python 全系列/第一阶段：Python入门/面向对象 32092楼

<style>
        .box {
            width: 300px;
            height: 300px;
        }

        .left {
            float: left;
            width: 150px;
            height: 150px;
        }

        .top {
            float: top;
            width: 150px;
            height: 150px;
            background-color: skyblue;
        }

        .bottom {
            float: bottom;
            width: 150px;
            height: 150px;
            background-color: pink;
        }

        .right {
            float: right;
            width: 150px;
            height: 300px;
            background-color: blue;
        }
    </style>
</head>
<body>
    <div class="box">
        <div class="left">
          <div class="top"></div>
          <div class="bottom"></div>
        </div>
        <div class="right"></div>
      </div>
</body>

WEB前端全系列/第一阶段：HTML5+CSS3模块/初识CSS 32093楼

老师您好，我这里没有Unicode 怎么办。我想知道一下为什么我没有

JAVA 全系列/第一阶段：AI驱动的JAVA编程/JAVA入门和背景知识 32094楼

<style>
div>h3{
color:red;}
</style>
<body>
<div>
       <h3>这是一个标题</h3>
        <p>
            <h3>这是一个标题</h3>
        </p>
    </div>
    </body>

WEB前端全系列/第一阶段：HTML5+CSS3模块/CSS选择器 32095楼

老师，在第一次启动网络的时候是启动成功的，后来关掉之后在打开就变成这样了。这是什么问题呢？

JAVA 全系列/第八阶段：Linux入门到实战/Linux（旧） 32096楼

不是用的idea吗，怎么变成用Eclipes了，看的有点蒙，idea中怎么创建XML呢？

JAVA 全系列/第二阶段：JAVA 基础深化和提高/XML 技术（旧） 32097楼

老师，中间隐藏部分我想写过渡（官网有过渡），不能用display，所以我用了高度设为零，鼠标悬停后高度变为正常高度从而实现将隐藏部分显示出来的效果，但是我的效果就是有一条阴影线（官网没有），不知道哪里来的？并且鼠标悬停在这条线上，隐藏部分也会出来，可我语法里写的是鼠标悬停在Li标签上！我用display属性的时候，就一切正常，麻烦老师帮我看一下，一直困扰。

html,body,div,h1,h2,h3,h4,h5,h6,dd,dt,dl,form,label,table,caption,tbody,tfoot,thead,tr,td,th,ul,ol,li,pre
,fieldset,legend,input,textarea,button,blockquote,p{margin:0;padding:0}
ul,ol,li{list-style-type:none;}
body{text-align: center;}
img,input{vertical-align:middle;}
img{border:none}
a{text-decoration: none;}
@font-face {font-family: "iconfont";
  src: url('iconfont.eot?t=1617464689211'); /* IE9 */
  src: url('iconfont.eot?t=1617464689211#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'),
  url('iconfont.woff?t=1617464689211') format('woff'),
  url('iconfont.ttf?t=1617464689211') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
  url('iconfont.svg?t=1617464689211#iconfont') format('svg'); /* iOS 4.1- */
}

.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-icon-test:before {
  content: "\e634";
}

.icon-icon-test1:before {
  content: "\e63b";
}

.icon-icon-test2:before {
  content: "\e63c";
}

.icon-icon-test3:before {
  content: "\e63e";
}

.icon-icon-test4:before {
  content: "\e63f";
}

.icon-icon-test5:before {
  content: "\e640";
}

.icon-icon-test6:before {
  content: "\e641";
}

.icon-icon-test7:before {
  content: "\e642";
}

.icon-icon-test8:before {
  content: "\e644";
}

.icon-icon-test9:before {
  content: "\e645";
}

.icon-icon-test10:before {
  content: "\e648";
}

.icon-icon-test11:before {
  content: "\e64a";
}

.icon-icon-test12:before {
  content: "\e64d";
}

.icon-icon-test13:before {
  content: "\e64e";
}

.icon-icon-test14:before {
  content: "\e64f";
}

.icon-icon-test15:before {
  content: "\e650";
}

.icon-icon-test16:before {
  content: "\e65f";
}

.icon-icon-test17:before {
  content: "\e65e";
}

.icon-alipay:before {
  content: "\e666";
}

.icon-taobao:before {
  content: "\e667";
}
/* 白色导航部分 */
.white-nav{
    width:100%;
    height:100px;
    /* background-color:cadetblue; */
    position:relative;
}
.wrap-nav{
    width:1226px;
    height:100px;
    margin: 0 auto;
}

/* 白色导航左侧logo处内容及样式 */
.logo{
    width:56px;
    height:56px;
    float:left;
    margin-top:22px;
    position: relative;
    overflow:hidden;
}
.logo>img{
    width:56px;
    height:56px;
    /* 将引入的图片设置成带圆角形状 */
    border-radius:40%;
    position:absolute;
    /* 图片位置改变有0.5s的过渡 */
    transition:all .5s;
}
/* 对引入的两张图片进行绝对定位，鼠标悬停在父元素logo上，位置发生改变 */
.logo-mi2{
    left:0;
}
.mifile{
    left:-56px;
}
.logo:hover>.logo-mi2{
    left:56px;
}
.logo:hover>.mifile{
    left:0;
}
.logo:hover{
    display:block;
}

/* 白色导航中间部分内容及样式 */
.nav-bar{
    width:874px;
    height:100px;
    line-height:100px;
    float:left;
}
.nav-bar>ul>li{
    float:left;                                                                                                                                                                                                                                                                                                                                                                                                                 
}
.nav-bar>ul>li>a{ 
    color:#333;
    padding:0 10px;
}
.nav-bar>ul>li:first-child img{
    margin-top:22.5px;
}
/* 鼠标悬停在中间部分Li标签里的超链接a上，字体颜色改变 */
.nav-bar>ul>li>a:hover{
    color:#ff6700;
}
/* 中间部分隐藏的大盒子样式 */
.nav-bar-list{
    width:100%;
    height:0px;
    background-color:#fff;
    border-top:1px solid #eee;
    box-shadow:0 2px 3px rgba(0,0,0,.18);
    position:absolute;
    top:100px;
    left:0;

    /* 当高度设置为0时，其里面的内容部分（含文字、图片等)即为溢出部分，将溢出部分隐藏用overflow:hidden */
    overflow:hidden;  
    /* 将自己隐藏起来    */
    /* display:none;和下文的display:block一起实现将元素隐藏再显示，但上文的高度需设置成应有的高度 */
}
/* 白色导航中间nav-bar部分隐藏的大盒子里嵌套一个div */
.wrap>ul>li{
    width:180px;
    height:229px;
    float:left;
}
/* 隐藏的大盒子中li里的图片外嵌套一个div，目的是设置右边框 */
.img-box{
    width:100%;
    height:110px;
    margin-top:35px;
    margin-bottom:16px;
    border-right:1px solid #e0e0e0;
    box-sizing:border-box;
}
.img-box>img{
    width:160px;
    height:110px; 
}
/* 最后一个Li元素里面的img-box右边框为0 */
.wrap>ul>li:last-child>.img-box{
    border-right:0;
}
.name1,.price1{
    font-size:12px;
    line-height:20px;
}
.name1{ 
    color:#333;
}
.price1{
    color:#ff6700;
}
/* 鼠标悬停在li上，隐藏的大盒子显示出来 */
.nav-bar>ul>li:hover>.nav-bar-list{
 /* display:block;第二种将元素显示出来的方法(但过渡属性不作用于display,作用于颜色、数值、转换、阴影，)，
 用display:none;将nav-bar-list隐藏，高度为正常高度，而不是0，本效果要求过渡，所以用高度为0溢出隐藏的方法 */
    height:229px;
}
/* 白色导航右侧搜索框内容及样式 */
.search{
    width:296px;
    height:100px;
    /* background-color: darkkhaki; */
    float:left;
    position:relative;
}
.search>input{
    width:244px;
    height:50px;
    padding:0 10px;
    border:1px solid #e0e0e0;
    font-size:14px;
    margin-top:25px;
    border-right:0;
    box-sizing:border-box;
    /* 鼠标点击后没有边框 */
    outline:none;
    float:left;
    transition:all .2s;
}
.search>button{
    width:52px;
    height:50px;
    margin-top:25px;
    border:1px solid #e0e0e0;
    outline:none;
    float:left;
    transition:all .2s;
}
/* 鼠标悬停在input上，input和它的兄弟相邻元素button的边框颜色改变 */
.search>input:hover,.search>input:hover~button{
    border:1px solid #b0b0b0;
}
/* 鼠标悬停在button上，鼠标变为小手，背景颜色改变 */
.search>button:hover{
    cursor:pointer;
    background-color:#ff6700;
    color:#fff;
}
.search>input:focus,.search>input:focus~button{
    border:1px solid #ff6700;
}
.search-list{
    width:245px;
    height:181px;
    background-color:#fff;
    border:1px solid #ff6700;
    border-top:none;
    box-sizing:border-box;
    position:absolute;
    top:75px;
    left:0;
    display:none;
}
/* 在input处点击鼠标，其后面第二个元素即.search-list出现，（通用选择器） */
.search>input:focus~.search-list{
    display:block;
}

 <!-- 白色导航部分 -->
    <div class="white-nav">
        <div class="wrap-nav">
            <div class="logo">
                <img src="https://s02.mifile.cn/assets/static/image/logo-mi2.png" alt="" class="logo-mi2">
                <img src="https://i1.mifile.cn/f/i/17/appdownload/download.png?1" alt="" class="mifile">
            </div>
            <div class="nav-bar">
                <ul>
                    <li>
                        <a href="#">
                           <img src="../images/f58837161090e2e04bf687088b2ffe77.gif" alt="">
                        </a>
                    </li>
                    <li>
                        <a href="#">小米手机</a>
                        <div class="nav-bar-list">
                            <div class="wrap">
                                <ul>
                                    <li>
                                        <div class="img-box">
                                            <img src="../images/85e44ea2405ff8414148bbde7446b137.png" alt="">
                                        </div>
                                        <p class="name1">小米MIX FOLD</p>
                                        <p class="price1">9999元起</p>
                                    </li>
                                    <li>
                                        <div class="img-box">
                                            <img src="../images/1a359e9346e3c6ee8c9d8389e3fd9458.png" alt="">
                                        </div>
                                        <p class="name1">小米11 Ultra</p>
                                        <p class="price1">5999元起</p>
                                    </li>
                                    <li>
                                        <div class="img-box">
                                            <img src="../images/a1c45eadcedeb27b1cafca0359422da9.png" alt="">
                                        </div>
                                        <p class="name1">小米11 Pro</p>
                                        <p class="price1">4999元起</p>
                                    </li>
                                    <li>
                                        <div class="img-box">
                                            <img src="../images/56e3379b5422cb06e5c8a0c546445606.png" alt="">
                                        </div>
                                        <p class="name1">小米11 青春版</p>
                                        <p class="price1">2299元起</p>
                                    </li>
                                    <li>
                                        <div class="img-box">
                                            <img src="../images/f9149ef3ba2c9025a4a21c98ae793808.png" alt="">
                                        </div>
                                        <p class="name1">小米10S</p>
                                        <p class="price1">3299元起</p>
                                    </li>
                                    <li>
                                        <div class="img-box">
                                            <img src="../images/963679eaf3937351e154600ab3448460.png" alt="">
                                        </div>
                                        <p class="name1">小米11</p>
                                        <p class="price1">3999元起</p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </li>                                  
                </ul>
            </div>
            <div class="search">
                <input type="text" placeholder="【以旧换新】至高补贴3888元">
                <button class="iconfont">&#xe63c;</button>
                <div class="search-list">
                    <ul>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>   

</body>
</html>

WEB前端全系列/第一阶段：HTML5+CSS3模块/CSS3新特性 32098楼

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .box{
            padding: 0 200px;
            height: 300px;
        }
        .content{
            width: 100%;
            height: 300px;
            background-color: red;
            float: left;
        }

        .left{
            width: 200px;
            height: 300px;
            background-color: palegreen;
            float: left;
            position: relative;
            left: -200px;
            margin-left: -100%;
        }

        .right{
            width: 200px;
            height: 300px;
            background-color: skyblue;
            float: left;
            position: relative;
            right: -200px;
            margin-left: -200px;
        }
    </style>
</head>
<body>
<div class="box">
    <div class="content"></div>
    <div class="left"></div>
    <div class="right"></div>
</div>
</body>
</html>

老师，我有点没太明白，为什么设置了

 margin-left: -100%;

之后，元素就会上去呢，这个布局和flex布局有什么区别呢

WEB前端全系列/第二十三阶段：经典面试题解析/HTML+CSS 32099楼

老师，为什么这个height会报错，显示不是int类，但是定义的是int类

，

JAVA 全系列/第一阶段：AI驱动的JAVA编程/飞机大战小项目训练 32100楼

同学您好