你是否想过如何设计WordPress主题的不同元素?每个主题都不一样，但是有一些CSS的class和id是由WordPress生成的。我们将逐一介绍一些最重要的默认WordPress样式，方便初学者快速入门wordpress模板制作的样式定义

　　默认的body样式

.rtl {}

.home {}

.blog {}

.archive {}

.date {}

.search {}

.paged {}

.attachment {}

.error404 {}

.single postid-(id) {}

.attachmentid-(id) {}

.attachment-(mime-type) {}

.author {}

.author-(user_nicename) {}

.category {}

.category-(slug) {}

.tag {}

.tag-(slug) {}

.page-parent {}

.page-child parent-pageid-(id) {}

.page-template page-template-(template file name) {}

.search-results {}

.search-no-results {}

.logged-in {}

.paged-(page number) {}

.single-paged-(page number) {}

.page-paged-(page number) {}

.category-paged-(page number) {}

.tag-paged-(page number) {}

.date-paged-(page number) {}

.author-paged-(page number) {}

.search-paged-(page number) {}

　　默认的post样式

.post-id {}

.post {}

.page {}

.attachment {}

.sticky {}

.hentry {}

.category-misc {}

.category-example {}

.tag-news {}

.tag-wordpress {}

.tag-markup {}

　　格式样式

.format-image {}

.format-gallery {}

.format-chat {}

.format-link {}

.format-quote {}

.format-status {}

.format-video {}

　　默认的菜单样式

#header .main-menu{} // container class

#header .main-menu ul {} // container class first unordered list

#header .main-menu ul ul {} //unordered list within an unordered list

#header .main-menu li {} // each navigation item

#header .main-menu li a {} // each navigation item anchor

#header .main-menu li ul {} // unordered list if there is drop down items

#header .main-menu li li {} // each drop down navigation item

#header .main-menu li li a {} // each drap down navigation item anchor

.current_page_item{} // Class for Current Page

.current-cat{} // Class for Current Category

.current-menu-item{} // Class for any other current Menu Item

.menu-item-type-taxonomy{} // Class for a Category

.menu-item-type-post_type{} // Class for Pages

.menu-item-type-custom{} // Class for any custom item that you added

.menu-item-home{} // Class for the Home Link

　　默认的WISIWYG编辑器样式

.entry-content img {}

.alignleft, img.alignleft {}

.alignright, img.alignright {}

.aligncenter, img.aligncenter {}

.alignnone, img.alignnone {}

.wp-caption {}

.wp-caption img {}

.wp-caption p.wp-caption-text {}

.wp-smiley {}

blockquote.left {}

blockquote.right {}

.gallery dl {}

.gallery dt {}

.gallery dd {}

.gallery dl a {}

.gallery dl img {}

.gallery-caption {}

.size-full {}

.size-large {}

.size-medium {}

.size-thumbnail {}

　　默认的widget样式

.widget {}

#searchform {}

.widget_search {}

.screen-reader-text {}

.widget_meta {}

.widget_meta ul {}

.widget_meta ul li {}

.widget_meta ul li a {}

.widget_links {}

.widget_links ul {}

.widget_links ul li {}

.widget_links ul li a {}

.widget_archive {}

.widget_archive ul {}

.widget_archive ul li {}

.widget_archive ul li a {}

.widget_archive select {}

.widget_archive option {}

.widget_pages {}

.widget_pages ul {}

.widget_pages ul li {}

.widget_pages ul li a {}

.widget_links {}

.widget_links li:after {}

.widget_links li:before {}

.widget_tag_cloud {}

.widget_tag_cloud a {}

.widget_tag_cloud a:after {}

.widget_tag_cloud a:before {}

.widget_calendar {}

#calendar_wrap {}

#calendar_wrap th {}

#calendar_wrap td {}

#wp-calendar tr td {}

#wp-calendar caption {}

#wp-calendar a {}

#wp-calendar #today {}

#wp-calendar #prev {}

#wp-calendar #next {}

#wp-calendar #next a {}

