博客园美化,自定义你的博客,css+html (iframe)

可能要开始频繁的写博客了,先打扫下自家门口。

收藏备用

 1 body{
 2 background-color: #293941;
 3 background:url("博客背景图片URL");
 4 background-attachment:fixed;
 5 background-repeat:no-repeat;
 6 background-position:center;
 7 background-size:cover;
 8 }
 9 #floating {
10 position: fixed;
11 bottom: 0px;
12 right: 0;
13 z-index: 1
14 }
15 .c_ad_block /*关闭下方广告*/
16 {display: none;}
17 .commentform/*关闭下方广告*/
18 {display: none;}
19 #home {
20     margin: 0 auto;
21     width: 65%;
22     min-width: 950px;
23     background-color: #fffffff2;/*透明度调整为f2*/
24     padding: 30px;
25     margin-top: 50px;
26     margin-bottom: 50px;
27     box-shadow: 0 2px 6px rgba(100,100,100,.3);
28 }
29 .newsItem, .catListEssay, .catListLink, .catListNoteBook, .catListTag, .catListPostCategory, .catListPostArchive, .catListImageCategory, .catListArticleArchive, .catListView, .catListFeedback, .mySearch, .catListComment, .catListBlogRank, .catList, .catListArticleCategory {
30     background: #fff0;/*透明度调整为0*/
31     margin-bottom: 35px;
32     word-wrap: break-word;
33 }
CSS部分
1 <div id="bodyframe" style="visibility: visible"> 
2 <embed id="floating" ; frameborder="no" border="0" marginwidth="0" marginheight="0" width=280 height=320 src="https://music.163.com/outchain/player?type=0&id=歌单ID&auto=1&height=430"></embed>
3 <div id="floating" onclick="document.all.bodyframe.style.visibility='hidden'" style="background-color: #f1f1f1; cursor: pointer; text-align: center;font-size: 16px;";z-index: 1"> 
4 <font color="#000000">隐藏  </font> 
5 </div> </div>
侧边栏公告
1 <div>
2 <p><img style="float:right; margin-right: 5%;" title="Hello,world!" 
3 onmouseover="this.src='https://images.cnblogs.com/cnblogs_com/-AClon-/1676582/o_200321113207banner_r_n.png';" onmouseout="this.src='https://images.cnblogs.com/cnblogs_com/-AClon-/1676582/o_200321072804banner_r.png';" src="https://images.cnblogs.com/cnblogs_com/-AClon-/1676582/o_200321072804banner_r.png" alt=""  /></p>
4 </div>
5 
6 <div id="floating" onclick="document.all.bodyframe.style.visibility='visible'"; style="background-color: #00000040; cursor: pointer; text-align: center; font-size: 16px;" z-index: 1"> 
7 <font color="#ffffff" size:14px>显示  </font></div>
页首
1 <div style="height:800px;" >
2 </div>
3 /*留白*/
页脚

PS: 先申请JS权限(说点好话给管理员~),博客园不支持iframe的字符串,替换成embed即可。

PS2: 网易云iframe插件可能不能播放部分歌曲(即使不用VIP、付费的,你怎么点都不会播放),自己测试下能播放的,放到新歌单就行了。

还有更讲究的:

https://www.cnblogs.com/netube/p/10160706.html

https://www.cnblogs.com/laoguantongxiegogo/p/12488696.html#4521979

https://www.cnblogs.com/bai2018/p/10801430.html

最后一句:简简单单就是美。

猜你喜欢

转载自www.cnblogs.com/-AClon-/p/12545319.html