You are on page 1of 5

‫>‪<html‬‬

‫>‪<head‬‬
‫>‪ </title‬عنوان الموقع‪/‬التاب >‪<title‬‬
‫>‪</head‬‬
‫يكتب داخلها كل انواع االكواد المراد بها في الصفحه >‪<body‬‬
‫لكتابه اي نص يوضع بداخل كود ال >‪<p> paragraph </p‬‬
‫> الرقم ‪ </h‬النص >نختار رقم من ‪ 1‬الى ‪<h 6‬‬
‫كل ما يزيد الرقم يصغرحجم الخط ‪ =1‬اكبر خط و ‪ =6‬اصغر خط‬
‫بنزوده قبل كود الباراجراف‪:‬‬

‫>‪ </p> </h1‬النص >‪<h1> <p‬‬


‫بنزوده داخل كود الباراجراف ‪Style code:‬‬
‫>‪ </p‬الباراجراف ” ‪<p style=” :‬‬
‫بيخلي الكتابه في النص ”‪style=”text-align:center‬‬
‫بيلون النص”اللون المطلوب ‪style=”color:‬‬
‫>‪<b>bold text</b‬‬
‫>‪<i>italic text</i‬‬
‫>‪<u>under line text</u‬‬
‫تكتب نهايه كل كود لو عايز النص ينزل سطر ثاني >‪<br‬‬
‫>‪ </hr‬بتعمل سطر بطول الصفحه >‪<hr‬‬
‫‪<ol type=”1”> ordered list with numbers‬‬
‫بيخلي النص مرقم >‪1. <li> listed item </li‬‬
‫>‪</ol‬‬
‫‪<ul> un ordered list‬‬
‫‪ bullets text‬بيخليها >‪• <li> listed item </li‬‬
‫>‪</ul‬‬
‫‪<dl> definition list‬‬
‫>‪<dt>definition term</dt‬‬
‫>‪<dd>describes each term<dd‬‬
‫>‪</dl‬‬
Table code:
<table border=”6 ‫ الى‬1‫>”رقم من‬
‫= اصغر‬6 ‫= اكبر و‬1 ‫كل ما يزيد الرقم يصغر سمك الخط‬
<tr> table row
<td>table data</td>
<td>table data</td>
<td>table data</td>
</tr>
<tr> table row
<td>table data2</td>
<td>table data2</td>
<td>table data2</td>
</tr>
: ‫لو عايز تدمج مربعين في الجدول تحت بعض‬
<td rowspan=”‫< نكتب النص >”رقم الرو اللي هيتدمج‬/td>:
<table border="2">
<tr>
<td>name</td>
<td rowspan=”2”>year 1</td>
<td>id</td>
</tr>
<tr>
<td>name</td>
<td>id</td>
</tr>
</table>
:‫لو عايزين ندمج مربعين جنب بعض‬

<td colspan=”‫< نكتب النص>” رقم الرو اللي هيتدمج‬/td>:


<table border="2">
<tr>
<td colspan="2">name</td>
<td>age</td>
</tr>
<tr>
<td>ahmed</td>
<td>mona</td>
<td>20</td>
</tr>
<tr>
<td>sara</td>
<td>jane</td>
<td>18</td>
</tr>
</table>
Text link:
<p>
<a href=”:www.‫اي موقع‬.com” target="_blank/top"> ‫< النص‬/a>
Blank =‫بيفتح اللينك في تاب تانيه‬
Top=‫بيفتح اللينك فوق التاب االساسية‬
:‫طريقة الكتابة‬
</p>
<p> Try to
<a href=”:www.google.com” target="_blank"> press </a>
Here </p>
Add picture:
2-
‫اول حاجه هنجيب لينك الصورة بالتحديد على الصورة ثم ضغط‬
1-right click
2-choose properties
3-choose security
4-copy link with “ctrl+c”

3-

4-
:‫كود اضافه الصورة‬
<img src=”‫ ”لينك الصورة‬width=”‫ ”العرض‬hight=”‫>”الطول‬
:‫طريقه الكتابة‬
<img src=”C:\Users\acer\Pictures\Saved Pictures\download.png ”
width=”150”hight=”100”>
:‫كود عمل الصورة لينك تنزيل صورة‬
<a href="‫"لينك الصورة المراد تنزيلها‬download>
<img src="‫ "لينك الصورة االساسية‬width="‫"العرض‬hight="‫>"الطول‬
</a>
:‫طريقة الكتابة‬
<a href="C:\Users\acer\Pictures\Saved Pictures\download.png"download>
<img src="C:\Users\acer\Pictures\Saved Pictures\download.png"
width="150"hight="100">
</a>
Login form:
<form action=”login.html”>
<input type="text" placeholder="username"><br>
<input type="password" placeholder="password"><br>
Check box and radio:
<input type="checkbox">male<br>
<input type="checkbox">female<br>
<input type="radio">B Admin<br>
<input type="radio">B Tech<br>
Signup botton:
<input type="submit" value="signup">
</form>

You might also like