博客属性10个非常不错的CSS技巧

这几周个人几篇文章介绍了改博客属性的文章. 关联文章的地址

    在这里,妙巧的运用CSS的技能,可以让你不必修改HTML能就失掉很好的博客或者模板表面。我收集了一些非常用有的CSS技能让我们计设博客时更炫更酷。

 

    

 

 

    计设模版和博客题主时,我经常“一直敲推和试尝CSS(Hit and Trial CSS ),我只看哪类配色计划和哪类CSS属性的合结能使面页的元素更完善。对了。之所以说是“一直敲推和试尝CSS”是因为在失掉了意满的效果之前我会去试尝想尽一切方法。应用这些不同的CSS属性中,我用的最多的是列出来的这些。

 

 

    从我开始写博客,我就接触了CSS,我爱计设也爱CSS。博客让我学了PHP,CSS甚至HTML。这里我收集了10个很不错的CSS技能,你可以用在你的博客或个人网站上。它可以帮你很好地理整你的博客元素并让他们看起来蛮酷的。上面开始我们的容内,希望你会欢喜它。

 

    

1、单简的方法整调博客图片大小

 

    

1.content img {
 
2height:auto;
 
3width:500px;
 
4}
 

 

    这是最单简高效的重新整调你博客图片尺寸的方法。它把容内里头的有所图片的宽度设为500像素,高度根据宽度自适应。我当初就是用这个方法重新义定了这个博客容内里头的图片大小。

 

    

2、IE HTML Hack

 

    

1div#content {width: 580px}
 
2* html body div#content {width: 600px}
 

 

    在div后面加上*号,这样你能为IE制定特别式样。

 

    

3、CSS影阴

 

    

1.shadow {
 
2-moz-box-shadow: 3px 3px 5px 6px #ccc;
 
3-webkit-box-shadow: 3px 3px 5px 6px #ccc;
 
4box-shadow: 3px 3px 5px 6px #ccc;
 
5}
 

 

 

    你能为块级元素或任何被div包裹的类或标签应用面上的式样。你要需设置水和平竖直偏移量、糊模半径和影阴填充色。你可以在这篇文章贴出的那张图片上看看这个例子。

 

    

4、CSS首字放大

 

    

1p:first-letter {
 
2display: block;
 
3float: left;
 
4margin: 5px 5px 0 0;
 
5color: red;
 
6font-size: 1.4em;
 
7background: #ddd;
 
8font-family: Helvetica;
 
9}
 
    每日一道理
闷热的天,蝉儿耐不住寂寞地不停在鸣叫,我孤单一人,寂静的身旁没有一个知音,想疯狂地听摇滚乐,听歇斯底里的歌声,那只为逃避无人的世界里那浓烈的孤单气息。一个人是清冷,两个人便是精彩,于是,莫名的冲动让我格外想念旧日的好友,怀念过去的日子,尽管不够现实的遐想追回不了曾经一切,但却希望思绪可以飞扬于闭上双目后的世界中,印有微笑,印有舞动的身姿,翩翩起舞……

 

    义定你的首字放大很轻易,用CSS的first-letter属性以可就动自选定的博客的首字母,这样你可以制定CSS来计设首字母的式样了,像更大字号、体斜等等。

 

    

5、用CSS翻转图像

 

    

 
1#content img {
 
2-moz-transform: scaleX(-1);
 
3-o-transform: scaleX(-1);
 
4-webkit-transform: scaleX(-1);
 
5transform: scaleX(-1);
 
6filter: FlipH;
 
7-ms-filter: "FlipH";
 
8}
 

 

    用面上的CSS属性你可以翻转任何图片

 

    

6、移除被点链接的点框

 

    

 
1a {outline: none}
 

 

    或者

 

    

 
1a {outline: 0}
 

 

 

    你定一注意到了,当你在一些博客里点击链接时,你会看到在这个链接上有点状的边框。你可以通过面上一小段的CSS移掉这些边框。

 

    

7、在CSS中应用特别体字

    你可以应用CSS来加载特别体字,你要做的就是把这个TTF格式的体字上传到服务器上,然后应用体字规则在CSS上导入它。

 

    

8、元素透明

 

    

1.element {
 
2filter:alpha(opacity=50);
 
3-moz-opacity:0.5;
 
4-khtml-opacity: 0.5;
 
5opacity: 0.5;
 
6}
 

 

    应用透明属性,你可以让任何览浏器上的元素透明,这些属性可以在有所主流器上任务,甚至IE(PS:IE6略过?...)

 

    

9、应用CSS表现链接以后的URL

 

    

1a:after{content:" (" attr(href) ") ";}
 

 

    这会在链接锚点后表现URL。你也可以用体字或其他式样义定它。

 

    

10、为手持设备制定特别式样

 

    

1<link type="text/css" rel="stylesheet" href="handheldstyle.css" media="handheld">
 

 

    如果你的博客不能应响或者你想在用手机览浏时有特别的式样,你可为以你博客的手机版制定CSS。

文章结束给大家分享下程序员的一些笑话语录: 现在社会太数字化了,所以最好是有一个集很多功能于一身的设备!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值