Advertisement
powys

yui crd emebed~!

Jul 5th, 2021 (edited)
4,968
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.64 KB | None
  1. <!--
  2.  
  3. __
  4. d888b
  5. 888888b
  6. 8888888
  7. 8888888
  8. 8888888
  9. _ 8888888
  10. ,d88 8888888
  11. ____ d88' _,, 888888'
  12. (8888\ 88' d888) Y8888P
  13. ___~~8 ~8 88~___ d8888
  14. _______ ,8888888 ~ 888888_8888
  15. ,8888888888===__ _,d88P~~ ~~Y88888'
  16. 88888888888888888888888' `88b
  17. 8888888888888888888888P Y88
  18. `~888888888888~~~~~ 88 88
  19. ~~~~~~~~ 88 88
  20. 88 88
  21. 88 88
  22. 88 88
  23. 88 ,aa. ,aa. 88
  24. 88 d88b d88b 88
  25. ,=88 Y88P Y88P 88=,
  26. ,d88P' `' _aa_ `' `Y88b, ___
  27. 88P' (8888) `Y88 ad88888b
  28. 88 ~^^~ 88 d88Y~~"Y8b
  29. _______"Yb._ _.d8"d8Y 88
  30. ______,d88888888ba888=,.______________________.,=8888~d88_______88___
  31. |~~~~~~88P~~~~~~Y88~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
  32. | 88 88 |
  33. | 88 88 |
  34. | 88ba,___,d8P MADE |
  35. | "888888888 by |
  36. | ~~~~~~ ¡ciarispop! |
  37. | http://twitter.com/ciarispop/ |
  38. | credit appreciated |
  39. |_____________________________________________________________________|
  40. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  41.  
  42. -->
  43.  
  44.  
  45.  
  46. <head>
  47. <!--if you add a font of google fonts, add it here! -->
  48.  
  49. <link rel="preconnect" href="https://fonts.gstatic.com">
  50. <link href="https://fonts.googleapis.com/css2?family=Quicksand:wght@400;600&display=swap" rel="stylesheet">
  51. </head>
  52.  
  53.  
  54.  
  55. <!-- CSS -->
  56.  
  57.  
  58. <style>
  59. .main {
  60. /* do not modify this! */
  61.  
  62. height: 220px;
  63. width: 100%;
  64. padding:10px;
  65.  
  66. /* border & bg only modify this!*/
  67. background: white;
  68. border-width:7px;
  69. border-style:solid;
  70. border-image: url("https://media.discordapp.net/attachments/826854899013648384/839700444375810078/tumblr_inline_o98n9dbCl61u2r0ws_540_1_2.png") 8 fill round;
  71.  
  72. /* do not modify this! */
  73. overflow: hidden;
  74. transition: 0.5s;
  75.  
  76. }
  77.  
  78. .main .activator {
  79. /* do not modify this! */
  80. height: 220px;
  81. width: 100%;
  82. float: left;
  83. display: block;
  84. transition: 0.5s;
  85. }
  86.  
  87.  
  88. .img {
  89. /* CSS of your image! i'd recommend you don't modify this */
  90. text-align: center;
  91. height: 180px;
  92. width: 100%;
  93. object-fit: cover;
  94. float: left;
  95. margin-bottom: 10px;
  96. transition: 0.5s;
  97.  
  98. }
  99. .content {
  100. /* do not modify this! */
  101. display: none;
  102. margin-top: 15px;
  103. transition: 0.5s;
  104.  
  105. }
  106. .main:hover {
  107. /* CSS of the height after you hover it! i'd recommend you don't modify this */
  108. height: 325px;
  109. transition: 0.5s;
  110.  
  111. }
  112. .main:hover .content {
  113. /* do not modify this! */
  114. display: block;
  115. white-space: normal;
  116. height: 350px;
  117. transition: 0.5s;
  118. }
  119. .activator:hover .img {
  120. /* do not modify this! */
  121. float: left;
  122. }
  123.  
  124. #scroller {
  125. /* CSS of the scroll box ! (text) */
  126.  
  127.  
  128. width: 100%;
  129. margin-top: 10px;
  130.  
  131. /* THINGS THAT YOU CAN MODIFY */
  132.  
  133. /* you can change the font here */
  134. font-family: 'Quicksand', sans-serif;
  135. /* you can change the font size here */
  136. font-size: 70%;
  137. /* you can change the color of the font here */
  138. color: black;
  139.  
  140. /* ------ */
  141.  
  142. padding: 5px;
  143. transition: 0.5s;
  144. overflow: scroll;
  145. height:100px;
  146.  
  147. }
  148. </style>
  149.  
  150. <!-- HTML -->
  151.  
  152. <div class='main'>
  153. <div class='activator'>
  154.  
  155.  
  156. <!-- add the link of your image here -->
  157.  
  158. <img class=img src="https://64.media.tumblr.com/af0ba9cfc8ec4fce0371acc3f2a5fb5d/8c436493c1c20170-f4/s540x810/b408af581d440ddc4b72833f25095f4b1b926bef.jpg">
  159.  
  160. <div class="content">
  161. <div id="scroller">
  162. <div align=left>
  163.  
  164. <!--here goes your text of the scrollbox!!! -->
  165.  
  166.  
  167. your <strong> info </strong> goes here ~!
  168.  
  169.  
  170. </div>
  171. </div>
  172.  
  173. </div>
  174. </div>
  175. </div>
Advertisement
RAW Paste Data Copied
Advertisement