<html>
<head>
<style>
body {
background:#ffe;
color:gray;
}
.one{
height:35%;
width:auto;
background-color:#909090;
color:#ffe;
padding:15px;
text-align:left;
}
.one h1{
margin-left:15%;
margin-top:5%;
}
.two{
height:55%;
width:70%;
background-color:#bdee34;
color:#fff;
text-align:center;
}
.th3{
background-color:#cfffff;
position: absolute;
left:70%; top:50%;
width:25%;; height:45%;
border:10px solid #009909;
margin:25px;
padding:10px;
}
.nav{
background-color:#009909;
height:8%;
width:auto;padding:5px;
}
.nav ul {
text-decoration:none;
padding:0%;
margin:0%;
}
.nav ul li
{
float:right;
text-decoration:none;
list-style-type:none;
margin-top:1%;
margin-right:3%;
}
.nav a{
text-decoration:none;
color:#ffe;padding:15%;
}
.nav a:hover{
background-color:#ffe;
border-radius:5%;
color:#000;
}
.fotaer{
height:5%;
width:auto;
background-color:#cfffff;
color:#008;
padding:15px;
text-align:center;
margin-top:5%;
}
</style>
<title> my first web </title>
</head>
<body>
<div class="one">
<h1> MY First Web</h1>
</div>
<div class="nav">
<ul>
<li> <a href="http://google.com" target="_blank"> google </a></li>
<li> <a href="http://google.com" target="_blank"> youtube </a></li>
<li> <a href="http://google.com" target="_blank"> facebock </a></li>
<li> <a href="http://google.com" target="_blank"> telegram </a></li>
<li> <a href="http://google.com" target="_blank"> home </a></li>
<li> <a href="http://google.com" target="_blank"> about </a></li>
</ul>
</div>
<div class="two">
<h2> welcom to my web </h2>
<img src="new.jpg" height="120" width="120" />
<p>
<br /> لا تغرق في ماضيك
<br />هناك حياة تنتظرك وأشياء جميلة يجب أن تفعلها
<br /> وفرح كبير قادر على محو كل حزن مررت به
<br />ثق بربك ثم بنفسك.
</p>
</div>
<div class="th3">
<p>
إن الأشخاص الذين يتسمون بقدر عال من المبادرة يميزون بداخلهم تلك "القدرة على الاستجابة الحرة" أي القدرة على اختيار وتحديد نوعية استجاباتهم. إنهم لا يلقون باللوم على الظروف، أو الأحوال، أو البيئة المحيطة بهم ويتهمونها بأنها السبب في سلوكهم، فسلوكهم هو نتيجة اختيارهم الواعي، ويستند إلى قيمهم، وليس نتيجة الظروف، ولا يستند إلى مشاعرهم.
</p>
</div>
<div class="fotaer">
this web is dev by programer femo @2016
</div>
</body>
</html>
<head>
<style>
body {
background:#ffe;
color:gray;
}
.one{
height:35%;
width:auto;
background-color:#909090;
color:#ffe;
padding:15px;
text-align:left;
}
.one h1{
margin-left:15%;
margin-top:5%;
}
.two{
height:55%;
width:70%;
background-color:#bdee34;
color:#fff;
text-align:center;
}
.th3{
background-color:#cfffff;
position: absolute;
left:70%; top:50%;
width:25%;; height:45%;
border:10px solid #009909;
margin:25px;
padding:10px;
}
.nav{
background-color:#009909;
height:8%;
width:auto;padding:5px;
}
.nav ul {
text-decoration:none;
padding:0%;
margin:0%;
}
.nav ul li
{
float:right;
text-decoration:none;
list-style-type:none;
margin-top:1%;
margin-right:3%;
}
.nav a{
text-decoration:none;
color:#ffe;padding:15%;
}
.nav a:hover{
background-color:#ffe;
border-radius:5%;
color:#000;
}
.fotaer{
height:5%;
width:auto;
background-color:#cfffff;
color:#008;
padding:15px;
text-align:center;
margin-top:5%;
}
</style>
<title> my first web </title>
</head>
<body>
<div class="one">
<h1> MY First Web</h1>
</div>
<div class="nav">
<ul>
<li> <a href="http://google.com" target="_blank"> google </a></li>
<li> <a href="http://google.com" target="_blank"> youtube </a></li>
<li> <a href="http://google.com" target="_blank"> facebock </a></li>
<li> <a href="http://google.com" target="_blank"> telegram </a></li>
<li> <a href="http://google.com" target="_blank"> home </a></li>
<li> <a href="http://google.com" target="_blank"> about </a></li>
</ul>
</div>
<div class="two">
<h2> welcom to my web </h2>
<img src="new.jpg" height="120" width="120" />
<p>
<br /> لا تغرق في ماضيك
<br />هناك حياة تنتظرك وأشياء جميلة يجب أن تفعلها
<br /> وفرح كبير قادر على محو كل حزن مررت به
<br />ثق بربك ثم بنفسك.
</p>
</div>
<div class="th3">
<p>
إن الأشخاص الذين يتسمون بقدر عال من المبادرة يميزون بداخلهم تلك "القدرة على الاستجابة الحرة" أي القدرة على اختيار وتحديد نوعية استجاباتهم. إنهم لا يلقون باللوم على الظروف، أو الأحوال، أو البيئة المحيطة بهم ويتهمونها بأنها السبب في سلوكهم، فسلوكهم هو نتيجة اختيارهم الواعي، ويستند إلى قيمهم، وليس نتيجة الظروف، ولا يستند إلى مشاعرهم.
</p>
</div>
<div class="fotaer">
this web is dev by programer femo @2016
</div>
</body>
</html>
<!DOCTYPE html> <!— اول ما تخلق صفحة اج تي ام ال لازم تكتب هذا الكود حته يعرف المتصفح انو نوع الملف هو اج تي ام ال —>
<html> <!— هذا تاك الفتح اول تاك نكتبه بالصفحة —>
<head> <!— هذا التاك اول منكتبه راح نكتب بداخله تاك الخاص بلغة سي اس اس علمود نضيف الخصائص للصفحة —>
<meta charset="utf-8"><!— هذا التاك يخلي المتصفح يدعم اللغة العربية المستخدمهة بالصفحة —>
<title> 📋Learn🔝 Programming📚 </title> <!--هنا عنوان الصفحة بالمتصفح فوك —>
<link rel="stylesheet" href="main.css"><!— هنا نربط الملف الي حطينة بيه خصائص سي اس اس ويه صفحة الاج تي ام اال —>
<!— اذا موضعتو تاك اللنك وتردون تكتبون الخصائص بنفس الصفحة نسوي هيج —>
<style>
body {
background: #fff;
box-shadow: 0 0 2px rgba(0, 0, 0, 0.06);
color: #545454;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 16px;
margin: 0 auto;
padding:0;
}
img {
background: transparent;
border: 10px solid rgba(0, 0, 0, 0.12);
border-radius: 4px;
display: block;
margin: 1.3em auto;
}
ul{
padding: 0%;
margin: 0%;
}
li{
float: left;
margin: 5px;padding: 2px;
list-style: none;
}
a{
color: black;padding: 12px;
text-decoration: none;background-color:antiquewhite;
}
a:hover{
color: aqua;
background-color: black;
}
</style>
</head>
<body><!— بدايه جسم الصفحة —>
<h1>Programmer femo</h1> <!--كلما كبر رقم العنوان كلما صغر حجم الخط —>
<h2> learn design web </h2>
<p>
هذا التاك لكتابه نص
</p>
<a href="https://telegram.me/progfemo96"> Programmer femo </a><!— اضافة رابط —>
<img src="رابط الصور " /> <!— اضافة صورة-->
<!— انشاء قائمة —>
<ul>
<li><a href="تضع رابط صفحة ويب او صفحة اج تي ام ال هنا "> name تكتب اسم هنا للصفحة او للموقع </a></li>
<li><a href="تضع رابط صفحة ويب او صفحة اج تي ام ال هنا "> name تكتب اسم هنا للصفحة او للموقع </a></li>
<li><a href="تضع رابط صفحة ويب او صفحة اج تي ام ال هنا "> name تكتب اسم هنا للصفحة او للموقع </a></li>
<li><a href="تضع رابط صفحة ويب او صفحة اج تي ام ال هنا "> name تكتب اسم هنا للصفحة او للموقع </a></li>
<li><a href="تضع رابط صفحة ويب او صفحة اج تي ام ال هنا "> name تكتب اسم هنا للصفحة او للموقع </a></li>
<li><a href="تضع رابط صفحة ويب او صفحة اج تي ام ال هنا "> name تكتب اسم هنا للصفحة او للموقع </a></li>
</ul>
</body>
</html> Design website|💗| @progfemo96_bot 🌿
<html> <!— هذا تاك الفتح اول تاك نكتبه بالصفحة —>
<head> <!— هذا التاك اول منكتبه راح نكتب بداخله تاك الخاص بلغة سي اس اس علمود نضيف الخصائص للصفحة —>
<meta charset="utf-8"><!— هذا التاك يخلي المتصفح يدعم اللغة العربية المستخدمهة بالصفحة —>
<title> 📋Learn🔝 Programming📚 </title> <!--هنا عنوان الصفحة بالمتصفح فوك —>
<link rel="stylesheet" href="main.css"><!— هنا نربط الملف الي حطينة بيه خصائص سي اس اس ويه صفحة الاج تي ام اال —>
<!— اذا موضعتو تاك اللنك وتردون تكتبون الخصائص بنفس الصفحة نسوي هيج —>
<style>
body {
background: #fff;
box-shadow: 0 0 2px rgba(0, 0, 0, 0.06);
color: #545454;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 16px;
margin: 0 auto;
padding:0;
}
img {
background: transparent;
border: 10px solid rgba(0, 0, 0, 0.12);
border-radius: 4px;
display: block;
margin: 1.3em auto;
}
ul{
padding: 0%;
margin: 0%;
}
li{
float: left;
margin: 5px;padding: 2px;
list-style: none;
}
a{
color: black;padding: 12px;
text-decoration: none;background-color:antiquewhite;
}
a:hover{
color: aqua;
background-color: black;
}
</style>
</head>
<body><!— بدايه جسم الصفحة —>
<h1>Programmer femo</h1> <!--كلما كبر رقم العنوان كلما صغر حجم الخط —>
<h2> learn design web </h2>
<p>
هذا التاك لكتابه نص
</p>
<a href="https://telegram.me/progfemo96"> Programmer femo </a><!— اضافة رابط —>
<img src="رابط الصور " /> <!— اضافة صورة-->
<!— انشاء قائمة —>
<ul>
<li><a href="تضع رابط صفحة ويب او صفحة اج تي ام ال هنا "> name تكتب اسم هنا للصفحة او للموقع </a></li>
<li><a href="تضع رابط صفحة ويب او صفحة اج تي ام ال هنا "> name تكتب اسم هنا للصفحة او للموقع </a></li>
<li><a href="تضع رابط صفحة ويب او صفحة اج تي ام ال هنا "> name تكتب اسم هنا للصفحة او للموقع </a></li>
<li><a href="تضع رابط صفحة ويب او صفحة اج تي ام ال هنا "> name تكتب اسم هنا للصفحة او للموقع </a></li>
<li><a href="تضع رابط صفحة ويب او صفحة اج تي ام ال هنا "> name تكتب اسم هنا للصفحة او للموقع </a></li>
<li><a href="تضع رابط صفحة ويب او صفحة اج تي ام ال هنا "> name تكتب اسم هنا للصفحة او للموقع </a></li>
</ul>
</body>
</html> Design website|💗| @progfemo96_bot 🌿