编程 - Mrxn's Blog-关注web安全、热爱黑客技术

关于css的一些基础知识积累 PHP

一：CSS的工作原理

1.基本的CSS语法

比方说，我们要用红色作为网页的背景色：

用HTML的话，我们可以这样：

用CSS的话，我们可以这样获得同样的效果：

body {background-color: #FF0000;}

上例也向你展示了基本的CSS模型：

为HTML文档应用CSS，有三种方法可供选择。下面对这三种方法进行了概括。我们建议你对第三种方法（即外部样式表）予以关注。

方法1：行内样式表（style属性）

为HTML应用CSS的一种方法是使用HTML属性style。我们在上例的基础之上，通过行内样式表将页面背景设为红色：

方法2：内部样式表（style元素）

为HTML应用CSS的另一种方法是采用HTML元素style。比如像这样：

body {background-color: #FF0000;}

</style>

方法3：外部样式表（引用一个样式表文件）

我们推荐采用这种引用外部样式表的方法。外部样式表就是一个扩展名为css的文本文件。跟其他文件一样，你可以把样式表文件放在Web服务器上或者本地硬盘上。

导入语法：

注意要在href属性里给出样式表文件的地址。

这行代码必须被插入HTML代码的头部（header），即放在标签<head>和标签</head>之间。就像这样：

<html>

<head>

</head>

<body>

...

这个链接告诉浏览器：在显示该HTML文件时，应使用给出的CSS文件进行布局。
这种方法的优越之处在于：多个HTML文档可以同时引用一个样式表。换句话说，可以用一个CSS文件来控制多个HTML文档的布局。

这一方法可以令你省去许多工作。例如，假设你要修改某网站的所有网页（比方说有100个网页）的背景颜色，采用外部样式表可以避免你手工一一修改这100个HTML文档的工作。采用外部样式表，这样的修改只需几秒钟即可搞定——修改外部样式表文件里的代码即可。

然后，把这两个文件放在同一目录下。记得在保存文件时使用正确的扩展名（分别为“htm”和“css”）。

二：颜色与背景

前台页面背景和颜色主要包括下面内容：

· color

· background-color

· background-image

· background-repeat

· background-attachment

· background-position

· background

前景色：‘color’属性

CSS属性color用于指定元素的前景色。

例如，假设你要让页面中的所有标题（headline）都显示为深红色，而这些标题采用的都是h1元素，那么可以用下面的代码来实现把h1元素的前景色设为红色。

h1 {

color: #ff0000;

}

CSS属性background-color用于指定元素的背景色。

因为body元素包含了HTML文档的所有内容，所以，如果要改变整个页面的背景色的话，那么为body元素应用background-color属性就行了。

你也可以为其他包含标题或文本的元素单独应用背景色。在下例中，我们为body和h1元素分别应用了不同的背景色。

body {

background-color: #FFCC66;

}

h1 {

color: #990000;

background-color: #FC9804;

}

注意：我们为h1元素应用了两个CSS属性，它们之间以分号（“;”）分隔。

CSS属性background-image用于设置背景图像。

如果要把这个蝴蝶的图片作为网页的背景图像，只要在body元素上应用background-image属性、然后给出蝴蝶图片的存放位置就行了。

body {

background-color: #FFCC66;

}

h1 {

color: #990000;

background-color: #FC9804;

}

注意我们指定图片存放位置的方式：url("butterfly.gif")。这表明图片文件和样式表存放在同一目录下。你也可以引用存放在其他目录的图片，只需给出存放路径即可（比如url("../images/butterfly.gif")）；此外，你甚至可以通过给出图片的地址来引用因特网（Internet）上的图片（比如url("http://www.html.net/butterfly.gif")）。

平铺背景图像[background-repeat]

下表概括了background-repeat的四种不同取值。

值	描述	示例
background-repeat:repeat-x	图像横向平铺	显示示例
background-repeat:repeat-y	图像纵向平铺	显示示例
background-repeat:repeat	图像横向和纵向都平铺	显示示例
background-repeat:no-repeat	图像不平铺	显示示例

例如，为了避免平铺背景图像，代码应该这样：

body {

background-repeat: no-repeat; }

固定背景图像[background-attachment]

CSS属性background-attachment用于指定背景图像是固定在屏幕上的、还是随着它所在的元素而滚动的。

一个固定的背景图像不会随着用户滚动页面而发生滚动（它是固定在屏幕上的），而一个非固定的背景图像会随着页面的滚动而滚动。

下表概括了background-attachment的两种不同取值。你可以点击示例察看二者的区别。

值	描述	示例
background-attachment:scroll	图像会跟随页面滚动——非固定的	显示示例
background-attachment:fixed	图像是固定在屏幕上的	显示示例

例如，下面的代码将背景图像固定在屏幕上。

body {

background-repeat: no-repeat;

background-attachment: fixed;

}

放置背景图像[background-position]

缺省地，背景图像将被放在屏幕的左上角。但是，你可以通过CSS属性background-position来修改这一缺省设置，将背景图像摆放在屏幕上你觉得满意的地方。

设置background-position属性的值有多种方式。不过，它们都是坐标的格式。举例来说，值“100px 200px”表示背景图像将被放置在位于距浏览器窗口左边100像素、顶部200像素处。

坐标可以是以百分比或固定单位（比如像素、厘米等）作为单位的值，也可以是“top”、“bottom”、“center”、“left”和“right”这些值。
下表给出了一些例子。

值	描述	示例
background-position:2cm 2cm	图像被放置在页面内距左边2厘米、顶部2厘米的地方	显示示例
background-position:50% 25%	图像被放置在页面内水平居中、离顶部四分之一处	显示示例
background-position:top right	图像被放置在页面的右上角	显示示例

在下例中，背景图像被放置在页面的右下角：

body {

background-image: url("butterfly.gif");

background-repeat: no-repeat;

background-attachment: fixed;

background-position: right bottom;

}

缩写[background]

CSS属性background是上述所有与背景有关的属性的缩写用法。

使用background属性可以减少属性的数目，因此令样式表更简短易读。

比如说下面五行代码：

background-color: #FFCC66;

background-repeat: no-repeat;

background-attachment: fixed;

background-position: right bottom;

如果使用background属性的话，实现同样的效果只需一行代码即可搞定：

background: #FFCC66 url("butterfly.gif") no-repeat fixed right bottom;

各个值应按下列次序来写：

[background-color] | [background-image] | [background-repeat] | [background-attachment] | [background-position]

如果省略某个属性不写出来，那么将自动为它取缺省值。比如，如果去掉background-attachment和background-position的话：

background: #FFCC66 url("butterfly.gif") no-repeat;

这两个未指定值的属性将被设置为缺省值：scroll和top left。

三：字体

CSS字体属性主要包括下面几个：

font-family，font-style，font-variant，font-weight，font-size

，font

字体族[font-family]

CSS属性font-family的作用是设置一组按优先级排序的字体列表，如果该列表中的第一个字体未在访问者计算机上安装，那么就尝试列表中的下一个字体，依此类推，直到列表中的某个字体是已安装的。

有两种类型的名称可用于分类字体：字体族名称（family-name）和族类名称（generic family）。下面来解释这两个术语。

字体族名称（就是我们通常所说的“字体”）的例子包括“Arial”、“Times New Roman”、“宋体”、“黑体”等等。

一个族类是一组具有统一外观的字体族。sans-serif就是一例，它代表一组没有“脚”的字体。

你在给出字体列表时，自然应把首选字体放在前面、把候选字体放在后面。建议你在列表的最后给出一个族类（generic family），这样，当没有一个指定字体可用时，页面至少可以采用一个相同族类的字体来显示。

下面是一个按优先级排列的字体列表的例子：

h1 {font-family: arial, verdana, sans-serif;}

h2 {font-family: "Times New Roman", serif;}

h1标题将采用Arial字体显示。如果访问者的计算机未安装Arial，那么就使用Verdana字体。假如Verdana字体也没安装的话，那么将采用一个属于sans-serif族类的字体来显示这个h1标题。

注意我们为“Times New Roman”采用的写法：因为其中包含空格，所以我们用引号将它括起来。

字体样式[font-style]

CSS属性font-style定义所选字体的显示样式：normal（正常）、italic（斜体）或oblique（倾斜）。在下例中，所有h2标题都将显示为斜体。

h2 {font-family: "Times New Roman", serif; font-style: italic;}

字体变化[font-variant]

CSS属性font-variant的值可以是：normal（正常）或small-caps（小体大写字母）。small-caps字体是一种以小尺寸显示的大写字母来代替小写字母的字体。不太明白？我们来看几个例子：

如果font-variant属性被设置为small-caps，而没有可用的支持小体大写字母的字体，那么浏览器多半会将文字显示为正常尺寸（而不是小尺寸）的大写字母。

h1 {font-variant: small-caps;}

h2 {font-variant: normal;}

字体浓淡[font-weight]

CSS属性font-weight指定字体显示的浓淡程度。其值可以是normal（正常）或bold（加粗）。有些浏览器甚至支持采用100到900之间的数字（以百为单位）来衡量字体的浓淡。

p {font-family: arial, verdana, sans-serif;}

td {font-family: arial, verdana, sans-serif; font-weight: bold;}

字体大小[font-size]

字体的大小用CSS属性font-size来设置。

字体大小可通过多种不同单位（比如像素或百分比等）来设置。在本教程中，我们将关注于最常用和最合适的单位。比如：

h1 {font-size: 30px;}

h2 {font-size: 12pt;}

h3 {font-size: 120%;}

p {font-size: 1em;}

上面四种单位有着本质的区别。‘px’和‘pt’将字体设置为固定大小，而‘%’和‘em’允许页面浏览者自行调整字体的显示尺寸

缩写[font]

CSS属性font是上述各有关字体的CSS属性的缩写用法。

比如说下面四行应用于p元素的代码：

p {

font-style: italic;

font-weight: bold;

font-size: 30px;

font-family: arial, sans-serif;

}

如果用font属性的话，上述四行代码可简化为：

p {font: italic bold 30px arial, sans-serif; }

font属性的值应按以下次序书写：

font-style | font-variant | font-weight | font-size | font-family

四：文本

文本主要包括下列CSS属性：

text-indent.,text-align,text-decoration,letter-spacing.

text-transform

文本缩进[text-indent]

CSS属性text-indent用于为段落设置首行缩进，以令其具有美观的格式。在下例中，我们为采用p元素的段落应用了30像素的首行缩进。

p {text-indent: 30px;}

文本对齐[text-align]

CSS属性text-align与HTML属性align的功能相同。该属性的值可以是：left（左对齐）、right（右对齐）或者center（居中）。除了上面三种选择以外，你还可以将该属性的值设为justify（两端对齐），即伸缩行中的文字以左右靠齐。报刊杂志经常采用这种布局。

在下例中，标题（th）中的文字被设置为右对齐，而表中数据（td）被设置为居中。正常的文本段落被设置为两端对齐。

th {text-align: right;}

td {text-align: center;}

p {text-align: justify; }

文本装饰[text-decoration]

CSS属性text-decoration令我们可以为文本增添不同的“装饰”或“效果”。例如，你可以为文本增添下划线、删除线、上划线等等。在接下来的例子中，我们为h1标题增添了下划线，为h2标题增添了上划线，为h3标题增添了删除线。

h1 {text-decoration: underline;}

h2 {text-decoration: overline;}

h3 {text-decoration: line-through;}

字符间距[letter-spacing]

CSS属性letter-spacing用于设置文本的水平字间距。我们可以把期望的字间距宽度作为这个属性的值。例如，假如你希望p元素里的文本段落的字间距为3个像素，而h1标题的字间距为6个像素，代码可以这样写：

h1 {letter-spacing: 6px; }

p {letter-spacing: 3px;}

文本转换[text-transform]

CSS属性text-transform用于控制文本的大小写。无论字母本来的大小写，你可以通过该属性令它首字母大写（capitalize）、全部大写（uppercase）或者全部小写（lowercase）。

比如，单词“headline”在展现给网页浏览者时，可以是“HEADLINE”或者“Headline”。

text-transform属性有四个可选值：

capitalize将每个单词的首字母转换为大写。

uppercase所有字母都转换为大写。

lowercase所有字母都转换为小写

none不作任何转换——文本怎么写的就怎么显示。

五：链接

在前面讲到的属性也可以应用到链接上（比如修改颜色、字体、添加下划线等）。但不同的是，CSS允许你根据链接是未访问的、已访问的、活动的、是否有鼠标悬停等分别定义不同的属性。这样，我们便可为网站增添奇特而有用的效果。你需要通过伪类（pseudo-class）来控制这些效果。

伪类是什么？

伪类（pseudo-class）令你可以在为HTML元素定义CSS属性的时候将条件和事件考虑在内。

我们来看一个例子。正如你所知道的，在HTML里，链接是通过a元素来定义的。因此，在CSS里，我们可以将a作为一个选择器

a {color: blue;}

一个链接可以有不同的状态。例如，它可以是已访问过的，也可以是未访问过的。你可以通过伪类分别为访问过的链接和未访问过的链接设置不同的样式。

a:link {color: blue;}

a:visited {color: red;}

为未访问过的链接和已访问过的链接分别使用伪类a:link和a:visited。活动的链接对应的伪类为a:active，有鼠标悬停的链接对应的伪类为a:hover。

伪类： active

伪类:active用于活动的链接（即获得当前焦点的链接）。

a:active {background-color: #FFFF00;}

伪类： hover用于有鼠标悬停的链接。

如果你要当鼠标光标移到链接上时将链接显示为橙色斜体，那么CSS可以这样写：

a:hover {color: orange;

font-style: italic; }

如何去掉链接的下划线是一个常见的问题。

a {text-decoration:none;}

六：元素的分类与标识（class和id）

1.用class对元素进行分类

我们希望白葡萄酒的链接全部显示为黄色，红葡萄酒的链接全部显示为红色，其余的链接显示为缺省的兰色。为了实现这一要求，我们将链接分为两类。对链接的分类是通过为链接设置HTML属性class实现的。参加如下代码：

<p>制造白葡萄酒的葡萄：</p>

<ul>

<li><a href="ri.htm" class="whitewine">雷司令（Riesling）</a></li>

<li><a href="ch.htm" class="whitewine">夏敦埃（Chardonnay）</a></li>

<li><a href="pb.htm" class="whitewine">白比诺（Pinot Blanc）</a></li>

</ul>

<p>制造红葡萄酒的葡萄：</p>

<ul>

<li><a href="cs.htm" class="redwine">卡百内索维农（Cabernet Sauvignon）</a></li>

<li><a href="me.htm" class="redwine">墨尔乐（Merlot）</a></li>

<li><a href="pn.htm" class="redwine">黑比诺（Pinot Noir）</a></li>

</ul>

然后，我们就可以为白葡萄酒和红葡萄酒的链接分别应用不同的风格了。

a {color: blue;}

a.whitewine {color: #FFBB00;}

a.redwine {color: #800000; }

如上例所示，你可以通过在样式表里利用.classname来为属于某一类的元素定义CSS属性。

利用id标识元素

除了可以对元素进行分类以外，你还可以标识单个元素。这是通过HTML属性id实现的。HTML属性id的特别之处在于，在同一HTML文档中不能有两个具有相同id值的元素。文档中的每个id值都必须是唯一的。在其他情况下，你应该使用class属性。下面，我们来看一个使用id属性的例子：

...

...

假如我们要求第1.2节显示为红色，那么CSS可以这样写：

#c1-2 {

color: red;

}

如上例所示，你可以在样式表里通过#id为特定元素定义CSS属性。

标签: 编程代码 php

admin 发布于 2015-5-6 15:48

评论(0) 浏览(8842)

分享24个超赞的CSS+html5代码片段 PHP

分享24个超赞的CSS+html5代码片段,如果你做模板用上其中一些CSS片段,我保证你的模板会美上很多的!

CodePen是一个网站前端设计开发平台，是一个针对网站前端代码设计的开发工具，提供多种效果的网站前端代码设计工具和丰富的案例特效代码。用户可以在各种现成的demo基础上Fork后开发自己的前端设计，也可以把你的Demo设计分享给其他人。

都是一些前端的设计，有些特效非常漂亮炫酷，有些是自适应的扁平化布局设计，有些是纯CSS实现的图标，有些令人惊艳的切换旋转效果。你可以自己去慢慢发现这些Demo的美妙之处。

Pure CSS3 MacBook Air with Thunderbird Display and Keyboard

Demo

CSS3 Working Clock

这是个CSS3实现的时钟效果，使用的是CSS3动画特效，没有任何图片和JS.



Demo

CSS3 Pricing Table



Demo

CSS Loader





Demo

Twitter Button Concept



Demo

CSS3 Loading Animation



Demo

Pure CSS3 Vertical Menu with Hover Effect



Demo

CSS3 Stamp effect using radial gradients



Demo

I Love Blur



Demo

Social Navigation



Demo

Login



Demo

Calendar



Demo

Social Footer



Demo

Parallax Landscape



Demo

CSS3 Thermometer



Demo

CSS-Only Responsive Layout with Smooth Transitions



Demo

Flat CSS3 Weather Widget



Demo

Flat Responsive Sliding Boxes



Demo

Tiny CSS3 Round Breadcrumb



Demo

CSS3 Hover Effect using :after Psuedo Element



Demo

Flat UI Elements



Demo

CSS Flat Button Shapes



Demo

Email UI

Demo

Flat Icons CSS



Demo

标签: 编程代码 php

admin 发布于 2015-5-2 19:19

评论(0) 浏览(9721)

总结一下EMLOG获取固定数量的网站标签几种方法 PHP

标签功能是WEB发展的产物，EMLOG当然也具备文章添加标签的功能。而且在EMLOG的侧边栏组件中，用户也可以手动增加该模块。

不过，有一个小小的问题是，侧边栏组件中的标签默认是显示网站所有标签的，如果你的标签过多，势必会影响到网站的美观度。我的博客就是这样,标签太多了,模板默认是全部显示的,严重影响美观!所以Mrxn就网上搜索和自己实践,修改,验证,总结出在emlog中如何来获取固定数量的网站标签.

No.1

<?php
// 获取EMLOG固定数量网站标签
// Mrxn's Blog 收集整理发布 mrxn.net
function getTags($num){
    global $CACHE;
    $tag_cache = $CACHE->readCache('tags');
    foreach($tag_cache as $key => $value):
        if($key < $num):
        ?>
<span><a href="<?php echo Url::tag($value['tagurl']); ?>" title="<?php echo $value['usenum']; ?> 篇文章">
<?php echo $value['tagname']; ?></a></span>
        <?php 
        endif;
    endforeach;
}
?>

如上代码既实现了获取EMLOG网站固定数量标签的功能呢，参数$num即为用户设置的标签个数。使用方法是先将该段代码写在模板文件module.php当中，然后再模板前台文件中写入一行调用该函数的代码即可，如下：

<?php
//把这一段代码写到模板文件中即可实现调用10个网站标签
     getTags(10);
?>

另外，如果希望调用的标签随机显示，则需要使用shuffle()函数进行一次顺序的打乱。函数代码如下，相对于之前来说仅仅只添加了一行代码：

<?php
// 获取EMLOG固定数量网站标签（随机排序）
// Mrxn's Blog 收集整理发布  mrxn.net
function getTags($num){
    global $CACHE;
    $tag_cache = $CACHE->readCache('tags');
    shuffle($tag_cache); //添加这行代码实现标签随机排序
    foreach($tag_cache as $key => $value):
        if($key < $num):
        ?>
<span><a href="<?php echo Url::tag($value['tagurl']); ?>" title="<?php echo $value['usenum']; ?> 篇文章">
<?php echo $value['tagname']; ?></a></span>
        <?php 
        endif;
    endforeach;
}
?>

No.2

注:这个需要改动内核文件,请emer注意,新手慎用.Mrxn问题提示:使用之前做好备份!

emlog使用缓存的方法，事先将全部标签存放在\content\cache\tags缓存文件中，读取的时候使用模板中的$tag_cache = $CACHE->readCache('newtags')读取。

1.找到\include\lib\cache.php并打开

2.找到private function mc_tags()函数

你会发现他的sql语句是将你设置的所有标签全部查询出来，如果你的标签设置很多时候，打开一次就查询一次，显然不好。所以为将他改为每次随机查询30个标签出来，让他放到缓存文件中。

3.将$query = $this->db->query("SELECT gid FROM " . DB_PREFIX . "tag");改为$query = $this->db->query("SELECT gid FROM " . DB_PREFIX . "tag ORDER BY RAND() LIMIT 30");

4.将$query = $this->db->query("SELECT tagname,gid FROM " . DB_PREFIX . "tag");改为$query = $this->db->query("SELECT tagname,gid FROM " . DB_PREFIX . "tag ORDER BY RAND() LIMIT 30");

这样每次显示出来的标签都是随机抽出来的30个，当然这个数字你可以自己改，你想显示多少就改成多少，而且你可以通过更改查询条件来指定你要显示的标签，比如你如果想显示的30个标签不是随机的，而是你最新的30个，只需要将后面查询条件改为：

DESC LIMIT 0,30这样就行了。

No.3

可以调整标签字体的大小,颜色

//widget：标签
function widget_tag($title){
        global $CACHE;
        $tag_cache = $CACHE->readCache('tags');?>
        <li>
        <h3><span><?php echo $title; ?></span></h3>
        <ul id="blogtags">
        <?php
        foreach($tag_cache as $value):
        $minFontSize=12; //最小字体大小,可根据需要自行更改
    $maxFontSize=20; //最大字体大小,可根据需要自行更改
    $style='font-size:'.($minFontSize+lcg_value()*(abs($maxFontSize-$minFontSize))).'px;color:#'.dechex(rand(0,255)).dechex(rand(0,196)).dechex(rand(0,255));
        $text="        <a href='".Url::tag($value['tagurl'])."' title='".$value['usenum']."篇日志'><span style='".$style."'>".$value['tagname']."</span></a>";
        echo $text;
         endforeach;
         ?>
        </ul>
        </li>
<?php }?>

标签: 编程代码 php emlog 标签

admin 发布于 2015-4-29 19:34

评论(2) 浏览(12812)

让emlog侧边栏显示彩色标签,随机显示标签,数量多少有你控制 PHP

让emlog侧边栏显示彩色标签,随机显示标签,数量多少有你控制,本教程由 Mrxn 倾情发布,

嘿嘿,废话不多说,下面进入正题:

0X1:

打开模板的module.php,找到:widget：标签字样,然后在

$tag_cache = $CACHE->readCache('tags');

下面添加如下两行代码:

$tag_cache = array_slice($tag_cache,0,42); //设置标签显示数量(0,num) 
shuffle($tag_cache);?>  <!--将数组打乱,即让它随机显示 <-->

0X2 继续往下找到如下代码:

<?php foreach($tag_cache as $value):?>

将其修改成如下代码:

<?php foreach($tag_cache as $value): $color = dechex(rand(0,16777215));?>
//设置颜色值范围,温馨提示:标签多颜色值范围大点好,反之,亦然

0X3: 最后一步,颜色效果引用:

<a href="<?php echo Url::tag($value['tagurl']); ?>" style="color:#<?php echo $color;//在标签链接href里面应用颜色样式 ;?>;"><?php echo $value['tagname']; ?>(<?php echo$value['usenum'];?>)</a>

最终效果就如我博客右侧的标签效果一样,刷新一次标签顺序变换一次,颜色也变换一次:

如有不懂得,欢迎留言交流,这是我的代码:module.zip

标签: 编程代码 php emlog

admin 发布于 2015-4-29 15:49

评论(1) 浏览(13672)

(Mrxn分享)Sublime Text 3 Build 3065 安装版注册+汉化神器荟萃

Mrxn今天给大家分享一款性感的代码编辑器,程序员,屌丝必备.O(∩_∩)O哈哈~

代码编辑器或者文本编辑器，对于程序员来说，就像剑与战士一样，谁都想拥有一把可以随心驾驭且锋利无比的宝剑，而每一位程序员，同样会去追求最适合自己的强大、灵活的编辑器，相信你和我一样，都不会例外。

我用过的编辑器不少，真不少～但却没有哪款让我特别心仪的，直到我遇到了 Sublime Text 3 ！如果说“神器”是我能给予一款软件最高的评价，那么我很乐意为它封上这么一个称号。它小巧绿色且速度非常快，跨平台支持Win/Mac/Linux，支持32与64位，支持各种流行编程语言的语法高亮、代码补全等，但它有着很多其他编辑器没有的超酷的特性，让它的好用达到了前所未有的程度……

曾经有人说过，世界上有两种编辑器，好用和不好用的；而在好用的编辑器中，又分两种，免费的和死贵死贵的。譬如说 VIM 和 TextMate，就是免费和死贵的典型。很不幸，今天的主角 Sublime Text 3 也是个死贵死贵的代表，它是一款收费的商业软件，个人授权费高达 Total: USD $70(70美元=438.3190元)。

不过大家不用慌，虽然它很贵，但作者很厚道地给用户们提供了免费无限制无限期的试用权，它只会偶尔提醒一下你木有购买，而且频率也很低，仅此而已，一直免费使用下去几乎是没有任何影响的。另外值得一提的是，用户购买一个授权即可同时在不同平台上使用，对于像我这种经常需要在 Mac 和 Win 之间切换使用的用户来说的确能省下一笔钱了。

SublimeText3 支持但不限于 C, C++, C#, CSS, D, Erlang, HTML, Groovy, Haskell, HTML, Java, JavaScript, LaTeX, Lisp, Lua, Markdown, Matlab, OCaml, Perl, PHP, Python, R, Ruby, SQL, TCL, Textile and XML 等主流编程语言的语法高亮。ST2 拥有优秀的代码自动完成功能 (自动补齐括号，大括号等配对符号；自动补全已经出现的单词；自动补全函数名)，非常智能；另外 ST3 也拥有代码片段（Snippet）的功能，可以将常用的代码片段保存起来，在需要时随时调用。当然，语法高亮、代码折叠、行号显示、自定义皮肤、配色方案等这些已经是一款现代编辑器应有的标配功能了，所以这里就不多做介绍了。

下面说一下注册和汉化的方法:

从官方下载: http://www.sublimetext.com/3

或者是从我分享的网盘(64位的ST3安装包+注册码+汉化包)下载: http://pan.baidu.com/s/1sjK7I6T

下载后直接安装好就行,首先是注册,如图操作就行:

把注册码复制一个粘贴到里面就行

汉化很简单的:

我们在界面点击Preferences-->Browse Packages打开文件浏览包

打开以后返回当前文件的上一层目录

点击Installed Packages进入安装包文件夹里

把刚我们下载好的汉化包文件解压打开里面有一个Default.sublime-package文件，把该文件复制到我们上步打开的Installed

Packages文件夹里面，到此汉化完成了。

如果还有不懂得就请打开:http://jingyan.baidu.com/article/ce09321b22fc7d2bff858f87.html 自行查看.

看一下吧,中文界面的了:

注:Mrxn只是分享,并非原创,原文在朽木的博客.

标签: 编程代码

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

评论(2) 浏览(33366)

PHP性能优化代码人生

一、规范说明

性能是网站运行是否良好的关键因素，网站的性能与效率影响着公司的运营成本及长远发展，编写出高质高效的代码是我们每个开发人员必备的素质,也是我们良好的职业素养。

二、影响性能的因素

A、商业需求

1. 需求合理性

2. 需求与系统的整合

3. 需求所带来的商业利益是否与需求开发的成本成正比

4. 需求所带来的风险

B、 Web 服务器

1. 并发处理能力

2. 高负载的能力

3. 负载均衡的能力

4. 动态内容与静态内容的处理能力

5. Web 服务器部署

C、 DataBase 服务器

1. 并发访问

2. 数据库服务器的部署

3. 数据库的 shema 架构与的表设计是否合理

4. 数据检索

D、操作系统

E、客户端请求

F、程序/语言

三、分析性能的指标

1. 程序的运行时间 2

2. 程序的运行所消耗的内存

3. 单位时间内的并行处理

4. 磁盘 IO 的处理

四、优化性能的目标

快速、并发、资源消耗低（内存、磁盘 IO、CPU 负载）

五、优化性能的原则

1. 服务器配配置最优化

2. 服务器部署合理化

3. 商业需求合理并与产出的商业价值成正比

4. 架构可用、可维护、可扩展

5. 程序的正确性、简单性、逻辑的合理性。

6. 不断的分析性能的的瓶颈

7. 不断的重构已有的代码

8. 优化的优先级：program->database->web sersver->os->client

六、优化

A、程序优化

· 变量

1、变量大小,注意变量大小是节约内存的最有效手段，对于来自用户表单、数据库和文件缓存的数据都需要控制变量的大小。因为cpu要处理的数据是来源于内存

2、变量有效期，使用unset()函数注销不需要的变量是一种良好的习惯，将一些不需要的变量立即注销可提高内存的使用率。

3、复制变量，尽量不要复制变量，否则就会带来1倍的内存消耗，即使复制变量也应该要立即注销原有变量。

4、变量类型,初始化变量请注意其变量类型，一个变量在执行过程中最好只有一种类型状态。对于数组变量，请初始化声明，如下： $a = array();

5、临时变量,是处理业务逻辑的临时存储，这些都是需要消耗内存的。如果临时变量使用结束请立即注销，特别是在一些过程式代码的执行流程中，对于一些函数，如果业务非常复杂，同样需要立即注销临时变量

6、静态变量,对于一些需要由复杂业务产生的变量，如果在程序的执行过程中多次产生并使用，可考虑使用静态变量，减少程序的cpu执行次数

7、变量的性能：局部变量>全局变量>类属性>未定义的变量。

· 循环

1、尽量减少循环的次数。

2、尽量减少循环的潜逃的层次，不要超过三层。

3、避免在循环内有过多的业务逻辑。

4、不要循环包含文件

5、不要循环执行数据库操作。

6、优先使用foreach,它比for/while效率高

7、不要把 count/strlen/sizeof 放到 for 循环的条件语句中 For($i=0,$count=count($array);$i<$count;$i++){} 不要使用for($i=0;$i<count($array);$i++){};

8、 for($i=$total;$i>0;$i–){}性能好于for($i=0;$i<$total;$–){}

9、保持循环体内的业务逻辑清晰

· 函数

1、函数职责清晰，一个函数只干一件事，不要杂揉过多的业务逻辑

2、函数代码体不要超过20行，反之，考虑拆分。

3、优先使用php内置函数

4、常量与函数同时能干一件事，优先使用常量。

· phpversion() < PHP_VERSION

· get_class() < CLASS

· is_null() < NULL ===

5、 echo 的性能好于print,输入多个变量的时候用echo $str,$str1,不用.连接符

6、 $_SERVER[REQUEST_TIME]替换time();

7、字符串替换strtr()->str_replace()->preg_replace()->epreg();

8、发挥trim最大功效，替换substr。$filepath=trim($filename,’/’).’/’;

9、Isset/empty 虽然两个函数功能有所差异，但在同样的情况下推荐使用 empty()

10、isfile/file_exist 两个函数的功能有所不同，file_exist既可判断文件是否存在，也可以判断目录是否存在，在同样的情况下推荐使用is_file

· 文件

1、减少文件包含数，减少磁盘 IO

2、使用完整路径，或者容易转换的相对路径。避免在 include_path 查找

3、文件的代码行数不要超过 2000 行

4、Require_once/include_once 效率低于 require/include, 需要额外的去查看系统是否已经调用过这个文件. 因为它们在一个 opcode 缓存下的调用非常慢

5、程序执行文件用 requie/require_once,缓存文件用include/include_once。Include 效率好于 require

6、优化 spl 中的文件自动加载机制，可参靠 yii

7、类库文件加载，是否考虑类是否已经实例化，可考虑采用设计模式之单例模式

8、文件读写的并发性

面向对象

1、控制实例的创建的数量

2、优先使用常量、类常量

3、优先例用静态变量，静态属性

4、类的结构合理

5、面象接口编程

6、封装变化点

7、依赖于抽象，不依赖于细节

8、优先使用静态成员

9、类的接口清晰稳定，类的职责单一，类与类的通信合理

10、使用常量的好处编译时解析，没有额外开销杂凑表更小，所以内部查找更快类常量仅存在于特定「命名空间」，所以杂凑名更短代码更干净，使除错更方便

字符串

1、用单引号替代双引号引用字符串；避免检索字符串中的变量

运算

1、用 i+=1 代替i=i+1。符合c/c++的习惯，效率还高

2、 ++$i 的效率高于++$i,–$i 同理

数组

1、多维数组尽量不要循环嵌套赋值；

2、使用$array[‘name’]方式访问数组，禁止$array[name]/$array[“name”]

判断

1、逻辑判断请优先使用switch 的方式，对于业务逻辑相对较多的情况请选择if/else，提高代码的可读性

2、尽量控制if/else判断的个数，如果太多请考虑功能优化或代码优化

3、尽量使用恒等用于比较判断，恒等的效率高于等于，而且还能避免一些类型强制转换的错误

4、 if/else与_&&,单条语句判断请选择&&的形式， &&的效率高于if/else，如下 :

if ($a == 1) {

$b = 2;

}可选择为($a == 1) && $b = 2;

缓存

1、使用php加速器，缓冲opcode

2、例用memcache/nosql

3、使用内存数据库、

4、使用文件缓存

5、缓冲功能 5

其它

1、少用@符号，严重影响性能

2、适时关闭远程资源连接如数据库，ftp、socket等，适时的清理这些资源

B、数据库优化

1、合理的商业需情

2、数据库 schema 架构优化

3、垂直与水平分库分表

4、索引优化，查询优化

5、第三方开源检索工具(sphinx)

6、主从数据库服务器的使用。

C、 Web 服器优化（暂未整理,有相应的 Web 服务器优化手册）

D、操作系统优化(暂未整理,有相应的 OS 优化手册)

E、前端优化

1、合理的 html 结构

2、合理 html 与css 的同时，考虑 Css 设计合理，减少 http 请求

3、合理 html 与java script 的同时，考虑拆分是否合理，减少 http 请求

4、优化 java script 代码，让用户有良好的体验

5、根据 http 协议，优化高并发请求

七、性能检测工具

Web Server

ab

http_load

PHP

apd

xdebug

Mysql

explain

profiler

标签: 编程代码分享 php

admin 发布于 2014-12-19 22:23

评论(0) 浏览(7472)

网页版的俄罗斯方块纯JS+CSS 制作代码人生

纯JS+CSS制作的俄罗斯方块欢迎体验：俄罗斯方块

标签: 编程代码分享 JS

admin 发布于 2014-12-12 10:11

评论(0) 浏览(9279)

HID攻击之TEENSY实战渗透测试

概述

从传统意义讲，当你在电脑中插入一张CD/DVD光盘，或者插入一个USB设备时，可以通过自动播放来运行一个包含恶意的文件，不过自动播放功能被关闭时，autorun.inf文件就无法自动执行你的文件了。然而通过TEENSY，你可以模拟出一个键盘和鼠标，当你插入这个定制的USB设备时，电脑会识别为一个键盘，利用设备中的微处理器，与存储空间，和编程进去的攻击代码，就可以向主机发送控制命令，从而完全控制主机，无论自动播放是否开启，都可以成功。

HID攻击介绍

HID是Human Interface Device的缩写，由其名称可以了解HID设备是直接与人交互的设备，例如键盘、鼠标与游戏杆等。不过HID设备并不一定要有人机接口，只要符合HID类别规范的设备都是HID设备。一般来讲针对HID的攻击主要集中在键盘鼠标上，因为只要控制了用户键盘，基本上就等于控制了用户的电脑。攻击者会把攻击隐藏在一个正常的鼠标键盘中，当用户将含有攻击向量的鼠标或键盘，插入电脑时，恶意代码会被加载并执行。

TEENSY介绍

攻击者在定制攻击设备时，会向USB设备中置入一个攻击芯片，此攻击芯片是一个非常小巧且功能完整的单片机开发系统，它的名字叫Teensy，它能够实现多种类型的项目开发和设计。Teensy为开源项目，任何有能力有技术的厂商都可以生产定制，其中PJRC是最优秀或者说商业化最好的生产商。

Teensy主要特点如下

AVR处理器，16 MHz

单个按键编程

易于使用的Teensy Loader应用程序

免费软件开发工具

兼容Mac OS X，Linux和Windows

小尺寸,多项目的完美支持

开发环境的搭建

对Teensy芯片进行开发，可以在Arduino中进行，不用担心枯燥的汇编与机器代码，因为Arduino IDE具有使用类似Java，C语言的Processing/Wiring开发环境。环境安装与搭建也非常便捷，可以从http://www.arduino.cc下载安装包，进行安装。本文版权为天融信阿尔法实验室冷风，转载请注明出处。

安装完Arduino IDE之后，还需要Teensy芯片的SDK支持库，支持库可以从如下地址获取http://www.pjrc.com/teensy/td_download.html。安装时需要选择Arduino IDE的安装路径，安装完成以后，还需要选择相应的开发板，我们这里应该选择Teensy2.0如图4所示，至此整体开发环境就搭建完成了。

图4

从BackTrack提取攻击代码

在BackTrack中提供了Teensy的完整攻击实例，针对一般情况的测试与使用，是足够的，下面介绍一下攻击代码的提取方法。进入BackTrack5后进入到/pentest/exploits/set目录，如图5所示。

图5

进入目录后执行./set会弹出一个新的菜单，请选择第一项Social-Engineering Attacks如图6所示。

图6

在新的选择项中，选择Arduino-Based-Attack Vector选项（Arduino基础攻击向量）如图7所示。

图7

选择Arduino基础攻击向量后，在新的选择中选择Wscript Http Get Msf Payload如图8所示。

图8

在新的选项中输入一个恶意程序的下载地址，此代码功能为自动去指定的位置下载程序并自动执行。如图9所示。

图9

最后所有的步骤执行完成后，会在reports目录中成一个名为teensy.pde的文件，如图10所示，此文件可以直接导入到Arduino中进行编译。本文版权为天融信阿尔法实验室冷风，转载请注明出处。

图10

攻击代码实现

如上代码从setup开始执行，执行后自动键入tftp下载命令，并执行，最后运行下载的exe文件，omg函数是在开始运行中键入代码执行。关于每个API函数的详细介绍可以参考teensy提供的API手册，这里不再赘述。

攻击效果

代码编译后通过Arduino上传到Teensy芯片，把Teensy插入到电脑USB接口后，会自动打开，运行对话框，键入相应的命令并运行，其效果如图11所示。、

图11

结束语

HID攻击对于大众来说还属于冷门，大众甚至不知道它的存在，防范更是无从谈起，但它的危害却是非常大的，USB设备的普及更是放大了它的邪恶，本文针对HID攻击的方法、原理、实现做了较为详细的描述，希望本文的介绍能让读者对HID攻击有一个更为清晰明了的认识。

注：转载自天融信阿尔法实验室：http://blog.topsec.com.cn/ad_lab/hid攻击之teensy实战/

标签: 编程 USB攻击社工

admin 发布于 2014-12-11 11:35

评论(0) 浏览(12882)

【Mrxn原创工具】一件结束所有进程（非系统）神器荟萃

有的时候电脑开的程序太多电脑卡（博主有过 -_- !）所有就自己写了这么一个小软件，他可以帮你快速结束所有打开的进程（非系统进程和杀软），无毒无害。有任何问题可以留言反馈哈。

软件下载：

一件结束所有进程（非系统）.zip

标签: 编程 cmd Windows优化

admin 发布于 2014-12-9 19:15

评论(0) 浏览(10719)

Gravatar被墙后解决头像不能正常显示的五种方法（持续更新中。。。）技术文章

Gravatar被墙后，很多博客的头像显示都不正常了，网上也有很多的方法，但是不全面，今天Mrxn帮你搜集汇总，发布在Mrxn's Blog 。

方法一：

打开include/lib/function.base.php 找到如下代码：
function getGravatar($email, $s = 40, $d = 'mm', $g = 'g') {
$hash = md5($email);
$avatar = "http://www.gravatar.com/avatar/$hash?s=$s&d=$d&r=$g";
return $avatar;
}

修改为
$avatar = "https://secure.gravatar.com/avatar/$hash?s=$s&d=$d&r=$g";

方法二：

同样打开include/lib/function.base.php

将$avatar = "http://www.gravatar.com/avatar/$hash?s=$s&d=$d&r=$g";

修改为：$avatar = "http://gravatar.duoshuo.com/avatar/$hash?s=$s&d=$d&r=$g";

方法三：

也是打开include/lib/function.base.php

将/**
* 获取Gravatar头像
* http://en.gravatar.com/site/implement/images/
* @param $email
* @param $s size
* @param $d default avatar
* @param $g
*/
里面的http://en.gravatar.com/site/implement/images/

修改为：http://cn.gravatar.com/site/implement/images/

方法四：缓存头像，本地缓存。

<?php
function get_avatar($mail,$size = '40')
{
        $email_md5=md5(strtolower($mail));//通过MD5加密邮箱
        $cache_path=EMLOG_ROOT."/content/templates/uu_hcms/cache"; //缓存文件夹路径
        if(!file_exists($cache_path))
        {
                mkdir($cache_path,0700);
        }
        $avatar_url=TEMPLATE_URL."cache/".$email_md5.'.jpg'; //头像相对路径
        $avatar_abs_url=$cache_path."/".$email_md5.'.jpg'; //头像绝对路径
        $cache_time=24*3600*7; //缓存时间为7天
         if (empty($default)) $default = $cache_path. '/default.jpg';
        if(!file_exists($avatar_abs_url) || (time()-filemtime($avatar_abs_url)) > $cache_time)//过期或图片不存在
        {
                $new_avatar = getGravatar($mail);
                copy($new_avatar,$avatar_abs_url);
        }
        return $avatar_url;
        }
?>

插入module.php中，修改自12年某emer的代码。缓存7天可以自己修改，缓存呢可以加快页面是显示速度，但也不能那么及时更新头像了。看自己需要吧。对路由服务器来说，加载留言板的速度无疑快了不少。

使用方法：在module.php的最新评论显示评论显示子评论里面将getGravatar替换成get_avatar 。OK 完工。

方法五：自定义默认头像，个性DIY

详情，请查看我早期的文章：让emlog的留言板和评论使用本地头像，加速访问，提升美观

更多方法正在搜集研究中，尽请期待！请关注我的博客：https://mrxn.net

如果你有好的方法或者是文章，欢迎投稿或者是注册：注册匿名投稿

标签: 编程分享 emlog

admin 发布于 2014-11-30 06:52

评论(2) 浏览(12049)

« 1 ... 6 7 8 9 »

关于css的一些基础知识积累 PHP

分享24个超赞的CSS+html5代码片段 PHP

总结一下EMLOG获取固定数量的网站标签几种方法 PHP

让emlog侧边栏显示彩色标签,随机显示标签,数量多少有你控制 PHP

(Mrxn分享)Sublime Text 3 Build 3065 安装版注册+汉化神器荟萃

PHP性能优化代码人生

网页版的俄罗斯方块纯JS+CSS 制作代码人生

HID攻击之TEENSY实战渗透测试

【Mrxn原创工具】一件结束所有进程（非系统）神器荟萃

Gravatar被墙后解决头像不能正常显示的五种方法（持续更新中。。。）技术文章

搜索

日历

最新文章

最新评论

分类

标签

存档

链接