man.cgi源码
#! /bin/sh
eval `sh proccgi.sh $*`
echo "Content-type: text/html"
echo
echo
echo "<html>"
echo "<head>"
echo "<meta charset="UTF-8">"
echo "<title>shell-cgi实现man命令</title>"
echo "<style>"
echo "pre {margin:0 auto; width:"50%"; height:"100%"; font-size:12pt;}"
echo "</style>"
echo "</head>"
echo "<body>"
if man $FORM_command>/dev/null
then
echo "<pre>"
man $FORM_command
echo "</pre>"
else
echo "<p>对不起，没有查询到相关信息"
fi
echo "</body>"
echo "</html>"
html源码
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>man for web</title>
<link rel="stylesheet" type="text/css" href="man.css"/>
<script type="text/javascript">
window.onload=function()
{
var submit=document.getElementById("submit");
submit.onclick=function(){
if(document.myform.command.value==""){
alert("你没有输入任何信息");
return false;
}
}
}
</script>
</head>
<body>
<div id="box">
<h1>man for web</h1>
<form method="post" action="/cgi-bin/man.cgi" name="myform">
<input type="text" placeholder="命令" name="command"></input>
<button class="but" type="submit" id="submit">确定</button>
</form>
</div>
</body>
</html>
man.css源码
html{
width: 100%;
height: 100%;
overflow: hidden;
}
body{
width: 100%;
height: 100%;
margin: 0;
background-color: #4A374A;
}
#box{
position: absolute;
top: 50%;
left:50%;
margin: -150px 0 0 -150px;
width: 300px;
height: 300px;
}
#box h1{
color: #fff;
letter-spacing: 1px;
text-align: center;
}
h1{
font-size: 2em;
margin: 0.67em 0;
}
input{
width: 278px;
height: 18px;
margin-bottom: 10px;
outline: none;
padding: 10px;
font-size: 13px;
color: #fff;
border-top: 1px solid #312E3D;
border-left: 1px solid #312E3D;
border-right: 1px solid #312E3D;
border-bottom: 1px solid #56536A;
border-radius: 4px;
background-color: #2D2D3F;
}
.but{
width: 300px;
min-height: 20px;
display: block;
background-color: #4a77d4;
border: 1px solid #3762bc;
color: #fff;
padding: 9px 14px;
font-size: 15px;
line-height: normal;
border-radius: 5px;
margin: 0;
}
效果图
proccgi.sh是在网上很容易找到，就不贴出源码了。它的作用是取得post过来的数据。
参考链接：
http://www.jb51.net/web/458871.html