اذهب إلى المحتوى
  • 0

إنشاء form fieldset بواسطة Html Css

Mari Carmen

السؤال

Recommended Posts

  • 0

 يمكن القيام به بسهولة  من خلال وسم  <fieldset>الذي يستخدم  لتجميع العناصر ذات الصلة في نموذج.

و يرسم الوسم <fieldset> مربعًا حول العناصر ذات الصلة. ويستخدم  الوسم  <legend> لتحديد تسمية توضيحية لعنصر <fieldset>.

<!DOCTYPE html>
<html>
<body>

<h1>The fieldset element</h1>

<form action="/action_page.php">
 <fieldset>
  <legend>Personalia:</legend>
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Last name:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <label for="email">Email:</label>
  <input type="email" id="email" name="email"><br><br>
  <label for="birthday">Birthday:</label>
  <input type="date" id="birthday" name="birthday"><br><br>
  <input type="submit" value="Submit">
 </fieldset>
</form>

</body>
</html>

نتيجة  تنفيذ الكود 

 5f9d8238d9b05_3.PNG.c3e09a07719b37c27292c4575e5ba957.PNG

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0

يمكنك إنشاء ذلك عن طريق وضع ul داخل div رئيسي ثم وضع div أخر داخل div الرئيسي وداخله form وهو بطريقة بسيطة وإذا كنت فاهم html4 css2 سوف تكن متفهم الكود شاهد الكود :

كود html :

<div class="col">
	<ul>
    	<li>About us</li>
	<li>About us</li>
        <li>About us</li>
    </ul>
	<div class="cols">
          <form>
              <label for="name">First name:</label>
              <input type="text" id="fname" name="name" value=""><br>
              <label for="name">Last name:</label>
              <input type="text" id="lname" name="name" value=""><br>
              <label for="name">Last name:</label>
              <input type="text" id="lname" name="name" value="">
      	</form>
   	</div>
</div>

كود css :

.col{
  background-color:red;
  padding:45px;
}
.cols{
  background-color: #fff;
  padding: 45px 20px;
}
ul{
  text-align: center;
}
ul li{
  display: inline;
  margin: 40px;
}

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 21 ساعات قال Mari Carmen:

الاطار الي باللون الازرق ؟؟

ممكن توضح ما المقصود بالإطار اللون الازرق ؟

بالنسبة للألوان يمكن التحكم بها بواسطة css خاصية background-color .

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0

49

50

1

<!DOCTYPE html>

2

<html>

3<head>

<title/> تسجيل الدخول <title>

</head>

<body>

<div class="container">

<h2/> تسجيل الدخول <h2>

<form method="POST" action="login.php">

>label for="username"< اسم المستخدم:>/label<

<input type="text" name="username" required> <br> <br>

>label for="password"< كلمة المرور: >/label<

< input type=password" name="password" required> <br>-

>input type="submit" value="د" تسجيل الدخول

</form>

</body>

</html>

 

IMG-20231209-WA0029.jpg

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...