person

为什么会想到这个呢?

因为今天恰巧在优化之前以前写的模板底部,突然发现对于版权来讲,通过都是©建站时间- 今年时间 ,输出今年时间特别容易,直接→


date("Y");

就好了,可是要输出建站时间,是比较头疼的事情,但是染念我站在用户的角度想:直接让用户改文件是不是很麻烦?也要考虑一些小白用户,减少他们的折腾吧。于是就开始自己折腾了,希望这时间可以减少别人的时间!

思路起源

对于discuz来说,这比较蛋疼,因为这个坑首先是我先想到的,(别人没分享我就想自己是第一,哼哼~),而且discuz本身也没有自带的系统变量来支持,唯一想到的就是看看数据库有没有残留一些关于建站时间的。突然看见群里有人回应了我,我感觉这想法太棒了。

 

 

 

 

 

 

假如没有他这么讲,怕是要在系统配置等等数据表找死,或许可以找到,但是这想法太赞了。当网站安装成功了,系统会自动产生uid1的管理员,用此管理员的创建时间就可以完美取代!

开始搞

直接上数据表图

很棒,有这个字段
接下来,
只需要获取他了


$chw0 = DB::result(DB::query("SELECT regdate FROM ".DB::table('common_member')." WHERE uid = '1'"));

注意的是:获取的是时间戳哦,但是转换日期很容易,继续


$chw = date("Y",$chw0);

最后输出2017,这就完事了!

xss原理和防护

为什么要发表这篇文章呢?原因看下图

很无奈,表示xss之前也是听过,只是没有真的去研究过,所以这次为了审核只能研究一番了。

XSS-即Cross Site Scripting. 为了与"CSS"不混淆,故简称XSS.

但是别人已经写过的文章,我并不想完全复制下来

如果未来他网站比我先倒闭,我就写吧,现在只需点击进入

 

看了上面这么多,总结起来就是那几个特殊标签以及字符的关系,所以只需要屏蔽这些字符即可。


function gjj($str)

{

$farr = array(                       //定义过滤规则的数组

"/\\s+/",

"/<(\\/?)(script|i?frame|style|html|body|title|link|meta|object|\\?|\\%)([^>]*?)>/isU",

"/(<[^>]*)on[a-zA-Z]+\s*=([^>]*>)/isU",

);

$str = preg_replace($farr,"",$str);           //用正则方式对字符串进行过滤

return addslashes($str);     //返回字符串时对引号进行转义

}

function hg_input_bb($array)

{

if (is_array($array))

{

foreach($array AS $k => $v)          //遍历提交上来的全局变量数组

{

$array[$k] = hg_input_bb($v);

}

}

else

{

$array = gjj($array);

}

return $array;

}

$_REQUEST = hg_input_bb($_REQUEST);    //过略request方式的请求

$_GET = hg_input_bb($_GET);                    //过滤get方式的请求

$_POST = hg_input_bb($_POST);             //过滤post方式的请求

 
可以过滤某些特殊字符和常见的html标签,防范基础的xss共攻击和sql注入。
(上面方法名可以自己换哦~)

只要这样,xss byebye

css使用方法

1.用opacity:0和visibility: hidden;

2.配合hover

3.原先opacity(透明度为0)hover设置为1,即从隐藏到显示,visibility同

注意的是,这边用display:none到block等不行,因为display是连渲染都不渲染,浏览器直接忽略显示直接连理都不理,但是opacity/visibility是会预留空间的,这一块还是占位置的,伪元素还是有效的

js使用方法

用JavaScript隐藏控件的方法有两种,分别是通过设置控件的style的“display”和“visibility”属性。

当style.display="block"或style.visibility="visible"时控件或见,当style.display="none"或style.visibility="hidden"时控件不可见。不同的是“display”不但隐藏控件,而且被隐藏的控件不再占用显示时占用的位置,而“visibility”隐藏的控件仅仅是将控件设置成不可见了,控件仍然占俱原来的位置。(理由同上面,浏览器不渲染display)

 


