avatar
匿名用户
×
创建一个新的页面
输入页面标题：
目前语音维基上有2062个页面。 在上方输入您想创建的页面名称或单击以下标题之一，即可开始撰写！



语音维基
语音维基 | VoiceWiki
2062页面数
  最近更改

“用户:UN1C0DE”的版本间的差异

小
小
 
（未显示同一用户的23个中间版本）
第1行： 第1行：
−
<section style="display: flex; justify-content: center; margin-bottom: 2rem;">
+
<html>
 +
<div style="display: flex; justify-content: center; margin-bottom: 2rem;">
 
  <p  
 
  <p  
 
   style="
 
   style="
第44行： 第45行：
  
 
  </p>
 
  </p>
−
</section>
+
</div>
  
 
<div>
 
<div>
 
  <p style="text-align: center; margin-bottom: 2rem;">
 
  <p style="text-align: center; margin-bottom: 2rem;">
−
   Visit <a href="http://un1c0de.xyz/">my personal website</a> to find out who I am and what I am doing.
+
   Visit <a href="http://un1c0de.xyz/" target="_blank">my personal website</a> to find out who I am and what I am doing.
 
  </p>
 
  </p>
 
</div>
 
</div>
  
−
<div style="text-align: center;">
+
<style>
−
  <p
+
.rainbow-glow--wrapper {
−
  style="
+
position: relative;
−
  flex: 0 0 auto;
+
width: 8rem;
−
  display: inline-flex;
+
height: 4rem;
−
  justify-content: center;
+
padding: 4px;
−
  align-items: center;
+
box-sizing: border-box;
−
  width: 2em;  
+
}
−
  height: 2em;
+
 
−
  color: #000;
+
.rainbow-glow--gradient {
−
  border-radius: 50%;
+
  overflow: hidden;
−
  background-image: radial-gradient(circle at 12.5% 50%, #ffef00, #b48500);
+
position: absolute;
−
  font-size: 1.5rem;
+
left: 0;
−
  font-weight: bold;
+
top: 0;
−
  text-align: center;
+
width: 100%;
−
  cursor: default;
+
height: 100%;
−
  user-select: none;
+
border-radius: 8px;
−
  transform: rotate(90deg);
+
box-sizing: border-box;
−
  "
+
filter: blur(2px);
−
  >
+
}
−
  :D
+
 
−
  </p>
+
.rainbow-glow--gradient::before {
−
</div>
+
content: " ";
 +
display: block;
 +
width: 200%;
 +
height: 0;
 +
padding-top: 200%;
 +
margin-top: -75%;
 +
margin-left: -50%;
 +
background-image: conic-gradient(#f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00);  
 +
box-sizing: border-box;
 +
animation: rotate 2s infinite linear;
 +
}
 +
 
 +
@keyframes rotate {
 +
0% {
 +
  transform: rotate(0);
 +
}
 +
 
 +
100% {
 +
  transform: rotate(1turn);
 +
}
 +
}
 +
 
 +
.rainbow-glow--content {
 +
position: relative;
 +
z-index: 1;
 +
display: flex;
 +
justify-content: center;
 +
align-items: center;
 +
padding: .5rem 1rem;
 +
width: 100%;
 +
height: 100%;
 +
background-color: #fff;
 +
color: #000;
 +
border: solid 2px #000;
 +
  border-width: 2px 3px 4px;
 +
border-radius: 6px;
 +
  box-sizing: border-box;
 +
}
 +
</style>
 +
</html>
  
−
<section>
+
<div>
 
  <h2>Some effects</h2>
 
  <h2>Some effects</h2>
  
−
  <div style="width: 100%; display: grid; grid-template-columns: 1fr 1fr auto;">
+
  <div style="width: 100%; display: grid; grid-template-columns: 1fr 1fr 100fr; justify-content: center; align-items: center;">
−
   <div>Rainbow Glow</div>
+
   <div style="white-space: nowrap;">Rainbow Glow</div>
  
 
   <div style="display: flex; justify-content: center; margin: 0 2rem;">
 
   <div style="display: flex; justify-content: center; margin: 0 2rem;">
−
   <div class="rainbow-glow--wrapper" style="position: relative; width: 8rem; height: 4rem; padding: 4px; box-sizing: border-box;">
+
   <div class="rainbow-glow--wrapper">
−
     <div  
+
     <div class="rainbow-glow--gradient"></div>
−
    class="rainbow-glow--glow"
+
     <div class="rainbow-glow--content">YOOHOO</div>
−
    style="
 
−
      position: absolute;
 
−
      left: 0;
 
−
      top: 0;
 
−
      width: 100%;
 
−
      height: 100%;
 
−
      border-radius: 8px; 
 
−
      background-image: conic-gradient(#f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00);
 
−
      box-sizing: border-box;
 
−
    "
 
−
    >
 
−
    &nbsp;
 
−
    </div>
 
−
 
 
−
     <div  
 
−
    class="rainbow-glow--content"  
 
−
    style="
 
−
      position: relative;
 
−
      z-index: 1;
 
−
      display: flex;
 
−
      justify-content: center;
 
−
      align-items: center;
 
−
      padding: .5rem 1rem;
 
−
      width: 100%;
 
−
      height: 100%;
 
−
      background-color: #fff;
 
−
      color: #000;
 
−
      border: solid 2px #000;
 
−
      border-width: 2px 3px 4px;
 
−
      border-radius: 6px;
 
−
      box-sizing: border-box;
 
−
    "
 
−
    >
 
−
    YOOHOO
 
−
    </div>
 
 
   </div>
 
   </div>
 
   </div>
 
   </div>
 
    
 
    
 
   <div>
 
   <div>
−
  <ul>
 
−
    <li>The <code>filter</code> property will eliminate inline styles (wish I could use this on the glow layer though)</li>
 
−
  </ul>
 
 
   </div>
 
   </div>
 
  </div>
 
  </div>
−
</section>
+
</div>
  
−
<section>
+
<div>
 
  <h2>CREmoteFixes</h2>
 
  <h2>CREmoteFixes</h2>
  
−
  <section>
+
  <div>
−
   <p>This may fix most of inconsistent vertical alignment and allow better visual effect.</p>
+
   <p>This '''MAY''' fix most of inconsistent vertical alignment and allow better visual effect.</p>
  
 
   <div  
 
   <div  
第148行： 第150行：
 
     color: #000; border-left:  
 
     color: #000; border-left:  
 
     8px solid #f00;
 
     8px solid #f00;
 +
    margin-bottom: 2rem;
 
   "
 
   "
 
   >
 
   >
 
   <div>[[File:Info.png|20px]]</div>
 
   <div>[[File:Info.png|20px]]</div>
−
   <div style="margin-left: .5em;">
+
   <div style="margin-left: .5em;">After testing in CR emoticon pages, this fix isn't quite ideal because icons may either have oversized width, or non-transparent background, etc.</div>
−
    After testing in CR emoticon pages, this fix isn't quite ideal because icons may either have oversized width, or non-transparent background, etc.
 
−
  </div>
 
 
   </div>
 
   </div>
 
    
 
    
−
   <div style="display: flex;">
+
   <div style="display: flex; margin: 0 -1rem -1rem 0;">
−
   <div style="flex: 0 0 auto; height: 120px;">
+
   <div style="flex: 0 0 auto; margin: 0 1rem 1rem 0;">
−
     <div style="display: inline-block; padding: 4px; margin-bottom: 4px; background: linear-gradient(to right bottom, #7AF99B,#D6C499,#F38691); border-radius: 16px;">
+
     <div style="padding: 4px; margin-bottom: 4px; background: linear-gradient(to right bottom, #7AF99B,#D6C499,#F38691); border-radius: 16px;">
 
     <div style="width: 100px; height: 76px; position: relative;">
 
     <div style="width: 100px; height: 76px; position: relative;">
 
       <div style="position: absolute; bottom: 0;">[[File:CR_Emote_Dagger_Goblin.png|100px]]</div>
 
       <div style="position: absolute; bottom: 0;">[[File:CR_Emote_Dagger_Goblin.png|100px]]</div>
 
     </div>
 
     </div>
 
     </div>
 
     </div>
−
     {{AudioButton|CR_Emote_Dagger_Goblin.mp3}}
+
     <div style="text-align: center;">{{AudioButton|CR_Emote_Dagger_Goblin.mp3}}</div>
 
   </div>
 
   </div>
  
−
   <div style="flex: 0 0 auto; height: 120px;">
+
   <div style="flex: 0 0 auto; margin: 0 1rem 1rem 0;">
−
     <div style="display: inline-block; padding: 4px; margin-bottom: 4px; background: linear-gradient(to right bottom, #7AF99B,#D6C499,#F38691); border-radius: 16px;">
+
     <div style="padding: 4px; margin-bottom: 4px; background: linear-gradient(to right bottom, #7AF99B,#D6C499,#F38691); border-radius: 16px;">
 
     <div style="width: 100px; height: 76px; position: relative;">
 
     <div style="width: 100px; height: 76px; position: relative;">
 
       <div style="position: absolute; bottom: 0;">[[File:CR_Emote_Thumbs-Up_Princess.png|100px]]</div>
 
       <div style="position: absolute; bottom: 0;">[[File:CR_Emote_Thumbs-Up_Princess.png|100px]]</div>
 
     </div>
 
     </div>
 
     </div>
 
     </div>
−
     {{AudioButton|CR_Emote_Thumbs-Up_Princess.mp3}}
+
     <div style="text-align: center;">{{AudioButton|CR_Emote_Thumbs-Up_Princess.mp3}}</div>
 
   </div>
 
   </div>
  
−
   <div style="flex: 0 0 auto; height: 120px;">
+
   <div style="flex: 0 0 auto; margin: 0 1rem 1rem 0;">
−
     <div style="display: inline-block; padding: 4px; margin-bottom: 4px; background: #fff; border-radius: 16px;">
+
     <div style="padding: 4px; margin-bottom: 4px; background: #fff; border-radius: 16px;">
 
     <div style="width: 100px; height: 76px; position: relative;">
 
     <div style="width: 100px; height: 76px; position: relative;">
 
       <div style="position: absolute; bottom: 0;">[[File:CR_Emote_Rocket_Hoggy.png|100px]]</div>
 
       <div style="position: absolute; bottom: 0;">[[File:CR_Emote_Rocket_Hoggy.png|100px]]</div>
 
     </div>
 
     </div>
 
     </div>
 
     </div>
−
     {{AudioButton|CR_Emote_Rocket_Hoggy.mp3}}
+
     <div style="text-align: center;">{{AudioButton|CR_Emote_Rocket_Hoggy.mp3}}</div>
 
   </div>
 
   </div>
 
   </div>
 
   </div>
−
  </section>
+
  </div>
−
</section>
+
</div>
−
</html>
+
 
 +
<div style="margin-top: 2rem;">
 +
<comments />
 +
</div>

2021年4月13日 (二) 16:45的最新版本

/ / b. / *#V .i A .##. _..-#] A .#. .# *#. ___________ ..-=########7 i#. %## ;#' q#. `^----=######=############7 b ;###. O###T 4 ;7 9#. 'q####P^*'` "'` ##- ##### ;#### .## -=A ;# .###. ##:"` ### ;##`##; J### -###7 .=##%} .-=..#: ;#`##. .##' _.--==- .##; ##7 |## .### _-##### .#####= @#######7 :#7 ##o d## .-=######7 ;## ;##` ###. ;##" -+=^*`##: .####* &#** ;##. ##: `###. .###$P^*"` " ##; ##: #### $#: ##7 .### ## #^##. ;##' ####. :##` .## ;## ##$#; ##' ;## .##P ## #7 `##. ### =###-### .. ;#7 d#: .#7?## :#7 ##7 .##P ## ;# >#k> ### ... `#####7 ..--==######=-._ ## .-=##' ;#' $#./#: %## &#$ .=A ## .##+=euG; d################' .-=################H. ;##=###### ## ?#L## ###* *###v==###=##7 ##########7.##################.-#####$P^*"'` `*^V* @###=^` t# .#7 ###: <@##; `##########/ *$^#` `>#####^*"` `*#########*` *#° Y d#' :##: *V *" ' #7 .###*` B#####P* .## K^` ## 4$*` *@##* ##: .# .$ `V* z@# /7 7 *# # 7 ;7 !

Visit my personal website to find out who I am and what I am doing.

Some effects

Rainbow Glow
YOOHOO

CREmoteFixes

This MAY fix most of inconsistent vertical alignment and allow better visual effect.

Info.png
After testing in CR emoticon pages, this fix isn't quite ideal because icons may either have oversized width, or non-transparent background, etc.

您未被允许发表评论。


取自“https://voicewiki.cn/w/index.php?title=用户:UN1C0DE&oldid=26544”