为你图片加上标题Image Captions

/ 1评 / 0

wp-caption alignnone? 在WordPress 2.6许多新功能里有一个,那就是为你的图片加上标题(Image Captions),这个功用需要主题支援才能发生作用,主题里加上cpations的式样,与在图片加上cpations的语法,让你的图片可以显示标题说明。
首先要确定你的主题对图片并没有做任何式样的设计,这样子修改起来会比较容易,不然可能会有其他变动式样后的麻烦要订正。
范例,

网线

网线

修改的步骤說明如下:

打开主題的样式(style.css),加上以下的语法。

/* wp*/
.aligncenter,
div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.alignleft {
float: left;
}

.alignright {
float: right;
}

.wp-caption {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px;
/* optional rounded corners for browsers that support it */
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}

.wp-caption img {
margin: 0;
padding: 0;
border: 0 none;
}

.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
padding: 0 4px 5px;
margin: 0;
}

插入图片的时候使用wp自带的添加媒体--图片--添加说明。ok
  1. 布谷鸟说道:

    不错,代码效果很好。

发表评论

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