多说评论样式修改

作者: Rememberautumn 分类: 未分类 发布时间: 2015-05-08 20:20 阅读: 3,673
 在刚建博客的时候,还是大一的暑假,啥都不会,只会个c++,那个时候折腾博客很有精力,一直弄了10多天,只是,只会一些加一些插件,和换主题,因为我用的是sae,不支持本地读写代码,看着多说样式的修改需要改css样式的时候我就放弃了,根本不知道代码在哪,该怎么改,今天闲来无事终于改了改。

1.在哪改。

多说的样式表是在wordpress后台后台

 

修改的,只要把要添加的样式写进去保存就好了。

2.常用的样式表

定义评论框内部字体和颜色
#ds-thread #ds-reset .ds-textarea-wrapper textarea, #ds-thread #ds-reset .ds-textarea-wrapper .ds-hidden-text {font-family: ‘微软雅黑’ ‘Microsoft Yahei’!important;font-size:12px;letter-spacing:1px;}
隐藏评论框底部渐变背景
#ds-reset .ds-gradient-bg{background:none !important;}
隐藏评论右上方 最热 最新排序按钮
#ds-thread #ds-reset li.ds-tab a.ds-current{background:none;border:none;}
圆角(或者圆形)+阴影
#ds-reset .ds-avatar img{
width:54px;height:54px; /*设置图像的长和宽*/
border-radius: 27px;/*设置图像圆角效果*/
-webkit-border-radius: 27px;/*圆角效果:兼容webkit浏览器*/
-moz-border-radius:27px;
box-shadow: inset 0 -1px 0 #3333sf;/*设置图像阴影效果*/
-webkit-box-shadow: inset 0 -1px 0 #3333sf;
}

鼠标悬浮时头像旋转
#ds-reset .ds-avatar img{
width:54px;height:54px; /*设置图像的长和宽,这里要根据自己的评论框情况更改*/
border-radius: 27px;/*设置图像圆角效果,在这里我直接设置了超过width/2的像素,即为圆形了*/
-webkit-border-radius: 27px;/*圆角效果:兼容webkit浏览器*/
-moz-border-radius:27px;
box-shadow: inset 0 -1px 0 #3333sf;/*设置图像阴影效果*/
-webkit-box-shadow: inset 0 -1px 0 #3333sf;
-webkit-transition: 0.4s;
-webkit-transition: -webkit-transform 0.4s ease-out;
transition: transform 0.4s ease-out;/*变化时间设置为0.4秒(变化动作即为下面的图像旋转360读)*/
-moz-transition: -moz-transform 0.4s ease-out;
}
#ds-reset .ds-avatar img:hover{/*设置鼠标悬浮在头像时的CSS样式*/
box-shadow: 0 0 10px #fff; rgba(255,255,255,.6), inset 0 0 20px rgba(255,255,255,1);
-webkit-box-shadow: 0 0 10px #fff; rgba(255,255,255,.6), inset 0 0 20px rgba(255,255,255,1);
transform: rotateZ(360deg);/*图像旋转360度*/
-webkit-transform: rotateZ(360deg);
-moz-transform: rotateZ(360deg);
}

如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!

发表评论

电子邮件地址不会被公开。 必填项已用*标注