Messaggio anonimo

Apri nell'Editor Pubblica il Tuo Codice

Consigliato

13 June 2025

Contenitore di frammenti di animazione CSS

23 May 2025

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Anonymous Feedback</title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-qYLNnb4CKwxpVjsBtRYxR8Y8HL7IjaQKsG5DCt6P6k1BzQ+w5Yd2aSUWxlhAmeE" crossorigin="anonymous">
  <style>
     body {
            font-family: 'Arial', sans-serif;
            background-color: #f0f4f8;
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }
        .container {
            background-color: #ffffff;
            border-radius: 10px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            padding: 20px;
            width: 90%;
            max-width: 400px;
            text-align: center;
        }
        .header {
            font-size: 24px;
            font-weight: bold;
            margin-bottom: 20px;
            color: #333333;
        }
        .message-box {
            width: 100%;
            padding: 10px;
            border: 1px solid #cccccc;
            border-radius: 5px;
            margin-bottom: 20px;
            resize: none;
            height: 150px;
            font-size: 16px;
            box-sizing:border-box;
        }
        .send-button {
            background-color: #4CAF50;
            color: white;
            padding: 10px 20px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            font-size: 16px;
        }
        .send-button:hover {
            background-color: #45a049;
        }
  </style>
</head>
<body>
  <form action="https://formspree.io/f/mpwzedpw" id="feedback-form" method="POST">
    <div class="container my-5">
      
      <header class="text-center mb-4">
        <h2>IT'S ALMOST NEW YEAR????<br>SEND ME ANONYMOUS MESSAGES</h2>
        <p>Share your thoughts about me anonymously. Your feedback will help me improve!</p>
      </header>

<div class="card p-4">
        <div class="form-group">
          <textarea id="feedback-input" name="message" class="message-box" rows="4" placeholder="Write your message here...">

Message developer!

Messaggio anonimo

Consigliato

Effetto hovering sulla mappa

Contenitore di frammenti di animazione CSS

Accesso con carta

HTML

CSS

JS

Consigliato

Effetto hovering sulla mappa

Contenitore di frammenti di animazione CSS

Accesso con carta

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS