Advertisement
wiring

Anki Sample CSS Styling

Jul 5th, 2013
930
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. @font-face {
  2.   font-family: mplus;
  3.   src: url('mplus-1mn-regular.ttf');
  4. }
  5. .none {
  6.   display: none;
  7.   font-size: 0;
  8.   height: 0px;
  9. }
  10. .card {
  11.  font-family: "mplus", arial;
  12.  font-size: 20px;
  13.  text-align: center;
  14.  color: #fff;
  15.  background: url("yourimagehere.png");
  16. }
  17. hr {
  18.   border: 0;
  19.   color: transparent;
  20.   background-color: transparent;
  21.   border-top: 1px dotted #fff;
  22. }
  23. .container {
  24.   margin: 0 0 1em;
  25.   padding: .75em;
  26.   background: #768ca3;
  27.   opacity: 0.95;
  28.   border-radius: 5px;
  29.   overflow: hidden;
  30. }
  31. #keyword {
  32.   padding: 2.75em .75em .75em;
  33. }
  34. #expression {
  35.   position: absolute;
  36.   top: 10px;
  37.   left: 0;
  38.   background: #e1c388;
  39.   font-weight: bold;
  40.   padding: .5em;
  41.   border-radius: 0px 7px 7px 0px;
  42.   color: #fff;
  43.   float: left;
  44.   margin: 0 .5em 0 0;
  45. }
  46. #usage {
  47.   font-size: 12px;
  48.   padding: 0;
  49. }
  50. #meaning table {
  51.   width: 100%;
  52. }
  53. #meaning th,
  54. #meaning td {
  55.   color: #fff;
  56.   width: 50%;
  57. }
  58. #meaning td {
  59.   font-size: 14px;
  60.   vertical-align: top;
  61. }
  62. #example {
  63.   font-size: 14px;
  64.   padding: 1.5em 1em 1.5em;
  65. }
  66. #example .jp {
  67.   font-size: 18px;
  68. }
  69. #example i {
  70.   color: #e1c388;
  71. }
  72. #example b {
  73.   color: #f67273;
  74. }
  75. #jp-meaning,
  76. #en-meaning {
  77.   padding: .75em 4em .75em .75em;
  78. }
  79. #jp-meaning h3,
  80. #en-meaning h3 {
  81.   position: absolute;
  82.   margin-top: -20px;
  83.   right: 0;
  84.   z-index: 5;
  85.   background: #e1c388;
  86.   padding: 10px 10px 7px;
  87.   border-radius: 7px 0px 0px 7px;
  88. }
  89.  
  90. .jp { }
  91. .win .jp { font-family: "Meiryo"; }
  92. .mac .jp { font-family: "mplus", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro"; }
  93. .linux .jp { font-family: "Kochi Mincho", "東風明朝"; }
  94. .mobile .jp { font-family: "Hiragino Mincho ProN"; }
Advertisement
Advertisement
Advertisement
RAW Paste Data Copied
Advertisement