¿Cuáles son las etiquetas estándar de ID/clases CSS para el admin?
¿Existe una lista de IDs/clases CSS de WordPress que pueda usar para construir pantallas de opciones de plugins que se vean y se sientan más como una página normal de opciones de WordPress? He encontrado algunas por casualidad pero habría sido bueno tener una lista.
Un ejemplo es esta clase: button-primary Que hace que un botón se vea así:
Estamos trabajando en actualizar http://dotorgstyleguide.wordpress.com/ para incluir más de esta información y reflejar las actualizaciones de estilo de la versión 3.2.
Aparte de eso, he visto un plugin (que actualmente no puedo localizar) que muestra una especie de página de demostración con los diferentes selectores CSS y su apariencia, pero creo que estaba desactualizado. Fuera de eso, tu mejor opción por ahora podría ser simplemente abrir Firebug/Web Inspector y echar un vistazo a wp-admin/css/wp-admin.dev.css.

gracias, he usado la solución firebug en algunas pequeñas cosas que he hecho hasta ahora. Funciona bien, pero preferiría algo más parecido a los dos ejemplos de lista que obtuve de ti y de @bultge :) ¡gracias!

Instala este plugin y podrás ver todos los elementos, clases e IDs https://github.com/bueltge/WordPress-Admin-Style

Nota: Para el lado del Frontend - Aquí está la lista que he extraído después de mucha investigación y desarrollo en los estilos CSS predeterminados de WordPress. Hice mi mejor esfuerzo para investigar todo y organizarlo de la manera más precisa posible. Si ves algo que falta o incompleto, por favor escríbelo en los comentarios. Espero que te ayude a desarrollar tus plugins y temas deseados.
/* Estilos del Editor WYSIWYG de WP */
.entry-content img {
margin: 0 0 1.5em 0;
}
.alignleft, img.alignleft {
margin-right: 1.5em;
display: inline;
float: left;
}
.alignright, img.alignright {
margin-left: 1.5em;
display: inline;
float: right;
}
.aligncenter, img.aligncenter {
margin-right: auto;
margin-left: auto;
display: block;
clear: both;
}
.alignnone, img.alignnone {}
.wp-caption {
margin-bottom: 1.5em;
text-align: center;
padding-top: 5px;
}
.wp-caption img {
border: 0 none;
padding: 0;
margin: 0;
}
.wp-caption p.wp-caption-text {
line-height: 1.5;
font-size: 10px;
margin: 0;
}
.wp-smiley {
margin: 0 !important;
max-height: 1em;
}
blockquote.left {
margin-right: 20px;
text-align: right;
margin-left: 0;
width: 33%;
float: left;
}
blockquote.right {
margin-left: 20px;
text-align: left;
margin-right: 0;
width: 33%;
float: right;
}
.gallery dl {}
.gallery dt {}
.gallery dd {}
.gallery dl a {}
.gallery dl img {}
.gallery-caption {}
.size-full {}
.size-large {}
.size-medium {}
.size-thumbnail {}
/* CSS de WP - Estilos varios */
/* enlaces de categorías */
li.categories {}
li.cat-item {}
li.cat-item-{id} {}
li.current-cat {}
li.current-cat-parent {}
ul.children {}
/* enlaces de blogroll */
.linkcat {}
.blogroll {}
/* enlaces de leer más */
.more-link {}
/* CSS de WP - Listados de páginas */
.pagenav {} /* elemento de lista más externo */
.page_item {} /* cualquier elemento de página */
.page-item-{id} {} /* ID específico de página */
.current_page_item {} /* página actual */
.current_page_parent {} /* padre de la página actual */
.current_page_ancestor {} /* cualquier ancestro de la página actual */
.pagenav ul,
.pagenav .current_page_item ul,
.pagenav .current_page_ancestor ul,
.pagenav .current_page_ancestor .current_page_item ul,
.pagenav .current_page_ancestor .current_page_ancestor ul,
.pagenav .current_page_ancestor .current_page_ancestor .current_page_item ul,
.pagenav .current_page_ancestor .current_page_ancestor .current_page_ancestor ul {}
.pagenav ul ul,
.pagenav .current_page_item ul ul,
.pagenav .current_page_ancestor ul ul,
.pagenav .current_page_ancestor .current_page_item ul ul,
.pagenav .current_page_ancestor .current_page_ancestor ul ul {}
.pagenav .current_page_ancestor .current_page_ancestor .current_page_item ul ul,
.pagenav .current_page_ancestor .current_page_ancestor .current_page_ancestor ul ul {}
/* CSS de WP - Widgets predeterminados de WordPress */
.widget {}
/* widget de enlaces */
.widget_links {}
.widget_links ul {}
.widget_links ul li {}
.widget_links ul li a {}
/* widget meta */
.widget_meta {}
.widget_meta ul {}
.widget_meta ul li {}
.widget_meta ul li a {}
/* widget de páginas */
.widget_pages {}
.widget_pages ul {}
.widget_pages ul li {}
.widget_pages ul li a {}
/* widget de entradas recientes */
.widget_recent_entries {}
.widget_recent_entries ul {}
.widget_recent_entries ul li {}
.widget_recent_entries ul li a {}
/* widget de archivos */
.widget_archive {}
.widget_archive ul {}
.widget_archive ul li {}
.widget_archive ul li a {}
.widget_archive select {}
.widget_archive option {}
/* widget de nube de etiquetas */
.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 de calendario */
.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 de categorías */
.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 {}
/* widget de comentarios recientes */
.recentcomments {}
#recentcomments {}
#recentcomments li {}
#recentcomments li a {}
.widget_recent_comments {}
/* widget de búsqueda */
#searchform {}
.widget_search {}
.screen-reader-text {}
/* widget de texto */
.textwidget {}
.widget_text {}
.textwidget p {}
/* CSS de WP - Estilos de comentarios */
.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 {}
/* CSS de WP - body_class() */
.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) {}
/* CSS de WP - post_class() */
.post-id {}
.post {}
.page {}
.attachment {}
.sticky {}
.hentry {}
.category-misc {}
.category-example {}
.tag-news {}
.tag-wordpress {}
.tag-markup {}

