Toggle navigation
☰
HTML
CSS
Scripting
Database
<!DOCTYPE html> <html> <head> <style> body { background-image: url('/pix/samples/24l.jpg'); background-size: cover; font-family: Arial, sans-serif; display: flex; justify-content: center; align-items: center; height: 300px; } .overlay { /* Red at 40% transparency */ background-color: rgba(255 0 0 / 0.4); padding: 50px; color: white; font-weight: bold; font-size: 20px; border-radius: 10px; text-align: center; } </style> </head> <body> <div class="overlay"> This background is 40% transparent.<br> But the text remains fully opaque! </div> </body> </html>
