zoukankan      html  css  js  c++  java
  • nginx+fancyindex

    编译

    ./configure  --prefix=/usr/local/nginx --without-http_memcached_module --user=nginx --group=nginx --with-http_stub_status_module --with-http_ssl_module --with-http_gzip_static_module --with-openssl=/usr/local/src/openssl-1.1.0c --with-zlib=/usr/local/src/zlib-1.2.8 --with-pcre=/usr/local/src/pcre-8.39 --add-module=/usr/local/src/ngx-fancyindex-master

    配置

    server {
    listen 80;
    server_name localhost;
    
    charset utf-8;
    
    root /data/web;
    # autoindex on;
    # autoindex_exact_size off;
    # autoindex_localtime on;
    fancyindex on;
    fancyindex_exact_size off;
    fancyindex_localtime on;
    fancyindex_footer footer.html;
    fancyindex_header header.html;
    fancyindex_ignore footer.html header.html;

    美化

    网上找好看的footer.html和header.html

    如footer.html

    <table id="footer" cellpadding="0" cellspacing="1">
    <thead><tr><td colspan="3">本页面由xxx提供</td></tr><thead>
    </table></body></html>

    header.html

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head><meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <style type="text/css" media="screen">
    body,html {background:#fff;font-family: "Lucida Grande",Calibri,Arial;font-size: 13pt;color: #333;background: #f8f8f8;}
    tr.e {background:#f4f4f4;}
    th,td {padding:0.1em 0.5em;}
    th {text-align:left;font-weight:bold;background:#eee;border-bottom:1px solid #aaa;}
    #top1 {width:80%; font-size:28px; margin: 0 auto 5px auto;}
    #top2 {width:80%; font-size:18px; margin: 0 auto 5px auto;}
    #footer {width:80%;margin: 0 auto; padding: 10pt 0;font-size: 10pt;text-align:center;}
    #footer a {font-size: 14px; font-weight: normal; text-decoration: underline;}
    #list {border:1px solid #aaa;width:80%;margin: 0 auto;padding: 0;}
    a {color: #b00;font-size: 11pt;font-weight: bold;text-decoration: none;}
    a:hover {color: #000;}
    #readme {padding:0;margin:1em 0;border:none;width:100%;}
    </style>
    <script type="text/javascript">// <![CDATA[function ngx_onload(){var f=document.getElementById('readme');if(!(f&&f.contentDocument))return;f.style.height=f.contentDocument.body.offsetHeight+'px';f.contentDocument.body.style.padding='0';f.contentDocument.body.style.margin='0';}// ]]></script>
    <title>Inspur Linux OS Download Center</title>
    </head>
    <body onload="ngx_onload()">
    <h1 id="top1">XXX Linux OS Download Center</h1>
    <h1 id="top2">Directory listing of
  • 相关阅读:
    ES6 fetch函数与后台交互
    玩转HTML5移动页面(动效篇)
    使用Flexible实现手淘H5页面的终端适配
    简单判断是否是微信打开页面代码
    移动端JS 触摸事件基础
    移动端中如何检测设备方向的变化?
    JS禁止横竖屏切换,强制横竖屏显示
    移动端Web开发如何处理横竖屏
    关于手机端CSS Sprite图标定位的一些领悟
    移动web页面使用微软雅黑字体的问题
  • 原文地址:https://www.cnblogs.com/feral/p/6737334.html
Copyright © 2011-2022 走看看