使用CSS/JS代码修改博客模板plus
之前对CSS/JavaScript了解还不深,只是把模板的CSS胡乱修改了几个属性。最近正好也在做一个网站的前端,学习了不少东西,再来改一改~
上次最后之所以铩羽而归,是因为从CSS里找不到那些#和.对应的东西控制的都是啥子,这回不在看那个CSS了,直接用浏览器的开发者模式打开博客,一级一级找下去,看控制要改的内容的都是哪个DIV,把那些呆滞傻二的字体一一改掉:
.cnblogs_code pre {
font-family: Courier New!important;
font-size: 16px!important;
word-wrap: break-word;
white-space: pre-wrap;
} .cnblogs_code span {
font-family: Courier New!important;
font-size: 16px!important;
line-height: 1.5!important;
}
#header h1 {
font-weight: normal;
font-size: 30px;
line-height:;
}
#header h1 a {
font-family: "Microsoft YaHei";
}
#header h1 a:hover {
color: #F60;
text-decoration: none;
}
#blogTitle h2 {
font-weight: normal;
font-size: 18px;
color: #000000;
line-height: 1.5em;
margin-top: 10px;
margin-left: 30px;
width: 50%;
margin-left: 10em;
float: left;
}
.c_b_p_desc{
word-wrap:break-word;
word-break:break-all;
overflow:hidden;
font-family:"CHARLEMAGNE STD","Microsoft YaHei";
font-size: 13px;
}
.newsItem{
font-family: "Microsoft YaHei";
font-size: 14px;
}
#profile_block a{
font-family: "CHARLEMAGNE STD","Microsoft YaHei";
}
.postTitle {
font-family:"CHARLEMAGNE STD","Microsoft YaHei";
font:"CHARLEMAGNE STD","Microsoft YaHei";
font-size:16px;
}
#header {
width: 1180px;
}
#main {
width: 1180px;
}
#mainContent {
width: 900px;
}
#home{
width: 1180px;
margin:0 auto;
}
#sidebar_categories{
font-family:"CHARLEMAGNE STD","Microsoft YaHei";
font:"CHARLEMAGNE STD","Microsoft YaHei";
font-size: 13px;
}
CSS代码
只可惜这个希腊碑文的英文字体很多电脑上没有,从网上查了一下让网页使用特殊字体的方法,不过需要url,但是我没地方上传啊,这个问题的解决方法还在研究当中。
最后,找了一下页面最后的广告的DIV,一共有3个,id分别是ad_c1,ad_c2和ad_什么的记不起来了,还有两三个新闻的DIV。一开始的想法是用JS看看能不能根据id的前缀来getelement什么的,可是貌似没有这样的函数。如果把这五六个DIV一一设置隐藏的话也太萌了,所以我就直接把整个评论区给隐藏了,反正也不会有人评论,呵呵。不过这里还是要存疑,毕竟这样并不完美。
<img src="//pic.cnblogs.com/avatar/293751/20160902001721.png" alt="丶夕颜的头像" class="img_avatar"><br> <script type="text/javascript">
window.onload=function(){
var oA=document.getElementById("comment_form");
oA.setAttribute("hidden", "hidden",1);
}
</script>
JavaScript代码
这就很尴尬了。隐藏广告这项能力似乎是一次性的,刷新一次后就失去了......一开始真的是能隐藏的,奇怪。好像明白是怎么回事,不过说不太清楚。
哈哈,JS不行老娘就jQuery,把window.onpageshow改成$(document).ready(就搞定了~
来咬我啊,广告君~
使用CSS/JS代码修改博客模板plus的更多相关文章
- 使用CSS代码修改博客模板
在修改设置使公告栏里的头像更新为新的头像时发现里边还有“页面定制CSS代码”这一选项,查了一下发现这东西可以对页面做一些个性化的调整.正好目前我使用的这个模板标题和导航栏的字体实在难看,顺手修改了一下 ...
- 不懂CSS也能定制博客界面!
之前没想过定制博客界面,毕竟CSS,HTML什么的都不懂,不过看了这篇文章分分钟搞定: [详细图解]一步一步教你自定义博客园(cnblog)界面 我是基于模板BlueSky做了些改动,先看修改前后的效 ...
- 我的博客模板(线框图wireframe)
不久前看到一篇介绍定制网页浏览的方法,当时就想着,我把我的博客页也修改下,在手机浏览的时候,也能漂亮的显示出来.以后写的文章的话,也可以分享的微信朋友圈里面和朋友分享. 具体步骤参考:http://w ...
- 第41篇 推荐一个jekyll博客模板
本人用的模板是基于Codeboy的博客模板改造模板,(由于本人可能会有很多样式修改,所以不再将修改pullrequst到原项目,在此对codeboy模板表示感谢).功能改造如下: 添加微信支付宝打赏 ...
- 基于Jekyll的博客模板
代码地址如下:http://www.demodashi.com/demo/13147.html 效果 环境配置 环境 Windows 10 Git Bash 安装ruby 下载rubyinstalle ...
- Submine Text3格式化HTML/CSS/JS代码
Submine Text3格式化HTML/CSS/JS代码需要安装插件,步骤如下: 1.打开菜单--->首选项---->Package Control,输入 install package ...
- Sublime text 3 如何格式化HTML/css/js代码
Sublime Text 3 安装Package Control 原来Subl3安装Package Control很麻烦,现在简单的方法来了 一.简单的安装方法 使用Ctrl+`快捷键或者通过Vi ...
- Zend Studio 上 安装使用Aptana插件(html,css,js代码提示功能) .
最近装了zend studio 9.0 用了段时间发现写html,css,js代码没提示,要开dreamwaver(对js代码提示也不好).就网上搜索了下,发现了Aptana插件,装上用了下,感觉不错 ...
- 利用Sails.js+MongoDB开发博客系统
http://yoyoyohamapi.me/categories/利用Sails-js-MongoDB开发博客系统/ 利用Sails.js+MongoDB开发博客系统 Apr 14, 2016 利用 ...
随机推荐
- JS打造的跟随鼠标移动的酷炫拓扑图案
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 手写代码自动实现自动布局,即Auto Layout的使用
手写代码自动实现自动布局,即Auto Layout的使用,有需要的朋友可以参考下. 这里要注意几点: 对子视图的约束,若是基于父视图,要通过父视图去添加约束. 对子视图进行自动布局调整,首先对UIVi ...
- Linq to json
Json.Net系列教程 4.Linq To JSON 一.Linq to JSON是用来干什么的? Linq to JSON是用来操作JSON对象的.可以用于快速查询,修改和创建JSON对象.当JS ...
- 网站对话框开源脚本--ArtDialog V6.0
初识对话框脚本觉得artDialog还是挺不错的开源的js脚本,最新版本都是V6.0 ,相对之前版本,artDialog的语法也发生很大的变化,windows对应的JS版本如下 点击下载 语法也发生变 ...
- poj 2337 欧拉回路输出最小字典序路径 ***
把26个小写字母当成点,每个单词就是一条边. 然后就是求欧拉路径. #include<cstdio> #include<iostream> #include<algori ...
- 全零网络IP地址0.0.0.0表示意义详谈
转自:http://liuzhigong.blog.163.com/blog/static/17827237520114207278610/ RFC: 0.0.0.0/8 - Addresses in ...
- pthread_create传递参数
转自:http://blog.csdn.net/yeyuangen/article/details/6757525 #include <iostream> #include <pth ...
- HTML5——摒弃插件和前端框架的异步文件上传
之前我从来没有体会到HTML5的便利,直到这次需要一个异步上传的功能功能.一开始我以为文件的一些声明必须为HTML5才管用,后来才知道添加了很多以前没有的标签,并可以直接播放视频,音频等.可以不再使用 ...
- 19条ANDROID平台设计规范(转)
1.尺寸以及分辨率: Android的界面尺寸比较流行的有:480*800.720*1280.1080*1920,我们在做设计图的 时候建议是以 480*800的尺寸为标准; 2.界面基本组成元素: ...
- 一个json字符串
{ "area": [{ "flag": "Y", "ishot": "N", "lag& ...