zoukankan      html  css  js  c++  java
  • wordpress默认css样式class和id集合

      你是否想过如何设计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/

  • 相关阅读:
    Matlab/Simulink仿真中如何将Scope转化为Figure?
    圆形Camera预览实现
    [转]自定义Drawable实现灵动的红鲤鱼动画(下篇)
    [转]自定义Drawable实现灵动的红鲤鱼动画(上篇)
    EventBus源码分析
    Camera 预览变形问题解决
    使用javacv录像,同时进行讯飞声纹认证
    Camera2必知必会
    Flutter混合工程改造实践
    讯飞语音唤醒SDK集成流程
  • 原文地址:https://www.cnblogs.com/ytkah/p/11214921.html
Copyright © 2011-2022 走看看