Scribd
Upload
13 views

Firstr

Uploaded by

sami54724
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
13 views

Firstr

Uploaded by

sami54724
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

‫‪Pro Learn‬‬

‫>‪<html‬‬
‫‪.‬الوصف ‪:‬الجذر الذي يحتوي عىل جميع عنارص صفحة الويب‬

‫>‪: <html>...</html‬مثال‬

‫>‪<head‬‬
‫‪.‬الوصف ‪:‬يحتوي عىل البيانات الوصفية والروابط الخارجية للصفحة‬

‫>‪: <head>...</head‬مثال‬

‫>‪<body‬‬
‫‪.‬الوصف ‪:‬يحتوي عىل المحتوى المرئ ف صفحة الويب‬

‫>‪: <body>...</body‬مثال‬

‫>‪<title‬‬
‫‪.‬الوصف ‪:‬يحدد عنوان الصفحة الذي يظهر ف عالمة التبويب‬

‫>‪</title‬عنوان الصفحة>‪: <title‬مثال‬

‫>‪<meta‬‬
‫‪.‬الوصف ‪:‬يحتوي عىل بيانات وصفية حول الوثيقة‬

‫>"‪: <meta charset="UTF-8‬مثال‬

‫>‪<link‬‬
‫‪ CSS.‬الوصف ‪:‬يربط المستندات الخارجية مثل ملفات‬

‫>"‪: <link rel="stylesheet" href="styles.css‬مثال‬

‫>‪<script‬‬
‫‪.‬الوصف ‪:‬يضيف أو يربط ملفات جافا سكريبت بالصفحة‬

‫>‪: <script src="script.js"></script‬مثال‬

‫>‪<style‬‬
‫‪ .‬ر‬
‫مباشة ف الصفحة ‪ CSS‬الوصف ‪:‬يستخدم لتطبيق أنماط‬

‫>‪: <style>body {color: red;}</style‬مثال‬

‫>‪ <h6‬إىل >‪<h1‬‬


‫‪.‬هو األكب >‪ <h1‬الوصف ‪:‬تستخدم لعناوين النصوص‪ ،‬حيث أن‬
‫‪Pro Learn‬‬

‫>‪</h1‬عنوان كبب>‪: <h1‬مثال‬

‫>‪<p‬‬
‫‪.‬الوصف ‪:‬يستخدم لكتابة فقرة نصية‬

‫>‪.</p‬هذه فقرة>‪: <p‬مثال‬

‫>‪<a‬‬
‫ً‬ ‫ً‬ ‫‪.‬الوصف ‪ :‬ر‬
‫تشعبيا للنقل بي الصفحات‬ ‫ينش رابطا‬

‫>‪</a‬زر لالنتقال>"‪: <a href="https://example.com‬مثال‬

‫>‪<img‬‬
‫‪.‬الوصف ‪:‬يعرض صورة عىل الصفحة‬

‫>"وصف الصورة"=‪: <img src="image.jpg" alt‬مثال‬

‫>‪<ul‬‬
‫‪.‬الوصف ‪ :‬ر‬
‫ينش قائمة غب مرتبة‬

‫>‪</li></ul‬عنرص ‪</li><li>2‬عنرص ‪: <ul><li>1‬مثال‬

‫>‪<ol‬‬
‫‪.‬الوصف ‪ :‬ر‬
‫ينش قائمة مرتبة‬

‫>‪</li></ol‬عنرص ‪</li><li>2‬عنرص ‪: <ol><li>1‬مثال‬

‫>‪<li‬‬
‫‪ <ol>.‬أو >‪ <ul‬الوصف ‪:‬عنرص قائمة داخل‬

‫>‪</li‬عنرص قائمة>‪: <li‬مثال‬

‫>‪<div‬‬
‫‪.‬الوصف ‪:‬عنرص يحتوي عىل كتل من المحتوى‬

‫>‪</div‬محتوى>"‪: <div class="box‬مثال‬

‫>‪<span‬‬
‫‪.‬الوصف ‪:‬عنرص يحتوي عىل محتوى صغب أو جزء من النص‬

‫>‪</span‬نص>";‪: <span style="color:blue‬مثال‬

‫>‪<table‬‬
‫ا‬ ‫‪.‬الوصف ‪ :‬ر‬
‫ينش جدول‬
‫‪Pro Learn‬‬

‫>‪</td></tr></table‬خلية>‪: <table><tr><td‬مثال‬

‫>‪<tr‬‬
‫ً‬
‫‪.‬الوصف ‪:‬يمثل صفا ف جدول‬

‫>‪</td></tr‬خلية>‪: <tr><td‬مثال‬

‫>‪<td‬‬
‫‪.‬الوصف ‪:‬يمثل خلية بيانات داخل الجدول‬

‫>‪</td‬خلية>‪: <td‬مثال‬

