Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

一些样式的修改 #9

Closed
ai977313677 opened this issue Sep 6, 2019 · 3 comments
Closed

一些样式的修改 #9

ai977313677 opened this issue Sep 6, 2019 · 3 comments

Comments

@ai977313677
Copy link
Contributor

宽度用百分比控制,目前pingshu主题的文章页宽度感觉比较窄,针对PC,css文件(移动端没看过):

.main-content.post-page {
        /* 文章的实际宽度 */
	width: 66%;
}

.post-page {
        /* 文章最大宽度 */
	max-width: 66%; 
	padding: 130px 25px 20px;
}

/* 改变宽度会影响目录的位置 */
.directory-content {
	max-width: 66%;
}

博文的引用内容,我觉得应该改成斜体与其他内容做区分:

blockquote {
	font-style:italic;
        /* 抄的csdn引用块的背景色,但是放这里不是很好看 */
        background: #eef0f4;
}

还有header的样式,我看了下,一般我是用大盒套小盒来解决这种定位问题:

<div style="height: 70px;">
  <div style="width: 10%; text-align: left;">
    <a href="#">
      <img src="" alt="" width="50px" height="50px">
    </a>
  </div>

  <div style="width: 90%; text-align: right;">
    
  </div>
</div>

盒嵌套的代码太丑了,我看navbar-container有定位属性,而且固定了高度,所以我这样改了一下:

.navbar-logo {
        /* margin-top之类的属性没动,因为动一下会改挺多东西的,所以下面的计算并不是正确的,navbar高70,img宽高50,top=20px */
	top: 20px;
}

.navbar-logo img {
        /* 方形感觉又小又丑的样子,所以我改成圆形了 */
	border-radius: 50%;
	width: 50px;
	height: 50px;
	outline: 0
}

页脚的RECENT POST和RECENT COMMENT感觉用处不大,可以考虑换成友链之类的。(页面页脚可以大气一点,不要作者名,就Theme is Pinghsu by Chakhsu Powered by Halo这两条,留一行放备案信息)

最后有一个问题,分享的QrCode标签失效了,可以删掉了……

@ai977313677
Copy link
Contributor Author

中午改完提个合并请求:D

@ai977313677
Copy link
Contributor Author

拖延症:D

@ruibaby
Copy link
Member

ruibaby commented Sep 7, 2019

好的,感谢你的参与,晚点我看一下。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants