三十而立 » 代码 http://as30.com Thu, 02 Feb 2012 08:31:23 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 css的一个简单遮罩层，仅仅一个div就可以实现 http://as30.com/css-div-zhezhaoceng-477 http://as30.com/css-div-zhezhaoceng-477#comments Wed, 21 Sep 2011 14:45:14 +0000 普洱 http://as30.com/css-div-zhezhaoceng-477 继续阅读

]]> 考试结束归来，看到有留言说想要我网页上的遮罩层效果，那就放出来把。

其实就是一个很简单的遮罩，没有利用任何的其他技术。下面是代码：

样式表：

<style type="text/css">
<!–
*{padding:0;margin:0} 
.pop{z-index:1;background-color:black;opacity:.60;filter: alpha(opacity=60);font-size:60px;font-weight:bold;color:red;position:absolute;left:0%;top:60%;width:100%;height:45px;display:block}
–></style>

显示在网页上的一个层：

<div id="pop1" class="pop" style="text-align:center">暂停更新 又到一年考试时…</div>

最终的结果:

具体的参数自己可以修改，有点html底子的都可以做到。呵呵~

最后还有一点需要注明的是，在IE6及以下是不看不到滴…

]]> http://as30.com/css-div-zhezhaoceng-477/feed 2 网站变成灰白色调的方法 http://as30.com/huibai-4 http://as30.com/huibai-4#comments Tue, 12 May 2009 01:38:45 +0000 普洱 http://as30.com/%e7%bd%91%e7%ab%99%e5%8f%98%e6%88%90%e7%81%b0%e7%99%bd%e8%89%b2%e8%b0%83%e7%9a%84%e6%96%b9%e6%b3%95-4.html 继续阅读

]]> 时值5.12地震一周年，很多网站为了纪念或者表示哀悼，都把自己的网站变成了灰白色调。如果你也想用这种方法表示哀悼的话，这里有个很简单的代码，只要在网站的头部[wordpress中是在hearder.php中]或者调用的css页上加入以下代码就可以：

<style>
html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }
</style>

如果还不会。。。欢迎来留言。。。

最后，对在去年地震中遇难的同胞再次表示沉重哀悼！

]]> http://as30.com/huibai-4/feed 1 用css在同一个页面中设置不同连接样式 http://as30.com/css-shezhi-48 http://as30.com/css-shezhi-48#comments Mon, 13 Apr 2009 03:43:00 +0000 普洱 http://as30.com/css-shezhi-48.html 继续阅读

]]> 大家都知道想要设置统一的连接样式，只要在css文件中设置a:link,a:visited,ahover,a:active就行了。可以设置全局的连接样式。比如：

a:link,a:visited{
text-decoration:underline;
color:#629300;
}
a:hover,a:active{
text-decoration:none;
}

但是有的时候为了一些效果，想要设置一些针对某些特殊连接的样式，就需要在CSS中继续进行加工了。常用的方式有：

1.增加连接样式命名：
a.red:link { color: #FF0000; text-decoration: none;}
a.red:visited { color: #FF0000; text-decoration: none;}
a.red:hover { color: #606060; text-decoration: underline;}
a.red:active { color: #606060; text-decoration: underline;}

2.div定义命名：
div.other a:link,a:visited,a:hover,a:active{ text-decoration:none;
color:#eefffe;
font-size:28;
}

以上两种方式可以结合使用，在同一个html文件中调用的代码如下：
<a href=”http://as30.com”>三十而立</a>/*默认的连接样式*/
<a class=”red” href=”http://as30.com”>三十而立</a>/*第一种设置连接样式的方式*/
<div class=”other”>
<a class=”other” herf=”http://www.as30.com”>普洱和潘多拉的博客</a>
</div>/*第二种设置连接样式的方式*/

变化的方式自己可以变通掌握。呵呵~有问题欢迎一起探讨。

]]> http://as30.com/css-shezhi-48/feed 0 wp主题代码参考-header文件 http://as30.com/wp-header-37 http://as30.com/wp-header-37#comments Tue, 17 Mar 2009 03:13:00 +0000 普洱 http://as30.com/wp-header-37.html 继续阅读

]]> 几经周转找来的，应该是比较准确。放到这里随时备用：） 代码原文：

  <?php if (is_single() OR is_page() OR is_home()) : ?><meta name=”robots”
  content=”index,follow” /><?php else : ?><meta name=”robots”
  content=”noindex,follow” /><?php endif; ?>

代码放置的位置：在<head></head>之间就可以了。

代码效果：可以防止搜索引擎收录WP中过多的重复文章，因为WP本身的问题会造成一些存档和个人页面的重复收录，至于为什么要防止搜索引擎收录，自己想吧：）

本代码仅供参考，若使用中出现问题，请自行解决。不过如果你真的找不到答案，也可以给我留言，一起促进：）

]]> http://as30.com/wp-header-37/feed 0 css速记卡-css-cheat-sheet(V2)-下载 http://as30.com/css-cheat-sheet-51 http://as30.com/css-cheat-sheet-51#comments Tue, 03 Mar 2009 03:57:00 +0000 普洱 http://as30.com/css-cheat-sheet-51.html 继续阅读

]]> 好东西，放这里好了。CSS速记卡，2.0版本。英文的，不过单词很简单，将就着看看吧：）哪句看不懂，偶给你翻译！

下载地址：1.PDF版的2.0速记，点这里下载；

2.png版的2.0速记卡。下面的图，直接点右键另存即可：）

