WordPress网站更改文章列表样式的教程

CSS代码:

/*文章列表样式*/
@media screen and (min-width: 768px){.posts-item .item-thumbnail{width: 100%; height: 300px;}/*.posts-item .item-heading{text-align: center;}*/.posts-item .item-body{margin-top: 15px; width: calc(100% - 20px - 20px);}}

上面该样式只有电脑、平板显示(即>768px的显示),若需要手机或者全部显示,请用下面代码:

/*文章列表样式*/
.posts-item .item-thumbnail{width: 100%; height: 300px;}/*.posts-item .item-heading{text-align: center;}*/.posts-item .item-body{margin-top: 15px; width: calc(100% - 20px - 20px);}

本站正在使用的CSS样式:

/*文章列表样式*/
@media screen and (min-width: 768px){.posts-item{padding: 10px;}/*.posts-item .item-heading{font-size: 22px;}*/.posts-item .item-thumbnail{width: 100%; height: 300px;}/*.posts-item .item-heading{text-align: center;}*/.posts-item .item-body{margin-top: 15px; width: 100%;margin-left: 0px;}}

👋 感谢您的观看!

© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享