‫>‪<th‬‬
‫‪.‬الوصف ‪:‬يمثل خلية عنوان ف الجدول‬

‫>‪</th‬عنوان>‪: <th‬مثال‬

‫>‪<form‬‬
‫ً‬
‫نموذجا لجمع بيانات المستخدم‬ ‫‪.‬الوصف ‪ :‬ر‬
‫ينش‬

‫>‪: <form action="/submit"></form‬مثال‬

‫>‪<input‬‬
‫‪.‬الوصف ‪:‬يحدد عنرص إدخال ف النموذج‬

‫>"‪: <input type="text" name="username‬مثال‬

‫>‪<textarea‬‬
‫‪.‬الوصف ‪:‬يتيح للمستخدم إدخال نص متعدد األسطر‬

‫>‪: <textarea></textarea‬مثال‬

‫>‪<button‬‬
‫ينش ًزرا يمكن النقر عليه‬
‫‪.‬الوصف ‪ :‬ر‬

‫>‪</button‬إرسال>‪: <button‬مثال‬

‫>‪<select‬‬
‫‪.‬الوصف ‪ :‬ر‬
‫ينش قائمة منسدلة‬

‫>‪</option></select‬اختيار>‪: <select><option‬مثال‬

‫>‪<option‬‬
‫‪ <select>.‬الوصف ‪:‬عنرص ضمن قائمة‬
‫‪Pro Learn‬‬

‫>‪</option‬اختيار ‪: <option>1‬مثال‬

‫>‪<header‬‬
‫‪.‬الوصف ‪:‬يمثل رأس الصفحة أو القسم‬

‫>‪</header‬رأس الصفحة>‪: <header‬مثال‬

‫>‪<footer‬‬
‫‪.‬الوصف ‪:‬يمثل تذييل الصفحة أو القسم‬

‫>‪</footer‬تذييل الصفحة>‪: <footer‬مثال‬

‫>‪<nav‬‬
‫‪.‬الوصف ‪:‬يمثل قائمة تنقل‬

‫>‪</nav‬قائمة التنقل>‪: <nav‬مثال‬

‫‪HTML Input Types and Explanation of the "name" Attribute‬‬


‫>'‪<input type='text‬‬
‫‪.‬الوصف ‪:‬عنرص إدخال نص يسمح بإدخال نص بسيط‬

‫>"‪: <input type="text" name="username‬مثال‬

‫>'‪<input type='password‬‬
‫‪.‬الوصف ‪:‬عنرص إدخال يخف النص أثناء الكتابة‬

‫>"‪: <input type="password" name="password‬مثال‬

‫>'‪<input type='email‬‬
‫‪.‬الوصف ‪:‬عنرص إدخال يستخدم لكتابة عنوان بريد ر‬
‫إلكبوئ‬

‫>"‪: <input type="email" name="email‬مثال‬

‫>'‪<input type='number‬‬
‫‪.‬الوصف ‪:‬عنرص إدخال يتيح إدخال األرقام فقط‬

‫>"‪: <input type="number" name="age‬مثال‬

‫>'‪<input type='radio‬‬
‫‪.‬الوصف ‪:‬عنرص اختيار واحد ضمن مجموعة من الخيارات‬

‫‪:‬مثال‬
‫‪Pro Learn‬‬

‫>"‪<input type="radio" name="gender" value="male‬‬

‫>"‪<input type="radio" name="gender" value="female‬‬

‫>'‪<input type='checkbox‬‬
‫‪.‬الوصف ‪:‬عنرص اختيار متعدد يسمح بتحديد عدة خيارات‬

‫>"‪: <input type="checkbox" name="agree‬مثال‬

‫>'‪<input type='date‬‬
‫‪.‬الوصف ‪:‬عنرص إدخال يتيح للمستخدم اختيار تاري خ‬

‫>"‪: <input type="date" name="birthday‬مثال‬

‫>'‪<input type='submit‬‬
‫‪.‬الوصف ‪:‬زر إرسال النموذج‬

‫>"إرسال"=‪: <input type="submit" value‬مثال‬

‫‪Nam:‬‬
‫ُ‬
‫هو سمة تستخدم لتحديد اسم الحقل ف النموذج ‪.‬يتم إرسال قيمة هذا الحقل مع اسم السمة إل "‪"name‬‬
‫الخادم عند إرسال النموذج ‪.‬يتم استخدام هذه السمة لتحديد البيانات ر‬
‫الت تم إدخالها من قبل المستخدمي ‪.‬عىل‬
‫فسيتم "‪ "username‬تساوي "‪ "name‬سبيل المثال‪ ،‬إذا كان لديك نموذج يحتوي عىل مدخل نص مع سمة‬
‫‪ "username=ali".‬إرسال اسم المستخدم الذي أدخله المستخدم إل الخادم اسم‪-‬قيمة‪ ،‬مثل‬

You might also like