模块:Infobox/styles.css

/* Infobox template styles
 * Infobox 模板样式
*/

/* Common styles
 * 通用样式 */

.infobox {
  float: right;
  clear: right;
  max-width: 22em;
  width: 100%;
  overflow-x: auto;
  margin: 0.5em 0 0.5em 1em;
  border: 1px solid #a2a9b1;
  border-spacing: 3px;
  padding: 0.2em;
  background-color: #f8f9fa;
  font-size: 0.875em;
  line-height: 1.5em;
  color: black;
}

.infobox-header,
.infobox-label,
.infobox-above,
.infobox-full-data,
.infobox-data,
.infobox-below,
.infobox-subheader,
.infobox-image,
.infobox-navbar {
  vertical-align: top;
}

.infobox-above,
.infobox-title {
  text-align: center;
  font-size: 1.25em;
  font-weight: bold;
}

.infobox-title {
  padding: 0.2em;
}

.infobox-header,
.infobox-subheader,
.infobox-image,
.infobox-full-data,
.infobox-below {
  text-align: center;
}

.infobox-label,
.infobox-data {
  text-align: left;
}

.infobox-navbar {
  text-align: right;
}

/*
 * not strictly certain these styles are necessary since the modules now
 * exclusively output infobox-subbox or infobox, not both
 * just replicating the module faithfully
*/
.infobox-subbox {
  float: none;
  clear: none;
  padding: 0;
  border: none;
  margin: -3px;
  width: auto;
  min-width: 100%;
  font-size: 1em;
  background-color: transparent;
}

/* Minerva Neue skin styles
 * Minerva Neue 皮肤样式 */

body.skin-minerva .infobox {
  display: flex;
  flex-flow: column nowrap;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 2em;
  border: 1px solid #eaecf0;
  font-size: 0.9em;
}

body.skin-minerva .infobox > tbody,
body.skin-minerva .infobox > caption {
  display: flex;
  flex-flow: column nowrap;
}
body.skin-minerva .infobox > tbody > tr {
  display: flex;
  flex-flow: row nowrap;
  width: 100%;
}

body.skin-minerva .infobox-above,
body.skin-minerva .infobox-title {
  font-size: 1em;
}

body.skin-minerva .infobox-title {
  padding: 10px 10px 0;
  text-align: center;
}

body.skin-minerva .infobox-header,
body.skin-minerva .infobox-label,
body.skin-minerva .infobox-above,
body.skin-minerva .infobox-full-data,
body.skin-minerva .infobox-data,
body.skin-minerva .infobox-below,
body.skin-minerva .infobox-subheader,
body.skin-minerva .infobox-image,
body.skin-minerva .infobox-navbar {
  flex: 1 0 0;
  border: none;
  border-bottom: 1px solid #eaecf0;
  padding: 7px 10px;
  vertical-align: top;
}

body.skin-minerva .infobox tr:last-child td,
body.skin-minerva .infobox tr:last-child th {
  border-bottom: none;
}

/* Resposive styles
 * 响应式样式 */

@media screen and (max-width: 767px) {
  .infobox {
    float: none;
    max-width: inherit;
    margin-left: 0;
  }
}