WEBLEB
होम
संपादक
लॉग इन करें
Pro
हिंदी
English
Français
Español
Português
Deutsch
Italiano
हिंदी
मौजूद रहने के लिए स्क्रॉल करें
696
byby.createsite
संपादक में खोलें
अपना कोड प्रकाशित करें
अनुशंसित
12 December 2025
टेलविंड सीएसएस और जीएसएपी का उपयोग करके बनाई गई सिनेमाई पोर्टफोलियो वेबसाइट
29 July 2025
ब्रांडिंग और मार्केटिंग के साथ कंपनी कार्ड सूची
28 May 2025
स्क्रॉल खोलना
HTML
Copy
Informações
{/* Mais informações */}
CSS
Copy
* { margin: 0; padding: 0; box-sizing: border-box; } body { background-color: #000; display: flex; align-items: center; justify-content: center; height: 100vh; overflow: hidden; } .codigo { position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: #272822; color: #F8F8F2; font-family: 'Consolas', 'Monaco', monospace; font-size: 18px; padding: 20px; border-radius: 8px; white-space: pre-line; text-align: left; line-height: 1.6; max-height: 50%; width: 100%; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); } .selector { color: #F92672; } .property { color: #66D9EF; } .value-number { color: #AE81FF; } .value-string { color: #E6DB74; } .value-color { color: #A6E22E; } .brace { color: #F8F8F2; } .comment { color: #75715E; } .function { color: #A6E22E; } .animation-container { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; width: 100%; height: 50%; overflow: hidden; background-color: #000; } /* Animação: Infinito Loop deautant informação*/ .scroll { width: 200px; height: 200px; background-color: rgba(255, 255, 255, 0.1); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); animation: scroll_loop 3s linear infinite; } @keyframes scroll_loop { 0% { transform: translateX(0) rotateX(0deg);} 100% { transform: translateX(-200px) rotateX(180deg);} } .text-container { position: relative; width: 100%; height: 100%; } .info-box { position: absolute; background-color: rgba(255, 255, 255, 0.2); color: #fff; padding: 10px; text-shadow: 0 0 5px rgba(0, 0, 0, 0.5); /* Animações individualsas das informações */ } /* Este é um exemplo simples de animações camadadas que se alinham com o conceito de intoxicação por informações." */
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */