代码人生 - Mrxn's Blog-关注web安全、热爱黑客技术

网警已介入（php网页版）-实现原理（源代码奉献）-装逼利器 PHP

一周多没更新了，最近忙。。。别介意-----介意也没办法。。。

最近网警已介入很火啊，至少我在论坛上看到很火爆，各种语言的版本都出来了。。。。

于是呢。。。作为一个PHPer ，用网页实现可以实现全平台（默默地装逼），是不是更有逼格！（此处应有掌声^_^）

先看一下效果：

大家可以使用我的这个地址来实现：code.mrxn.net （娱乐而已，一切自负！）

原理剖析：

其实就是利用QQ分享：http://connect.qq.com/intro/sharetoqq/

这个是核心的连接地址(QQ分享)：

http://connect.qq.com/widget/shareqq/index.html?url=https://mrxn.net/&desc=&title=这里是Mrxn网络安全中心&summary=这里是Mrxn网络安全中心的介绍&pics=http://i13.tietuku.com/1d566d5f038fd9f7s.jpg&flash=&site=Mrxn网络部&style=201&width=32&height=32

url=https://mrxn.net/	点击的访问地址
title=这里是Mrxn网络安全中心	标题内容
summary=这里是Mrxn网络安全中心的介绍	简介内容
pics=http://i13.tietuku.com/1d566d5f038fd9f7s.jpg	左边图片
site=Mrxn网络部	信息来源

写程序的话，只需要填写这几个字符串信息，然后拼接成url就可以实现了！