#wp-calendar #prev a {}

.widget_categories {}

.widget_categories ul {}

.widget_categories ul li {}

.widget_categories ul ul.children {}

.widget_categories a {}

.widget_categories select{}

.widget_categories select#cat {}

.widget_categories select.postform {}

.widget_categories option {}

.widget_categories .level-0 {}

.widget_categories .level-1 {}

.widget_categories .level-2 {}

.widget_categories .level-3 {}

.recentcomments {}

#recentcomments {}

#recentcomments li {}

#recentcomments li a {}

.widget_recent_comments {}

.widget_recent_entries {}

.widget_recent_entries ul {}

.widget_recent_entries ul li {}

.widget_recent_entries ul li a {}

.textwidget {}

.widget_text {}

.textwidget p {}

　　

.widget_pages ul, .widget_archive ul {}

　　默认的评论表单样式

/*Comment Output*/

.commentlist .reply {}

.commentlist .reply a {}

.commentlist .alt {}

.commentlist .odd {}

.commentlist .even {}

.commentlist .thread-alt {}

.commentlist .thread-odd {}

.commentlist .thread-even {}

.commentlist li ul.children .alt {}

.commentlist li ul.children .odd {}

.commentlist li ul.children .even {}

.commentlist .vcard {}

.commentlist .vcard cite.fn {}

.commentlist .vcard span.says {}

.commentlist .vcard img.photo {}

.commentlist .vcard img.avatar {}

.commentlist .vcard cite.fn a.url {}

.commentlist .comment-meta {}

.commentlist .comment-meta a {}

.commentlist .commentmetadata {}

.commentlist .commentmetadata a {}

.commentlist .parent {}

.commentlist .comment {}

.commentlist .children {}

.commentlist .pingback {}

.commentlist .bypostauthor {}

.commentlist .comment-author {}

.commentlist .comment-author-admin {}

.commentlist {}

.commentlist li {}

.commentlist li p {}

.commentlist li ul {}

.commentlist li ul.children li {}

.commentlist li ul.children li.alt {}

.commentlist li ul.children li.byuser {}

.commentlist li ul.children li.comment {}

.commentlist li ul.children li.depth-{id} {}

.commentlist li ul.children li.bypostauthor {}

.commentlist li ul.children li.comment-author-admin {}

#cancel-comment-reply {}

#cancel-comment-reply a {}

/*Comment Form */

#respond { }

#reply-title { }

#cancel-comment-reply-link { }

#commentform { }

#author { }

#email { }

#url { }

#comment

#submit

.comment-notes { }

.required { }

.comment-form-author { }

.comment-form-email { }

.comment-form-url { }

.comment-form-comment { }

.form-allowed-tags { }

.form-submit

　　ytkah整理自https://www.wpbeginner.com/wp-themes/default-wordpress-generated-css-cheat-sheet-for-beginners/

wordpress默认css样式class和id集合的更多相关文章

  1. div+css样式表的id,class的常用命名规则

    div+css样式表的id的常用命名规则如下表所示: div+css样式表的id的常用命名规则如下表所示: 页头 header 登录条 loginBar 标志 logo 侧栏 sideBar 广告 B ...

  2. 更改file文件上传默认CSS样式

    前言: 多数时候我们需要表单上传文件,如图片.但是浏览器默认的input[file]样式很不友好, 需要我们自己手动修改. 如图基于bootstrap布局的表单, 但file文件上传样式不敢恭维. & ...

  3. 修改chrome浏览器默认css样式的方法

    最近重新用起了ubuntu kylin,然后又碰到之前让我感到有些难受的一个小问题:用chrome浏览部分网页时,一部分粗体字十分难看,就像是宋体直接加粗那样. 之前就觉得这样看起来很难受,但是找到的 ...

  4. 去除冗余 – 精简您的CSS样式代码

    讲讲常见的一些没有必要使用CSS代码情况,而这些不起作用可以去掉的CSS代码可能是我们经常忽视的.越是对CSS理解不够,越容易出现这些问题. 二.一些常见不必要CSS样式 1.与默认CSS样式一致 我 ...

  5. HTML中使用CSS样式（上）

    在每一个标签上都可以设置style属性,这就是CSS样式: <div style="height:48px;border: 1px solid red;text-align:cente ...

  6. CSS 样式分类

    CSS样式可以分为三大类:内联样式.内部样式表和外部样式表 1.内联样式(样式写在html标签里,只对该标签的内容起作用) <span style="color:red;font-si ...

  7. JavaScript --css样式

    1.JavaScript显示隐藏控制 隐藏:display:none; 显示:display:block; 参考链接:https://blog.csdn.net/sleepwalker_1992/ar ...

  8. 详解CSS设置默认字体样式

    浏览器默认的样式往往在不同的浏览器.不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏 ...

  9. 详解CSS网页布局中默认字体样式

    浏览器默认的样式往往在不同的浏览器.不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏 ...

