当前位置:Gxlcms > html代码 > HTML仿命令行界面具体实现_HTML/Xhtml_网页制作

HTML仿命令行界面具体实现_HTML/Xhtml_网页制作

时间:2021-07-01 10:21:17 帮助过:26人阅读

HTML部分

代码如下:




WeChat Manager

输出到界面
$("ul").append("
  • "+msg+"
  • "); //获取返回值并输出
    $("#in").val(""); //清空输入框
    $("#text").scrollTop($("#text").scrollTop()+32);//滚动条拉到最下面,显示出输入框
    }
    });
    }
    });
    $("#in")[0].focus();
    });






    Wechat Dos



    • Welcome...

    • login:








    CSS部分

    代码如下:

    @charset "utf-8";
    body {
    background-color:#396DA5;
    margin:0px;
    padding:0px;
    color:#fff;
    font:"微软雅黑";
    font-size:14px;}
    .window {
    border:6px #ccc outset;
    width:680px;
    height:442px;
    background-color:#000;
    position:absolute;
    top:40px;
    left:68px;
    overflow:hidden}
    .title {
    background-color:#08246B;
    padding:2px;}
    #text {
    background-color:#000;
    border-top:#ccc outset 2px;
    height:420px;
    overflow-y:scroll;}
    ul {
    margin:0px;
    padding:0px;
    list-style:none;}
    input {
    background-color:#000;
    border:0;
    color:#fff;
    outline:none;
    /*font-size:12px;*/
    width:100%}

    效果图:

    人气教程排行