realmente no entiendo tu lista, ¿es esta una lista de los id/clases vacíos para que pueda personalizar el estilo CSS de WordPress yo mismo?

El backend de WordPress sí genera clases para el "body". Nunca he visto esto documentado explícitamente (aunque bien podría habérmelo pasado por alto). Puedes verlas y cómo se generan en el código fuente de admin-header.php
.
Las clases generadas son muy similares a las del front-end:
<body class="wp-admin no-js upload-php admin-bar branch-3-3 version-3-3-1 admin-color-fresh">

Llegué a esta pregunta porque estaba creando una página de administración personalizada usando add_menu_page(). Vas a querer poner tu contenido entre
<div class = "wrap">Tu contenido.</div>
Esto activará el CSS estándar del backend de administración de WordPress para que tu página de administración personalizada se vea normal. Otros divs serían manejados automáticamente por WordPress en este caso.
class AdminScreen{
public function __construct(){
add_action( 'admin_menu', array( $this, 'doAddMenuPage' ) );
}
public function doAddMenuPage(){
add_menu_page( "AdminScreen", "AdminScreen", 'edit_others_pages', 'AdminScreen', array($this, 'echoAdminPage') );
}
public function echoAdminPage(){
//Imprime el HTML en el buffer de salida:
echo '<div class = "wrap"><h1 class = "wp-heading-inline">¡Esto se ve bien, finalmente!</h1></div>';
}
}

Aquí hay otro artículo interesante que hace un buen trabajo al listar todas las clases CSS/marcado HTML disponibles que se pueden usar para estilizar una página de administración. El artículo está un poco desactualizado ya que muestra resultados de estilos de versiones antiguas de WordPress, por lo que es probable que se hayan añadido clases adicionales desde entonces.
Otro recurso útil son los dashicons de WordPress.
Sin embargo, debo felicitar a @bueltge por su excelente plugin que aparece a continuación, el cual hace un gran trabajo al mantener una referencia actualizada de los estilos de administración.
