يجب أن تكون وسوم HTML متداخلة بالترتيب الصحيح. بحيث يتم إغلاقها بالترتيب العكسي لفتحها ، اي أنه يجب إغلاق اخر وسم تم فتحه أولاً.
مثال
مثال
كتابة التعليقات في HTML
عادة ما تضاف التعليقات بهدف جعل الكود أسهل للفهم. مما قد يساعد المطور الآخر (أو أنت في المستقبل عندما تقوم بتحرير الكود المصدري) على فهم ما كنت تحاول القيام به عند كتابة كود صفحة الويب.وهنا يجب ان نأكد على انه لا يتم عرض التعليقات في متصفح الويب وانما توجد فقط في الكود المصدري.
يبدأ تعليق HTML بـ <!-- ، وينتهي بـ --> (من اليسار إلى اليمين) ، كما هو موضح في المثال أدناه:
مثال
عادة ما تضاف التعليقات بهدف جعل الكود أسهل للفهم. مما قد يساعد المطور الآخر (أو أنت في المستقبل عندما تقوم بتحرير الكود المصدري) على فهم ما كنت تحاول القيام به عند كتابة كود صفحة الويب.وهنا يجب ان نأكد على انه لا يتم عرض التعليقات في متصفح الويب وانما توجد فقط في الكود المصدري.
يبدأ تعليق HTML بـ <!-- ، وينتهي بـ --> (من اليسار إلى اليمين) ، كما هو موضح في المثال أدناه:
مثال
يمكننا أيضًا جعل التعليق حول عنصر او اكثر من عناصر لغة HTML لغرض تصحيح الأخطاء ، كما هو موضح بالمثال التالي :
مثال
مثال
ما هي السمات (Attributes)؟
تحدد السمات (Attributes) خصائص إضافية مثل عرض الصورة وارتفاعها. توضع السمات دائمًا في وسم البدء (أو وسم الفتح) < > وعادة ما تكون على شكل أزواج اسم و قيمة وتكتب بالشكل التالي : name = "value". يجب دائمًا إحاطة قيم السمات بعلامات اقتباس.
أيضا ، بعض السمات َضرورية لعمل عناصر معينة. على سبيل المثال ، يجب أن يحتوي الوسم<img> على سمات src و alt
دعنا نلقي نظرة على بعض الأمثلة على استخدامات السمات:
مثال
تحدد السمات (Attributes) خصائص إضافية مثل عرض الصورة وارتفاعها. توضع السمات دائمًا في وسم البدء (أو وسم الفتح) < > وعادة ما تكون على شكل أزواج اسم و قيمة وتكتب بالشكل التالي : name = "value". يجب دائمًا إحاطة قيم السمات بعلامات اقتباس.
أيضا ، بعض السمات َضرورية لعمل عناصر معينة. على سبيل المثال ، يجب أن يحتوي الوسم<img> على سمات src و alt
دعنا نلقي نظرة على بعض الأمثلة على استخدامات السمات:
مثال
في المثال أعلاه src داخل الوسم <img> هو سمة (Attributes)ومسار الصورة المقدمة هو قيمة السمة (value).
ايضا href داخل الوسم <a> هي سمة (Attributes) والرابط المقدم هو قيمته (value)، وهكذا.
ايضا href داخل الوسم <a> هي سمة (Attributes) والرابط المقدم هو قيمته (value)، وهكذا.
لبرمجة بداية صفحة ال HTML
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
نريد أن نعمل كود لموقع بسيط
أول شي نفتح محرر أكواد حتى نكتب أكواد بسهولة
Windows: visual studio code
Android: trbe edit
أول شي نفتح محرر أكواد حتى نكتب أكواد بسهولة
Windows: visual studio code
Android: trbe edit
نريد أن نعمل كود برمجه يشمل موقع تسجيل الدخول
بأكواد لغة برمجة : HTML &PHP
HTML
PHP
بأكواد لغة برمجة : HTML &PHP
HTML
<!DOCTYPE html>
<html lang="ar">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>تسجيل الدخول</title>
</head>
<body>
<h2>تسجيل الدخول</h2>
<form action="login.php" method="post">
<label for="username">اسم المستخدم:</label><br>
<input type="text" id="username" name="username" required><br><br>
<label for="password">كلمة المرور:</label><br>
<input type="password" id="password" name="password" required><br><br>
<input type="submit" value="تسجيل الدخول">
</form>
</body>
</html>PHP
<?php
// كود للتأكد من وجود بيانات تم إدخالها
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$username = $_POST['username'];
$password = $_POST['password'];
// هنا يمكنك إضافة كود للتحقق من بيانات المستخدم من قاعدة بيانات أو مصفوفة
// كمثال بسيط:
$valid_username = "admin";
$valid_password = "password"; // تأكد من تغيير كلمة المرور
if ($username === $valid_username && $password === $valid_password) {
echo "مرحبًا بك، " . htmlspecialchars($username) . "!";
} else {
echo "اسم المستخدم أو كلمة المرور غير صحيحة.";
}
}
?>نريد أن نعمل كود برمجه يشمل موقع تسجيل الدخول
بأكواد لغة برمجة : HTML &PHP
بأكواد لغة برمجة : HTML &PHP
HTML
<!DOCTYPE html>
<html lang="ar">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>تسجيل الدخول</title>
</head>
<body>
<h2>تسجيل الدخول</h2>
<form action="login.php" method="post">
<label for="username">اسم المستخدم:</label><br>
<input type="text" id="username" name="username" required><br><br>
<label for="password">كلمة المرور:</label><br>
<input type="password" id="password" name="password" required><br><br>
<input type="submit" value="تسجيل الدخول">
</form>
</body>
</html>PHP
<?php
// كود للتأكد من وجود بيانات تم إدخالها
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$username = $_POST['username'];
$password = $_POST['password'];
// هنا يمكنك إضافة كود للتحقق من بيانات المستخدم من قاعدة بيانات أو مصفوفة
// كمثال بسيط:
$valid_username = "admin";
$valid_password = "password"; // تأكد من تغيير كلمة المرور
if ($username === $valid_username && $password === $valid_password) {
echo "مرحبًا بك، " . htmlspecialchars($username) . "!";
} else {
echo "اسم المستخدم أو كلمة المرور غير صحيحة.";
}
}
?>