随机推荐

  1. Flume+Kafka+Storm+Redis 大数据在线实时分析

    1.实时处理框架 即从上面的架构中我们可以看出,其由下面的几部分构成: Flume集群 Kafka集群 Storm集群 从构建实时处理系统的角度出发,我们需要做的是,如何让数据在各个不同的集群系统之间 ...

  2. Linux内核模块管理命令

    1.insmod命令 在Linux系统下,insmod命令用于将给定的模块加载到内核中去,Linux系统有许多功能是通过模块的方式,在需要时才载入kernel,这样做可以使kernel较为精简,进而提 ...

  3. 解决wireshark抓包校验和和分片显示异常

    问题描述: 在使用wireshark抓取报文时,发现从10.81.2.92发过来的报文绝大部分标记为异常报文(开启IPv4和TCP checksum) 分析如下报文,发现http报文(即tcp pay ...

  4. [转帖]Kubesphere all-in-one 安装方式.

    All-in-One 模式 对于首次接触 KubeSphere 高级版的用户,想寻找一个最快安装和体验 KubeSphere 高级版核心功能的方式,all-in-one 模式支持一键安装 KubeSp ...

  5. maven 引入qrcode.jar

        mvn install:install-file -Dfile=e:\QRCode.jar -DgroupId=QRCode -DartifactId=QRCode -Dversion=3.0 ...

  6. 面试题(Python)

    面试题 字符串反向输出 s = "给阿姨倒杯卡布奇诺"反向输出S:print(s[::-1]) 面试必问:赋值,浅拷贝,深拷贝 赋值:多个变量指到相同内存浅拷贝中所有的元素,不管第 ...

  7. 『炸弹 线段树优化建图 Tarjan』

    炸弹(SNOI2017) Description 在一条直线上有 N 个炸弹,每个炸弹的坐标是 Xi,爆炸半径是 Ri,当一个炸弹爆炸 时,如果另一个炸弹所在位置 Xj 满足: Xi−Ri≤Xj≤Xi ...

  8. 打印出三位数的水仙花数Python

    水仙花数计算 ‪‬‪‬‪‬‪‬‪‬‮‬‪‬‭‬‪‬‪‬‪‬‪‬‪‬‮‬‪‬‫‬‪‬‪‬‪‬‪‬‪‬‮‬‫‬‪‬‪‬‪‬‪‬‪‬‪‬‮‬‪‬‪‬‪‬‪‬‪‬‪‬‪‬‮‬‪‬‫‬‪‬‪‬‪‬‪‬‪‬‮‬‪ ...

  9. H5+asp.net 微信开发 遇到过的坑

    一.微信授权登录 1. 根据code 获取_access_tokens 2. 根据取到的openid和_access_tokens获取用户信息最神奇的是我用我自己的微信账号测试,一开始还可以取到tok ...

  10. quota - linux磁盘配额管理

    磁盘管理系列 linux磁盘管理系列一:磁盘配额管理   http://www.cnblogs.com/zhaojiedi1992/p/zhaojiedi_linux_040_quota.html l ...