css速记卡2.0  作者博客地址：http://www.addedbytes.com/，里面还有其他的一些速记卡下载，值得去看看。

]]> http://as30.com/css-cheat-sheet-51/feed 0 WordPress主题学习笔记-header、index代码收集 http://as30.com/wordpress-theme-code-32 http://as30.com/wordpress-theme-code-32#comments Tue, 24 Feb 2009 02:54:00 +0000 普洱 http://as30.com/wordpress-theme-code-32.html 1.<?php bloginfo(‘stylesheet_url’); ?> 解释：<?php :开始PHP代码； Bloginfo(‘stylesheet_url’) :调用style.css文件所[......]

继续阅读

]]> WordPress主题学习笔记-header、index代码收集
1.<?php bloginfo(‘stylesheet_url’); ?>
解释：<?php :开始PHP代码；
Bloginfo(‘stylesheet_url’) :调用style.css文件所在的路径；
； ：停止调用函数。分号是用来结束一个PHP语句；
?> :结束PHP代码。

2.<?php bloginfo(‘name’); ?>
解释：<?php :开始php代码；
Bloginfo(‘name’) ：调用博客信息，具体是博客的标题；
； ：结束调用博客信息；
?> ：结束PHP代码。

3.<?php bloginfo(‘url’) ?>
解释：调用博客的链接地址。

4.<?php bloginfo(‘description’) ?>
解释：<?php ：开始php代码；
Bloginfo(‘description’) ：调用博客信息，具体的是描述；
； ：停止调用；
?> ：结束PHP代码；

5.<?php if(have_posts()): ?><?php while(have_posts()):the_post()); ?>
<?php endwhile; ?>
<?php endif; ?>
解释：if(have_posts()) ：检查你的博客是否有日志；
While(have_posts()) ：如果你有，当你有日志的时候，执行the_post这个函数；
The_post() ：调用具体日志来显示；
Endwhile; ：遵照规则#1，这里用于关闭while()；
Endif; ：关闭if()；
注释
：并不是所有的代码都需要两部分，为了打开和关闭自己。有些能够自我关闭，这就解释了have_posts()和the_post();这两个函数。因为the_post();在if()和while()的外面，它需要分号去结束或者关闭自己。

6.<?php the_title(); ?>
解释：调用博客中的日志标题。

7.<?php the_permalink(); ?>
解释：调用每篇日志链接地址的一个函数。

8.<?php the_content() ?>
解释：调用每篇日志内容的一个函数。

9.<p class=”postmetadata”>
<?php _e(’Filed under&#58;’); ?> <?php the_category(’, ‘) ?> <?php _e(’by’); ?>
<?php the_author(); ?><br />
<?php comments_popup_link(’No Comments &#187;’, ‘1 Comment &#187;’, ‘% Comments
&#187;’); ?> <?php edit_post_link(’Edit’, ‘ &#124; ‘, ”); ?>
</p>
解释：<p class=”postmetadata”>和</p> ：所有的日志元数据都在一个 class=”postmetadata”
的段落标签中，因为我想把日志元数据和日志内容区分开。如果没有段落标签，日志元数据信息将在日志内容结束的地方继续，这将没有任何间距去区别内容和日志元数据；
<?php _e(‘Filed under&#58′); ?> ：是调用是调用冒号”:”的代码；
<?php the_category(‘,’) ?> ：the_category() 是用来调用你当前日志的在的所有类别的 PHP 函数。如果你把 Filed
under: 和 the_category()放在一起，你可以得到： Filed under: Name of category 1, Name of
category 2。the_category() 中的逗号是用来区分类别名。返回日志元数据的屏幕截图，你可以注意到在类别连接中的逗号；
<?php _e(‘by’); ?> ：和 Filed under:一样。如果你创建私人用的的主题， by 外面的 _e() 不是必须的。_e()
是用来创建可以翻译的主题，如果主题被来自不同国家的上百人使用的话，这是非常重要的。如果你是创建公共使用的主题，最后加上 _e() 以便你的主题可翻译化；
<?php the_author(); ?> ：它是输入当前日志作者的名字。
<br /> ：如果你想要一个空行，又不想用段落标签来产生间距，使用BR，注意斜线/，这是能自我关闭的标签。
<?php comments_popup_link(’No Comments &#187;’, ‘1 Comment &#187;’, ‘% Comments
&#187;’); ?>
：当弹出留言的功能激活的话，comments_popup_link()调用一个弹出的留言窗口。如果没有激活，comments_popup_link()则只是简单的现实留言列表。No
Comments »是在没有留言的时候显示的。1 Comment » 是用于当你刚好有1条留言时候。% Comments &amp;187;
是用于当你有多于一条留言的时候。比如：8 Comments »。百分号 % 用来显示数字。» 是用来显示一个双层箭头 »。
<?php edit_post_link(’Edit’, ‘ &#124; ‘, ”); ?>
：这个只有当你以管理员身份登录的的时候（译者注释：以编辑者，Editor登录也可以）才可见。 edit_post_link()
只是简单为你显示一个可以用来编辑当前日志的编辑链接，这样可以让你不必去管理界面搜寻该日志而能直接编辑。edit_post_link()
有三个参数。第一个是用来确定哪个词你将用在编辑链接的链接标题。如果你使用 Edit post，那么将显示 Edit post 而不是
Edit。第二个参数是用来显示在链接前面的字符，在这里是竖线
|，代码就是&amp;124;。第三个参数是用于显示在编辑链接后面的字符，在这里没有使用，登陆WP以后，再返回到首页就可以看到”Edit”的链接和一条竖线.

]]> http://as30.com/wordpress-theme-code-32/feed 0