我的php源码：

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>网警介入-网页版</title>
<style>
body,input,button{font:normal 14px "Microsoft Yahei";margin:0;padding:0}
.odform-tit{font-weight:normal;font-size:25px;color:#595757;line-height:40px;text-align:center;border-bottom:1px solid #c9cacb;margin:0;padding:5% 0}
.odform-tit img{height:40px;vertical-align:middle;margin-right:15px}
.odform{padding:5%}
.input-group{margin-bottom:5%;position:relative}
.input-group label{padding:2% 0;position:absolute;color:#595757}
.input-group input{margin-left:5em;padding:3% 5%;box-sizing:border-box;background:#efeff0;border:0;border-radius:5px;color:#595757;width:75%}
.odform button{background:#8ec31f;color:#fff;text-align:center;border:0;border-radius:10px;padding:3%;width:100%;font-size:16px}
.odform .cal{background-image:url(images/daetixian-cal.png);background-repeat:no-repeat;background-position:95% center;background-size:auto 50%}
.odform .xl{background-image:url(images/daetixian-xl.png);background-repeat:no-repeat;background-position:95% center;background-size:auto 20%}
</style>
</head>

<body>
    <h1 class="odform-tit">请合法使用</h1>
<font color=red>使用方法：填写好相应信息，点击提交<br>跳转腾讯网页后登录QQ就可以发给你的好友</font>
<hr>
<div class="odform">
    <form action="login.php" method="post">
        <div class="input-group">
            <label for="wdname">标题</label>
            <input type="text"id="khname" name="title" value="您好，我是网警xxx">
        </div>
        <div class="input-group">
            <label for="khname">摘要</label>
            <input type="text" id="khname" name="summary" value="如有疑问可以点击本窗口进入我们官方网站">
        </div>
        <div class="input-group">
            <label for="khname">网警图片</label>
            <input type="text" id="khname" name="pics" value="http://i13.tietuku.com/1d566d5f038fd9f7s.jpg">
        </div>
             <div class="input-group">
            <label for="khname">跳转地址</label>
            <input type="text" id="khname" name="url" value="http://net.china.com.cn/">
        </div>
        <div class="input-group">
            <label for="khname">信息来源</label>
            <input type="text" id="khname" name="site" value="四川网警部">
        </div>

        <button>立即提交</button>

    </form>
</div>

<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<h1>由 Mrxn 提供</h1>
效果如图：<br>
<img src="http://i13.tietuku.com/29eb29343cd0162bs.jpg">
<br><button>
<a href="https://mrxn.net">Mrxn's Blog</a></button>
</div>
</body>
</html>

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>网警介入-网页版</title></head>
<body><body style="text-align:center">
<?php 
$title = $_POST['title'];
$pics = $_POST['pics']; 
$site = $_POST['site']; 
$url = $_POST['url']; 
$summary = $_POST['summary']; 
{ 
echo "您填写的信息为<hr>标题: $title <hr>摘要： $summary<hr>网警图片: $pics<hr>信息来源: $site <hr>跳转网址: $url <br>\n"; 
echo "<hr><h1><a href=http://connect.qq.com/widget/shareqq/index.html?url=$url&desc=&title=$title&summary=$summary&pics=$pics&flash=&site=$site&style=201&width=32&height=32>马上分享</a></h1>"; 
} 
?>
</body>
</html>

分别是 index.php 和 login.php文件代码实现起来 so easy 。。。高手默默路过就好！喜欢的就拿去装逼吧，但是提醒：注意适度，注意安全！

欢迎转载，但是请注明出处，特别提示那些转载不写出处的，随便吧，说多了没用，自觉！

标签: 分享 QQ 腾讯网警

admin 发布于 2015-10-3 21:18

评论(11) 浏览(22866)

Emlog文章标题自动生成英语别名，利于SEO emlog

很多搞SEO的通常都是自己把文章标题给写成拼音，这样感觉好麻烦的有没有，现在可以在修改内核的保存文件就行，前提是你要善于折腾，如果不喜欢又懒得折腾的那就不需要看下去了。

改动教程：
1、打开admin目录下载的save_log.php文件，在里面加入以下代码

class Chinese_to_PY {
    /**
     * 拼音字符转换图
     * @var array
     */
    private static $_aMaps = array(
        'a'=>-20319,'ai'=>-20317,'an'=>-20304,'ang'=>-20295,'ao'=>-20292,
        'ba'=>-20283,'bai'=>-20265,'ban'=>-20257,'bang'=>-20242,'bao'=>-20230,'bei'=>-20051,'ben'=>-20036,'beng'=>-20032,'bi'=>-20026,'bian'=>-20002,'biao'=>-19990,'bie'=>-19986,'bin'=>-19982,'bing'=>-19976,'bo'=>-19805,'bu'=>-19784,
        'ca'=>-19775,'cai'=>-19774,'can'=>-19763,'cang'=>-19756,'cao'=>-19751,'ce'=>-19746,'ceng'=>-19741,'cha'=>-19739,'chai'=>-19728,'chan'=>-19725,'chang'=>-19715,'chao'=>-19540,'che'=>-19531,'chen'=>-19525,'cheng'=>-19515,'chi'=>-19500,'chong'=>-19484,'chou'=>-19479,'chu'=>-19467,'chuai'=>-19289,'chuan'=>-19288,'chuang'=>-19281,'chui'=>-19275,'chun'=>-19270,'chuo'=>-19263,'ci'=>-19261,'cong'=>-19249,'cou'=>-19243,'cu'=>-19242,'cuan'=>-19238,'cui'=>-19235,'cun'=>-19227,'cuo'=>-19224,
        'da'=>-19218,'dai'=>-19212,'dan'=>-19038,'dang'=>-19023,'dao'=>-19018,'de'=>-19006,'deng'=>-19003,'di'=>-18996,'dian'=>-18977,'diao'=>-18961,'die'=>-18952,'ding'=>-18783,'diu'=>-18774,'dong'=>-18773,'dou'=>-18763,'du'=>-18756,'duan'=>-18741,'dui'=>-18735,'dun'=>-18731,'duo'=>-18722,
        'e'=>-18710,'en'=>-18697,'er'=>-18696,
        'fa'=>-18526,'fan'=>-18518,'fang'=>-18501,'fei'=>-18490,'fen'=>-18478,'feng'=>-18463,'fo'=>-18448,'fou'=>-18447,'fu'=>-18446,
        'ga'=>-18239,'gai'=>-18237,'gan'=>-18231,'gang'=>-18220,'gao'=>-18211,'ge'=>-18201,'gei'=>-18184,'gen'=>-18183,'geng'=>-18181,'gong'=>-18012,'gou'=>-17997,'gu'=>-17988,'gua'=>-17970,'guai'=>-17964,'guan'=>-17961,'guang'=>-17950,'gui'=>-17947,'gun'=>-17931,'guo'=>-17928,
        'ha'=>-17922,'hai'=>-17759,'han'=>-17752,'hang'=>-17733,'hao'=>-17730,'he'=>-17721,'hei'=>-17703,'hen'=>-17701,'heng'=>-17697,'hong'=>-17692,'hou'=>-17683,'hu'=>-17676,'hua'=>-17496,'huai'=>-17487,'huan'=>-17482,'huang'=>-17468,'hui'=>-17454,'hun'=>-17433,'huo'=>-17427,
        'ji'=>-17417,'jia'=>-17202,'jian'=>-17185,'jiang'=>-16983,'jiao'=>-16970,'jie'=>-16942,'jin'=>-16915,'jing'=>-16733,'jiong'=>-16708,'jiu'=>-16706,'ju'=>-16689,'juan'=>-16664,'jue'=>-16657,'jun'=>-16647,
        'ka'=>-16474,'kai'=>-16470,'kan'=>-16465,'kang'=>-16459,'kao'=>-16452,'ke'=>-16448,'ken'=>-16433,'keng'=>-16429,'kong'=>-16427,'kou'=>-16423,'ku'=>-16419,'kua'=>-16412,'kuai'=>-16407,'kuan'=>-16403,'kuang'=>-16401,'kui'=>-16393,'kun'=>-16220,'kuo'=>-16216,
        'la'=>-16212,'lai'=>-16205,'lan'=>-16202,'lang'=>-16187,'lao'=>-16180,'le'=>-16171,'lei'=>-16169,'leng'=>-16158,'li'=>-16155,'lia'=>-15959,'lian'=>-15958,'liang'=>-15944,'liao'=>-15933,'lie'=>-15920,'lin'=>-15915,'ling'=>-15903,'liu'=>-15889,'long'=>-15878,'lou'=>-15707,'lu'=>-15701,'lv'=>-15681,'luan'=>-15667,'lue'=>-15661,'lun'=>-15659,'luo'=>-15652,
        'ma'=>-15640,'mai'=>-15631,'man'=>-15625,'mang'=>-15454,'mao'=>-15448,'me'=>-15436,'mei'=>-15435,'men'=>-15419,'meng'=>-15416,'mi'=>-15408,'mian'=>-15394,'miao'=>-15385,'mie'=>-15377,'min'=>-15375,'ming'=>-15369,'miu'=>-15363,'mo'=>-15362,'mou'=>-15183,'mu'=>-15180,
        'na'=>-15165,'nai'=>-15158,'nan'=>-15153,'nang'=>-15150,'nao'=>-15149,'ne'=>-15144,'nei'=>-15143,'nen'=>-15141,'neng'=>-15140,'ni'=>-15139,'nian'=>-15128,'niang'=>-15121,'niao'=>-15119,'nie'=>-15117,'nin'=>-15110,'ning'=>-15109,'niu'=>-14941,'nong'=>-14937,'nu'=>-14933,'nv'=>-14930,'nuan'=>-14929,'nue'=>-14928,'nuo'=>-14926,
        'o'=>-14922,'ou'=>-14921,
        'pa'=>-14914,'pai'=>-14908,'pan'=>-14902,'pang'=>-14894,'pao'=>-14889,'pei'=>-14882,'pen'=>-14873,'peng'=>-14871,'pi'=>-14857,'pian'=>-14678,'piao'=>-14674,'pie'=>-14670,'pin'=>-14668,'ping'=>-14663,'po'=>-14654,'pu'=>-14645,
        'qi'=>-14630,'qia'=>-14594,'qian'=>-14429,'qiang'=>-14407,'qiao'=>-14399,'qie'=>-14384,'qin'=>-14379,'qing'=>-14368,'qiong'=>-14355,'qiu'=>-14353,'qu'=>-14345,'quan'=>-14170,'que'=>-14159,'qun'=>-14151,
        'ran'=>-14149,'rang'=>-14145,'rao'=>-14140,'re'=>-14137,'ren'=>-14135,'reng'=>-14125,'ri'=>-14123,'rong'=>-14122,'rou'=>-14112,'ru'=>-14109,'ruan'=>-14099,'rui'=>-14097,'run'=>-14094,'ruo'=>-14092,
        'sa'=>-14090,'sai'=>-14087,'san'=>-14083,'sang'=>-13917,'sao'=>-13914,'se'=>-13910,'sen'=>-13907,'seng'=>-13906,'sha'=>-13905,'shai'=>-13896,'shan'=>-13894,'shang'=>-13878,'shao'=>-13870,'she'=>-13859,'shen'=>-13847,'sheng'=>-13831,'shi'=>-13658,'shou'=>-13611,'shu'=>-13601,'shua'=>-13406,'shuai'=>-13404,'shuan'=>-13400,'shuang'=>-13398,'shui'=>-13395,'shun'=>-13391,'shuo'=>-13387,'si'=>-13383,'song'=>-13367,'sou'=>-13359,'su'=>-13356,'suan'=>-13343,'sui'=>-13340,'sun'=>-13329,'suo'=>-13326,
        'ta'=>-13318,'tai'=>-13147,'tan'=>-13138,'tang'=>-13120,'tao'=>-13107,'te'=>-13096,'teng'=>-13095,'ti'=>-13091,'tian'=>-13076,'tiao'=>-13068,'tie'=>-13063,'ting'=>-13060,'tong'=>-12888,'tou'=>-12875,'tu'=>-12871,'tuan'=>-12860,'tui'=>-12858,'tun'=>-12852,'tuo'=>-12849,
        'wa'=>-12838,'wai'=>-12831,'wan'=>-12829,'wang'=>-12812,'wei'=>-12802,'wen'=>-12607,'weng'=>-12597,'wo'=>-12594,'wu'=>-12585,
        'xi'=>-12556,'xia'=>-12359,'xian'=>-12346,'xiang'=>-12320,'xiao'=>-12300,'xie'=>-12120,'xin'=>-12099,'xing'=>-12089,'xiong'=>-12074,'xiu'=>-12067,'xu'=>-12058,'xuan'=>-12039,'xue'=>-11867,'xun'=>-11861,
        'ya'=>-11847,'yan'=>-11831,'yang'=>-11798,'yao'=>-11781,'ye'=>-11604,'yi'=>-11589,'yin'=>-11536,'ying'=>-11358,'yo'=>-11340,'yong'=>-11339,'you'=>-11324,'yu'=>-11303,'yuan'=>-11097,'yue'=>-11077,'yun'=>-11067,
        'za'=>-11055,'zai'=>-11052,'zan'=>-11045,'zang'=>-11041,'zao'=>-11038,'ze'=>-11024,'zei'=>-11020,'zen'=>-11019,'zeng'=>-11018,'zha'=>-11014,'zhai'=>-10838,'zhan'=>-10832,'zhang'=>-10815,'zhao'=>-10800,'zhe'=>-10790,'zhen'=>-10780,'zheng'=>-10764,'zhi'=>-10587,'zhong'=>-10544,'zhou'=>-10533,'zhu'=>-10519,'zhua'=>-10331,'zhuai'=>-10329,'zhuan'=>-10328,'zhuang'=>-10322,'zhui'=>-10315,'zhun'=>-10309,'zhuo'=>-10307,'zi'=>-10296,'zong'=>-10281,'zou'=>-10274,'zu'=>-10270,'zuan'=>-10262,'zui'=>-10260,'zun'=>-10256,'zuo'=>-10254
    );

    /**
     * 将中文编码成拼音
     * @param string $chinese 要转换为拼音的字符串
     * @param string $sRetFormat 返回格式 [first:每个字的首字母|all:全拼音|one:字符串字母]
     * @return string
     */
    public static function getPY($chinese, $sRetFormat='first'){
        $sGBK = iconv('UTF-8', 'GBK', $chinese);
        $sUTF8 = iconv('GBK', 'UTF-8', $sGBK);
        if($sUTF8 != $chinese) $sGBK = $chinese;
        $aBuf = array();
        for ($i=0, $iLoop=strlen($sGBK); $i<$iLoop; $i++) {
            $iChr = ord($sGBK{$i});
            if ($iChr>160)
                $iChr = ($iChr<<8) + ord($sGBK{++$i}) - 65536;
            if ('first' == $sRetFormat || 'one' == $sRetFormat)
                //$aBuf[] = substr(self::zh2py($iChr),0,1);
                $aBuf[] = self::zh2py($iChr);
            else
                $aBuf[] = self::zh2py($iChr);

        }
        if ('first' === $sRetFormat)
            return implode('', $aBuf);
        elseif('one' == $sRetFormat)
            return $aBuf[0];
        else
            return implode(' ', $aBuf);
    }

    /**
     * 中文转换到拼音(每次处理一个字符)
     * @param number $iWORD 待处理字符双字节
     * @return string 拼音
     */
    private static function zh2py($iWORD) {
        if($iWORD>0 && $iWORD<160 ) {
            return chr($iWORD);
        } elseif ($iWORD<-20319||$iWORD>-10247) {
            return '';
        } else {
            foreach (self::$_aMaps as $py => $code) {
                if($code > $iWORD) break;
                $result = $py;
            }
            return $result;
        }
    }
}

最后将此文件下的：

$alias = isset($_POST['alias']) ? addslashes(trim($_POST['alias'])) : '';
修改成：
$al=htmlspecialchars($_POST['alias']);
if(empty($al)){
    $alias = preg_replace('/ /', '-', Chinese_to_PY::getPY($title,'all'));
}else{
    $alias = '';
}
保存，即可实现效果！

但是感觉标题太长了。。。正在研究缩短，或者是取货首字母，或前两个字母。。。

此文并非博主原创，是在博友独狼哪里看到的，原文地址：http://www.xlonewolf.net/course/32.html

标签: 编程代码 php emlog SEO

admin 发布于 2015-9-22 19:43

评论(4) 浏览(6981)

emlog开启评论审核之后，评论结束自动跳转回原文 emlog

emlog开启评论审核之后，评论结束就会跳转到这个界面：

不会自动跳转回原文，感觉不太好，于是呢，在论坛问了一下，最终修改方法如下，在此小计，希望可以帮到那些需要的童鞋：

找到 \include\lib\function.base.php 865行的 emMsg()函数，把

$isAutoGo = false 修改成  $isAutoGo = true

其实，函数里面有说明的，boolean $isAutoGo 是否自动返回 true false 。之后评论完就会自动跳转到原文了（注意看左上角的旋转的圆圈）：

随便吐槽，谁这么无奈，跑我这里刷广告。。。专门针对的。。。不过我只需要一键，就删除了所有广告，所以，慎重！！！

标签: 编程代码 php emlog

admin 发布于 2015-9-22 19:25

评论(0) 浏览(7206)

插件冲突导致emlog的rss输出出错 emlog

先来看一下插件冲突导致rss输出出错的样子吧：

估计很多的朋友都有过这种情况吧，rss.php输出出错，我也是，一开始以为是数据库表出错了，还使用工具箱修复，结果发现，还是不可以的。于是就把所有的插件都停用了，然后，慢慢测试，发现下面几个插件在激活状态都会导致rss.php输出出错：

1.奇遇的防垃圾评论插件地址：http://www.emlog.net/plugin/10 希望奇遇可以修复

2.二今的代码演示插件，地址：http://www.emlog.net/plugin/166 希望而今可以修复

3.vibbow的索引通知插件地址：http://www.emlog.net/plugin/9 希望可以修复

这些都是自己在最新版的emlog5.31上测试发现的，以为这些插件能够使用，但是版本上没有更新，所以兼容性不是很好。当然了，作者有时间最好修复一下，仅此小计一下，方便那些对于rss.php出错但是不知道什么原因的童鞋有点帮助，禁用这些插件就OK了，这些插件其实挺好的，只是没有升级更新。

禁用这些插件之后，rss输出就OK了：

标签: 编程代码 php emlog

admin 发布于 2015-8-29 21:52

评论(7) 浏览(7275)

博客决定取消使用pjax技术加载页面，简单分析 PHP

pjax是对ajax + pushState的封装，让你可以很方便的使用pushState技术。

同时支持了缓存和本地存储，下次访问的时候直接读取本地数据，无需在次访问。

并且展现方式支持动画技术，可以使用系统自带的动画方式，也可以自定义动画展现方式。

这是它的开源主页： https://github.com/welefen/pjax

我的博客也在前不久使用这项技术，具体的教程请前往Finlly博客查看：关于PJAX局部刷新；

但是使用之后，发现有如下几个问题：

1：我得服务器资源占用比不使用pjax之前多了30%，大神勿笑，也可能是我小菜不会优化；

2：加载之后会发现，会出现不能够加载其他的js，比如不能够加载第三方分享的js文件，或者是代码高亮插件的js，导致代码的高亮，复制，又或者是图片highslide插件等功能失效；

下面几点来至于互联网：

3：这个技术使用的场景很受限制，据我所知真正用这个技术的网站很少

因为html5的新api：pushState和replaceState的出现，让url脱离了#号。更重要的是支持了浏览器前进后退的事件触发onpopstate

4：不利于SEO，当然，你可以针对爬虫做处理，但那是自找麻烦

5：不同页面引用的资源很可能不同，切换页面需要动态加载新的js和css，容易和旧的CSS和JS产生冲突

6：不刷新页面，意味着页面占用的资源得不到释放，如果有内存泄露问题，页面会越来越卡

不知道各位有什么好的优化方案没，或者是在使用pjax过程中有哪些问题。

题外话：还是HTML5方便，赶紧学习html5，因为html5的新api：pushState和replaceState的出现，支持浏览器前进后退的事件触发onpopstate，pushState的功能具体来说就是修改url而页面无跳转，并且该url会被存放在历史记录中

当然为了满足某些需要你不需要存放在历史记录中就需要使用replaceState

而浏览器上前进和后退都会触发onpopstate能获取你设置的State对象

拿welefen的pjax说下原理:

1.在用户超链请求的时候拦截超链

2.拦截后同时发出两种行为 ajax请求以及 pushState

实际上他的设计是线性的，在超链被拦截后才会触发。

我更倾向于观察者模式，state被改变的时候触发。

如果你真的想用在项目中我推荐你直接使用 balupton/history.js · GitHub

在不支持html5的浏览器上采用了hash作为代替并且监听了statechange事件

标签: 编程 ajax pjax pushState html5

admin 发布于 2015-8-26 12:56

评论(12) 浏览(11338)

css样式设置小技巧汇总 PHP

水平居中设置-行内元素

如果被设置元素为文本、图片等行内元素时，水平居中是通过给父元素设置 text-align:center 来实现的。如下代码：

html代码：

<body>
  <div class="txtCenter">我是文本，哈哈，我想要在父容器中水平居中显示。</div>
</body>

css代码：

<style>
  div.txtCenter{ text-align:center; }
</style>

水平居中设置-定宽块状元素

当被设置元素为块状元素时用 text-align：center 就不起作用了，这时也分两种情况：定宽块状元素和不定宽块状元素。这一小节我们先来讲一讲定宽块状元素。

满足定宽和块状两个条件的元素是可以通过设置“左右margin”值为“auto”来实现居中的。我们来看个例子就是设置 div 这个块状元素水平居中：

html代码：

<body>
  <div>我是定宽块状元素，哈哈，我要水平居中显示。</div>
</body>

css代码：

<style>
div{
    border:1px solid red;/*为了显示居中效果明显为 div 设置了边框*/

    width:500px;/*定宽*/ margin:20px auto;/* margin-left 与 margin-right 设置为 auto */ }

</style>

也可以写成：

margin-left:auto;
margin-right:auto;

注意：元素的“上下 margin” 是可以随意设置的。

水平居中总结-不定宽块状元素方法（一）

在实际工作中我们会遇到需要为“不定宽度的块状元素”设置居中，比如网页上的分页导航，因为分页的数量是不确定的，所以我们不能通过设置宽度来限制它的弹性。

不定宽度的块状元素有三种方法居中（这三种方法目前使用的都比多）：

加入 table 标签
设置 display;inline 方法
设置 position:relative 和 left:50%;

这一小节我们来讲一下第一种方法：

第一步：为需要设置的居中的元素外面加入一个 table 标签 ( 包括 <tbody>、<tr>、<td> )。

第二步：为这个 table 设置“左右 margin 居中”（这个和定宽块状元素的方法一样）。

举例如下：

html代码：

<div> <table> <tbody>
    <tr><td> <ul>
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
    </ul>  </td></tr>
  </tbody>
</table> </div>

css代码：

<style> table{
    margin:0 auto;
} ul{list-style:none;margin:0;padding:0;}
li{float:left;display:inline;margin-right:8px;}
</style>

水平居中总结-不定宽块状元素方法（二）

第二种方法：改变块级元素的 dispaly 为 inline 类型，然后使用 text-align:center 来实现居中效果。如下例子：

html代码：

<body>
<div class="container">
    <ul>
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
    </ul>
</div>
</body>

css代码：

<style>
.container{ text-align:center; }
.container ul{
    list-style:none;
    margin:0;
    padding:0; display:inline; }
.container li{
    margin-right:8px;
    display:inline;
}
</style>

这种方法相比第一种方法的优势是不用增加无语义标签，简化了标签的嵌套深度，但也存在着一些问题：它将块状元素的 display 类型改为 inline，变成了行内元素，所以少了一些功能，比如设定长度值。

水平居中总结-不定宽块状元素方法（三）

方法三：通过给父元素设置 float，然后给父元素设置 position:relative 和 left:50%，子元素设置 position:relative 和 left:-50% 来实现水平居中。

代码如下：

<body>
<div class="container">
    <ul>
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
    </ul>
</div>
</body>

css代码：

<style>
.container{  float:left;
    position:relative;
    left:50% }

.container ul{
    list-style:none;
    margin:0;
    padding:0;  position:relative;
    left:-50%; }
.container li{float:left;display:inline;margin-right:8px;}
</style>

这种方法可以保留块状元素仍以 display:block 的形式显示，优点不添加无语议表标签，不增加嵌套深度，但它的缺点是设置了 position:relative，带来了一定的副作用。

这三种方法使用得都非常广泛，各有优缺点，具体选用哪种方法，可以视具体情况而定。

垂直居中-父元素高度确定的单行文本

父元素高度确定的单行文本的竖直居中的方法是通过设置父元素的 height 和 line-height 高度一致来实现的。如下代码：

<div class="container">
    hi,Mrxn!
</div>

css代码：

<style>
.container{ height:100px;
    line-height:100px; background:#999;
}
</style>

垂直居中-父元素高度确定的多行文本（方法一）

父元素高度确定的多行文本、图片、块状元素的竖直居中的方法有两种：

方法一：使用插入 table (包括tbody、tr、td)标签，同时设置 vertical-align：middle。

说到竖直居中，css 中有一个用于竖直居中的属性 vertical-align，但这个样式只有在父元素为 td 或 th 时，才会生效。所以又要插入 table 标签了。下面看一下例子：

html代码：

<body> <table><tbody><tr><td class="wrap"> <div>
    <p>看我是否可以居中。</p>
    <p>看我是否可以居中。</p>
    <p>看我是否可以居中。</p>
    <p>看我是否可以居中。</p>
    <p>看我是否可以居中。</p>
</div> </td></tr></tbody></table> </body>

css代码：

table td{height:500px;background:#ccc}

因为 td 标签默认情况下就默认设置了 vertical-align 为 middle，所以我们不需要显式地设置了。

垂直居中-父元素高度确定的多行文本（方法二）

在 chrome、firefox 及 IE8 以上的浏览器下可以设置块级元素的 display 为 table-cell，激活 vertical-align 属性，但注意 IE6、7 并不支持这个样式。

html代码：

<div class="container">
    <div>
        <p>看我是否可以居中。</p>
        <p>看我是否可以居中。</p>
        <p>看我是否可以居中。</p>
        <p>看我是否可以居中。</p>
        <p>看我是否可以居中。</p>
    </div>
</div>

css代码：

<style>
.container{
    height:300px;
    background:#ccc;  display:table-cell;/*IE8以上及Chrome、Firefox*/ vertical-align:middle;/*IE8以上及Chrome、Firefox*/
}
</style>

这种方法的好处是不用添加多余的无意义的标签，但缺点也很明显，它的兼容性不是很好，不兼容 IE6、7。

隐性改变display类型

有一个有趣的现象就是当为元素（不论之前是什么类型元素，display:none 除外）设置以下 2 个句之一：

position : absolute
float : left 或 float:right

元素会自动变为以 display:inline-block 的方式显示，当然就可以设置元素的 width 和 height 了且默认宽度不占满父元素。

如下面的代码，小伙伴们都知道 a 标签是行内元素，所以设置它的 width 是没有效果的，但是设置为 position:absolute 以后，就可以了。

<div class="container">
    <a href="#" title="">请单击这里</a>
</div>

css代码

<style>
.container a{ position:absolute; width:200px;
    background:#ccc;
}
</style>

标签: 编程代码 html css

admin 发布于 2015-8-19 19:09

评论(0) 浏览(5603)

emlog静态化插件有可能出现的几个问题/bug及解决方法 emlog

今天旧城博客来说加友链，我添加了之后发现，根本没有显示，ctrl+F5刷新，清空浏览器cookies，换浏览器，都试过了，还是没有显示，这是我又想是不是因为CDN的原因，于是关掉CDN，发现问题依旧存在；但是由于当时有事情没时间解决，就放了一下，就在刚刚，朋友们的评论信息也不能及时显示了，同时还测试了一下更换模板，发现居后台换了模板之后，去首页刷新还是原来的模板，这可把我吓一跳，还以为是服务器出问题了，于是登陆服务器，都检查了一遍，发现没有什么事儿。。。我就纳闷了。。。试了一下后台数据的更新缓存，一样没有效果。

就在准备找人询问原因的时候，突然灵光一闪！嘿嘿，插件！嗯，我试着把emlog静态化插件禁止了，更新缓存，首页已刷新，OK，各项恢复正常。。。其实之前也遇到过因为这个emlog静态化插件和CSRF保护脚本插件有冲突，开启CSRF保护脚本插件的时候使用emlog静态化插件就会出现权限问题403 forbidden这类的问题。之前还遇到过类似的插件冲突问题，插件打开顺序不同，结果显示的界面就会不同，或者是功能就会不同程度的变化。。。

总结一下：emlog程序很简洁，通过插件可以是程序变得功能多且强大，但是就会导致程序变慢，各种JS冲突，权限分配、判断等等一系列问题，所以当你的emlog遇到了一些小问题问题（显示，排版等）的时候，可以尝试先把所有的插件禁止了，如果你的插件比较多，可以选择上传官方的emlog工具箱插件，可以一键禁止所有已开启的插件，当然你在排除问题之前可以先备份一下相关数据，到时候找到了问题直接恢复数据，再去禁用相关插件就可以了，这样省时省力。最后呢，希望新版本的emlog6正式版发布的时候可以解决这些问题，同时呢，也希望各位emlog的开发者能够注意，考虑这些问题，在制作插件的时候多考虑一下插件的兼容性。以上内容只是我的个人见解，希望没有给各位看官带来不快，如有，对不起，请 Ctrl+W 关闭当前页。

标签: 编程代码自己 emlog 伪静态性能优化

admin 发布于 2015-8-17 21:21

评论(0) 浏览(7396)

emlog模板预览功能的简单实现 emlog

前台换模板的功能其实非常有用，特别是对于经常做模板的模板作者来说，更是可以让访问都对自己模板的效果有直观的了解。在 Emlog 3.5
版以前，甚至也有过专门的插件，不过自从升级到 4.0 之后，这个插件就失效了。但是，一些爱折腾的技术控和 EMER
，还是陆续弄出一些代码来实现这个功能

今天我要介绍，是从卡片的模板中提取的代码，每个访问者都互不影响，而且，关闭浏览器重新打开该网站，又会恢复后台设置的默认模板。

首先看根目录下的init.php，找到其中的：

define('TEMPLATE_URL', TPLS_URL.Option::get('nonce_templet').'/');

将其替换为如下代码：

<pre style="overflow:auto" ;class="prettyprint lang-php linenums">session_start();
if(isset($_GET['theme'])){
$theme = $_GET['theme']=='reset' ? Option::get('nonce_templet') : $_GET['theme'];
$_SESSION['theme']=$theme;
}elseif(isset($_SESSION['theme'])){
$theme=$_SESSION['theme'];
}else{
$theme='';
}
if($theme==''){
define('TEMPLATE_NAME', Option::get('nonce_templet'));
}else{
define('TEMPLATE_NAME', $theme);
}
define('TEMPLATE_URL', TPLS_URL.TEMPLATE_NAME.'/');
然后将 index.php 和 t/index.php 两个文件中的：

define('TEMPLATE_PATH', TPLS_PATH.Option::get('nonce_templet').'/');

均改为：

define('TEMPLATE_PATH', TPLS_PATH.TEMPLATE_NAME.'/');

要查看某个模板的效果，直接在博客地址后面加上“?theme=模板目录”参数就行了，如“https://mrxn.net/?theme=lusongsong”(我已关闭此功能)

标签: emlog

admin 发布于 2015-8-2 15:32

评论(2) 浏览(7921)

给EMLOG评论框加上√防止垃圾评论 emlog

本方法来源于网络，Mrxn在
5.3.1中测试正常，现在免费分享给各位有需要的emer使用。将下面代码添加到module.php的<input
type="submit" id="comment_submit" value="发表评论" tabindex="6" />后面即可

<label for="sheli"><input type="checkbox" value=9 id="sheli" name="sheli" required="required" autocomplete="on" required title="发表评论确认框：请勾选我再发表评论！"> <font color="red">请勾选我再发表评论！</font></label>

效果演示：

标签: emlog

admin 发布于 2015-8-2 15:24

评论(0) 浏览(7369)

Emlog下二级域名绑定子目录伪静态规则 emlog

这里说的二级域名绑定子目录，是指在主域名对应空间根目录装了EMLOG程序的情况，并且是linux+apache环境。我们想让二级域名指向子目录实
现访问，就需要修改一下伪静态规则。首先，在你的空间管理平台中绑定二级域名（通常说接收）如:zan.mrxn.net，同时域名也要做好解析工作（一般
可以用*号泛解析），剩下的就是配置.htaccess文件了，直接打开根目录下的.htaccess文件可以看到如下代码：

<IfModule mod_rewrite.c> RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteBase /
RewriteRule . /index.php [L] </IfModule>

现在我们以指定daohang.mrxn.net指向/daohang/目录为例修改以上代码：

<IfModule mod_rewrite.c> RewriteEngine on
RewriteCond %{HTTP_HOST} ^mrxn.net$
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteBase /
RewriteRule . /index.php [L]

RewriteCond %{HTTP_HOST} ^daohang.mrxn.net$
RewriteCond %{REQUEST_URI} !^/daohang/
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /daohang/$1
RewriteCond %{HTTP_HOST} ^daohang.mrxn.net$
RewriteRule ^(/)?index.php$ daohang/index.html [L] </IfModule>

标签: emlog

admin 发布于 2015-8-2 15:24

评论(0) 浏览(7691)

« 1 2 3 4 5 6 7 ... 14 »

网警已介入（php网页版）-实现原理（源代码奉献）-装逼利器 PHP

Emlog文章标题自动生成英语别名，利于SEO emlog

emlog开启评论审核之后，评论结束自动跳转回原文 emlog

插件冲突导致emlog的rss输出出错 emlog

博客决定取消使用pjax技术加载页面，简单分析 PHP

css样式设置小技巧汇总 PHP

水平居中设置-行内元素

水平居中设置-定宽块状元素

水平居中总结-不定宽块状元素方法（一）

水平居中总结-不定宽块状元素方法（二）

水平居中总结-不定宽块状元素方法（三）

垂直居中-父元素高度确定的单行文本

垂直居中-父元素高度确定的多行文本（方法一）

垂直居中-父元素高度确定的多行文本（方法二）

隐性改变display类型

emlog静态化插件有可能出现的几个问题/bug及解决方法 emlog

emlog模板预览功能的简单实现 emlog

给EMLOG评论框加上√防止垃圾评论 emlog

Emlog下二级域名绑定子目录伪静态规则 emlog

搜索

日历

最新文章

最新评论

分类

标签

存档

链接