CSS ile bir form düzenleme işlemi yapma

Yazarı:

CSS (Cascading Style Sheets), web sayfalarında biçimlendirme ve tasarım işlemlerini yapmak için kullanılan bir dil olduğundan, CSS ile bir form düzenleme yapmak mümkündür. Örneğin, aşağıdaki HTML ve CSS kodları ile bir form düzenleme yapabilirsiniz:

<!-- HTML kodu -->
<form>
  <label for="name">İsim:</label><br>
  <input type="text" id="name"><br>
  <label for="email">E-posta:</label><br>
  <input type="email" id="email"><br>
  <label for="message">Mesaj:</label><br>
  <textarea id="message" rows="5"></textarea><br>
  <input type="submit" value="Gönder">
</form>

/* CSS kodu */
form {
  padding: 20px;
  border: 1px solid black;
  width: 300px;
}

label, input[type="text"], input[type="email"], textarea {
  display: block;
  margin-bottom: 10px;
  width: 100%;
}

input[type="submit"] {
  padding: 10px;
  width: 100%;
}

Bu kod, bir <form> elementi içinde bir <label>, iki <input type="text">, bir <input type="email">, bir <textarea> ve bir <input type="submit"> elementi oluşturur. CSS kodu, form elementine bir kenarlık ekler, gerekli elemanların genişliklerini ve boşlukları ayarlar ve gönder düğmesine bir padding ekler. Bu sayede, form düzenlenmiş bir şekilde gösterilir. Eğer belirtilen formu daha fazla özelleştirmek isterseniz, CSS ile daha fazla seçenek kullanabilirsiniz.

Yorum yapın