我的页面定制CSS代码，针对博客园SimpleGamboge皮肤。
调整：
1、左上图片更换为自己的头像
2、扩大左侧栏宽度，缩小右侧主栏宽度宽度
3、扩大内容页面的评论区宽度，工具图标靠左
4、去广告……
5、拉伸状态下，左侧栏固定宽度，右侧栏适应(by grace)
/*左上头像*/
#lnkBlogLogo {
float: right;
display: block;
width: 180px; /*调整*/
height: 180px; /*调整*/
background-image: url(http://pic.cnitblog.com/avatar/694556/20141120153630.png); /*调整*/
}
/*左侧栏*/
#header {
width: 180px; /*调整*/
min-width:180px;
color: #000;
background: #FFF;
}
@media screen and (max-width: 1000px){
#header, #sideBar {
display:block;
}}
#sideBar {
width: 180px; /*调整*/
min-width: 180px; /*调整*/
min-height: 200px;
float: left;
text-align: right;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
word-break: break-all;
}
.input_my_zzk {
width: 100px; /*调整input text*/
}
/*右侧主栏*/
#mainContent .forFlow {
position: absolute;
top: 0;
left:200px;
right: 0;
float: right;
width: initial;
min-height: 1000px;
min-width: 800px;
background: #F6E497;
}
/*评论区*/
div.commentform textarea {
width: 100%; /*调整*/
height: 300px;
font-size: 13px;
}
.commentbox_title_right {
float: left; /*调整*/
height: 22px;
}
/*下广告*/
#site_nav_under {
margin-top: 5px;
line-height: 1.8;
display: none; /*调整*/
}
.c_ad_block {
margin-top: 10px;
line-height: 1.5;
display: none; /*调整*/
}
P.S. 原来大概长这样
页面定制CSS代码初探(一)：页面变宽 文本自动换行 图片按比缩放
初识博客 初写博客,先在设置里选了个喜欢的模板 第一眼就爱上了呢!那极简的风格,我喜欢!!但是,应用后,却发现... 纳尼!模板上右侧那张漂亮的图片呢?!我的怎么什么都没有.没有图片好难看啊,瞬间无爱 ...
页面定制CSS代码初探(三)：设置正文最小高度
前言 没想到再次写这篇,已经过去1年半了. 现在审美也发生了改变,一开始做的样式全删了,只保留了h2的样式.原先认为界面要宽,两边留太多空很浪费,看惯了知乎和简书,觉得默认最大1000px的排版也不错 ...
页面定制CSS代码初探(六)：h2、h3 标题自动生成序号 详细探索过程
前言 最近在整理博客写作格式的规范,碰到一个问题:标题要不要加序号? 直到我碰到一个人这么说 手动维护编号实在是一件很闹心的事情, 如果位置靠前的某个段落被删除了, 那么几乎每个段落的编号都要手动修改 ...
页面定制CSS代码初探(五)：给每篇文章最后加上&#39;<;完>;&#39;
前言 我刚写博客的时候,有几篇是手动在最后加了个 今天在看别人CSS布局时,发现很多::before和::after标签,因为没学过CSS,从名字看大概是前边/后边 加上某个东西的意 ...
页面定制CSS代码
博客皮肤:SimpleMemory .catListTitle { margin-top: 21px; margin-bottom: 10.5px; text-align: left; border- ...
页面定制CSS代码初探(四)：cnblogs使用Github引用样式
前言 对于用惯了Github的人来说,眼里的引用应该是这样的 "Talk is cheap. Show me the code" -- Linus Torvalds 然而实际上cn ...
页面定制CSS代码初探(二)：自定义h2标题样式 添加阴影 添加底色 等
故事的开始 先说一下
原先默认是空白的,很难看 然后今天无意中看到一个博友的标题很好看啊,一直就想要这种效果有没有? 好的东西自然要拿过来啦 通过审查元素,果然 ...博客的页面定制CSS
我目前的博客CSS其实也是借用了别家的,来源:https://www.cnblogs.com/Penn000/p/6947472.html 注意使用的模板是:darkgreentrip 复制粘贴使用就 ...
使用CSS代码修改博客模板
在修改设置使公告栏里的头像更新为新的头像时发现里边还有“页面定制CSS代码”这一选项,查了一下发现这东西可以对页面做一些个性化的调整.正好目前我使用的这个模板标题和导航栏的字体实在难看,顺手修改了一下 ...
随机推荐
ArrayList的使用方法(转载)
转载自: http://i.yesky.com/bbs/jsp/view.jsp?articleID=889992&forumID=150 1.什么是ArrayList ArrayLis ...
转:Java NIO系列教程(一)Java NIO 概述
Java NIO 由以下几个核心部分组成: Channels Buffers Selectors 虽然Java NIO 中除此之外还有很多类和组件,但在我看来,Channel,Buffer 和 Sel ...
YModem协议
源:YModem协议 YModem协议: YModem协议是由XModem协议演变而来的,每包数据可以达到1024字节,是一个非常高效的文件传输协议. 下面先看下YModem协议传输的完整的握手过程: ...
Django之真正创建一个django项目
真正创建一个django项目 1 创建Django项目 :new-project 2 创建APP : python manager.py startapp app01 3 setting 配 ...
MySQL中如何实现 select top n
mysql 没有 top n 语法,mysql 用 limit 来实现相关功能,而且功能更加强大. 语法: SELECT * FROM table LIMIT [offset,] rows | row ...
python时间日期字符串各种
python时间日期字符串各种 第一种 字符串转换成各种日期 time 库 # -*- coding: utf-8 -*- import time, datetime # 字符类型的时间 tss1 = ...
Hello Redis - Voting on articles
Redis in Action JOSIAH L. CARLSON MANNING Shelter Island ONE_WEEK_IN_SECONDS = 7 * 86400 VOTE_SCORE ...
html中内联元素和块元素的区别、用法以及联系
昨天用asp.net的BulletedList做一个导航栏,最终该控件形成的html代码是ul列表和a超链接,具体代码如下:
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