function displayHideUI()
{
var ui =document.getElementById("bbs");
ui.style.display="none";
}
function displayShowUI()
{
var ui =document.getElementById("bbs");
ui.style.display="";//display为空的话会好使,为block会使后边的空间换行
}
function visibilityHideUI()
{
var ui =document.getElementById("bbs");
ui.style.visibility="hidden";
}
function visibilityShowUI()
{
var ui =document.getElementById("bbs");
ui.style.visibility="visible";
}

然后配合鼠标事件

jq使用方法

通过 jQuery,您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素:


$("#hide").click(function(){
  $("p").hide();
});

$("#show").click(function(){
  $("p").show();
});

具体看:学习从无止境

 

the end

如果你还有什么方法,可以在底下告诉染念哦!

什么叫做css sprites呢?

CSS Sprites在国内很多人叫css精灵,是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来,当访问该页面时,载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。对于当前网络流行的速度而言,不高于200KB的单张图片的所需载入时间基本是差不多的,所以无需顾忌这个问题。

CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中,再利用CSS的“background-image”,“background- repeat”,“background-position”的组合进行背景定位,background-position可以用数字精确的定位出背景图片的位置。
在网页访问中,客户端每需要访问一张图片都会向服务器发送请求,所以,访问的图片数量越多,请求次数也就越多,造成延迟的可能性也就越大。
所以,CSS Sprites技术加速的关键,并不是降低质量,而是减少个数,当然随之而来的增加内存消耗,CSS Sprites图片繁琐的合成等缺点在网站性能的提升前,也就不足为道了。

华丽丽的分割线

首先,如果想知道如何获取图片坐标的话,这里就不bb了,也不想原创写如何获取了,太麻烦了,而且有现成的,讲得很好,我也不想复制下来。哔哔哔哔哔

接下来是原创内容。。

 

看了获取之后的教程,你可能有疑惑?

有时候失效呢?

引用整个图片时候,no——repeat没有写哦


background: url(00.png) no-repeat;

为什么css定位x,y轴是负值

可以这么理解:假如我们手头有图片,里面小图标(这边简单点,只是个x轴移动)

这样,我们想获取第一个图标的话,很简单就是background-position:0 0;

但是如果想获取第二个图标的话,如果是background-position:20px 0,那么图标就会不见,如果是-20px的话图片才出现

那是因为我们使用这个css是让图片本身发生移动,而不是坐标轴(之前一直以为坐标轴动,不好理解)我们如果写20px,那么图片就会向右远离原点20px,而坐标原点就是该整个图片的左上角,没有变化

如果是-20px ,就相当于把图片向左移动了20px,说点简单的,那么就是,第二个图标将会取代第一个图标的位置

最后需要再规定大小,图标就独立出来了~

 

yeah,好好学习,天天向上

 

以前一直不知道如何自适应,于是用了百分数,但是最终结果还是不如意。

前几天在美化小黑屋的时候,在b站看到css


@media screen and (min-width: 1367px

于是今天就开始实践于自己的模板,真的比百分数用得还爽呢!完美解决模板自适应问题~

这里分享几个临界的分辨率,当然是抄百度的啦。min-width分别是768、992、1200

@media (min-width: 768px){ //>=768的设备 }

@media (min-width: 992px){ //>=992的设备 }

@media (min-width: 1200){ //>=1200的设备 }

注意下顺序,如果你把@media (min-width: 768px)写在了下面那么很悲剧,

@media (min-width: 1200){ //>=1200的设备 }

@media (min-width: 992px){ //>=992的设备 }

@media (min-width: 768px){ //>=768的设备 }

因为如果是1440,由于1440>768那么你的1200就会失效。

所以我们用min-width时,小的放上面大的在下面,同理如果是用max-width那么就是大的在上面,小的在下面

@media (max-width: 1199){ //<=1199的设备 }

@media (max-width: 991px){ //<=991的设备 }

@media (max-width: 767px){ //<=768的设备 }

注:上面的代码中用到了 screen这里指定了显示器为显示设备,也可以是print打印机等其他设备,一般我们用screen。或者干脆省略。如果想看详细的关于media的说明可以百度一下关于media query的知识

用法:


@media screen and (max-width: 600px) {
    选择器 {
      属性:属性值;
    }
  }