أنواع الصور التي يمكن عرضها وكود اضافة صورة

 

طريقة التركيب
1- انسخ هذا الكود و ضعه في منطقة HEAD
 انسخ هذا الكود و ضعه في منطقة BODY

<img src="https://harmash.com/html/src/html-5-icon.PNG">

 

نموذج صفحة اولى بصورة

نموذج الكود

اكتب هنا العنوان الرئيسي

اكتب هناعنوان المقال

اكتب هنا محتويات المقال

 <img src="url">

لإضافة صورة المقال ضع رابط الصورة مكان حروف "url" بين القوسين

تابع الكتابه ---------------------------------------------

طريقة التركيب

 انسخ هذا الكود و ضعه في منطقة BODY

<div class="container"> <div class="jumbotron"> <div class="row"> <div class="col-md-12"> <h1 align="center" class="text-center">اكتب هنا العنوان الرئيسي </h1> <h2 align="right" class="text-center" dir="rtl" style="margin-bottom: 0px; margin-top: 0px;"> عنوان المقال</h2> <h3 class="text-center" dir="rtl" style="margin-bottom: 0px; margin-top: 0px;"> سطر هنا محتويات المقال</h3> <div class="thumbnail"> <div class="caption text-center"> <p dir="rtl" style="margin-bottom: 0px; margin-top: 0px;"> <span face=""Helvetica Neue", "Noto Naskh Arabic UI", Arial, sans-serif" style="-webkit-text-stroke-width: 0px; background-color: red; color: #202124; display: inline; float: none; font-size: 16px; font-style: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: right; text-decoration-color: initial; text-decoration-style: initial; text-decoration-thickness: initial; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;">  <img src="url"></span></p> <p class="text-center" dir="rtl" style="margin-bottom: 0px; margin-top: 0px;"> <b><span style="font-size: medium;"> "url"لاضافة صورة المقال ضع رابط الصورة مكان حروف <span face="'Helvetica Neue', 'Noto Naskh Arabic UI', Arial, sans-serif" style="-webkit-text-stroke-width: 0px; background-color: white; color: #202124; display: inline; float: none; font-style: normal; font-variant-caps: normal; font-variant-ligatures: normal; letter-spacing: normal; orphans: 2; text-align: right; text-decoration-color: initial; text-decoration-style: initial; text-decoration-thickness: initial; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;"> "url" بين القوسين</span></span></b></p></div> </div> </div> </div> <div class="row"> <div class="col-md-12"> <h3 dir="rtl" style="margin-bottom: 0px; margin-top: 0px;">تابع الكتابه</h3> </div>

كود هتمل للصفحة الممطرة

تطبيق الكود

طريقة التركيب

 انسخ هذا الكود و ضعه في منطقة BODY

<script language="JavaScript"> <!-- Begin var no = 50; var speed = 1; var ns4up = (document.layers) ? 1 : 0; var ie4up = (document.all) ? 1 : 0; var s, x, y, sn, cs; var a, r, cx, cy; var i, doc_width = 800, doc_height = 600; if (ns4up) { doc_width = self.innerWidth; doc_height = self.innerHeight; } else if (ie4up) { doc_width = document.body.clientWidth; doc_height = document.body.clientHeight; } x = new Array(); y = new Array(); r = new Array(); cx = new Array(); cy = new Array(); s = 8; for (i = 0; i < no; ++ i) { initRain(); if (ns4up) { if (i == 0) { document.write("<layer name=\"dot"+ i +"\" left=\"1\" "); document.write("top=\"1\" visibility=\"show\"><font color=\"blue\">"); document.write(",</font></layer>"); } else { document.write("<layer name=\"dot"+ i +"\" left=\"1\" "); document.write("top=\"1\" visibility=\"show\"><font color=\"blue\">"); document.write(",</font></layer>"); } } else if (ie4up) { if (i == 0) { document.write("<div id=\"dot"+ i +"\" style=\"POSITION: "); document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: "); document.write("visible; TOP: 15px; LEFT: 15px;\"><font color=\"blue\">"); document.write(",</font></div>"); } else { document.write("<div id=\"dot"+ i +"\" style=\"POSITION: "); document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: "); document.write("visible; TOP: 15px; LEFT: 15px;\"><font color=\"blue\">"); document.write(",</font></div>"); } } } function initRain() { a = 6; r[i] = 1; sn = Math.sin(a); cs = Math.cos(a); cx[i] = Math.random() * doc_width + 1; cy[i] = Math.random() * doc_height + 1; x[i] = r[i] * sn + cx[i]; y[i] = cy[i]; } function makeRain() { r[i] = 1; cx[i] = Math.random() * doc_width + 1; cy[i] = 1; x[i] = r[i] * sn + cx[i]; y[i] = r[i] * cs + cy[i]; } function updateRain() { r[i] += s; x[i] = r[i] * sn + cx[i]; y[i] = r[i] * cs + cy[i]; } function raindropNS() { for (i = 0; i < no; ++ i) { updateRain(); if ((x[i] <= 1) || (x[i] >= (doc_width - 20)) || (y[i] >= (doc_height - 20))) { makeRain(); doc_width = self.innerWidth; doc_height = self.innerHeight; } document.layers["dot"+i].top = y[i]; document.layers["dot"+i].left = x[i]; } setTimeout("raindropNS()", speed); } function raindropIE() { for (i = 0; i < no; ++ i) { updateRain(); if ((x[i] <= 1) || (x[i] >= (doc_width - 20)) || (y[i] >= (doc_height - 20))) { makeRain(); doc_width = document.body.clientWidth; doc_height = document.body.clientHeight; } document.all["dot"+i].style.pixelTop = y[i]; document.all["dot"+i].style.pixelLeft = x[i]; } setTimeout("raindropIE()", speed); } if (ns4up) { raindropNS(); } else if (ie4up) { raindropIE(); } // End --> </script>

ساعة بتوقيت عالمي بخلفية سوداء

تطبيق الكود

التوقيت المحلي فلسطين السعودية الإمارات الكويت لبنان عمان قطر مصر المغرب تونس السودان لندن روما بانكوك هونكغ كونغ طوكيو سيدني فوجي هاواي سان فرانسيسكو نيويورك

طريقة التركيب

 انسخ هذا الكود و ضعه في منطقة BODY

<form name="where"> <table border="0" cellspacing="0" cellpadding="3"> <tr> <td> <p align="center"> <select name="city" onchange="updateclock(this);" size="1" style="background-color: black; border: 3px double rgb(128, 0, 0); color: white; font-family: Arial; font-weight: bold;"> <option selected="">التوقيت المحلي</option> <option value="2">فلسطين </option> <option value="3">السعودية</option> <option value="4">الإمارات</option> <option value="3">الكويت</option> <option value="3">لبنان</option> <option value="4">عمان</option> <option value="3">قطر</option> <option value="3">مصر</option> <option value="0">المغرب</option> <option value="1">تونس</option> <option value="3">السودان</option> <option value="0">لندن</option> <option value="1">روما</option> <option value="7">بانكوك</option> <option value="8">هونكغ كونغ</option> <option value="9">طوكيو</option> <option value="10">سيدني</option> <option value="12">فوجي</option> <option value="-10">هاواي</option> <option value="-8">سان فرانسيسكو</option> <option value="-5">نيويورك</option> </select> </p> </tr> <tr> <td> <script language="JavaScript"> if (document.all||document.getElementById) document.write('<span id="worldclock" style="font:bold 16px Arial;"></span><br>') zone=0; isitlocal=true; ampm=''; function updateclock(z){ zone=z.options[z.selectedIndex].value; isitlocal=(z.options[0].selected)?true:false; } function WorldClock(){ now=new Date(); ofst=now.getTimezoneOffset()/60; secs=now.getSeconds(); sec=-1.57+Math.PI*secs/30; mins=now.getMinutes(); min=-1.57+Math.PI*mins/30; hr=(isitlocal)?now.getHours():(now.getHours() + parseInt(ofst)) + parseInt(zone); hrs=-1.575+Math.PI*hr/6+Math.PI*parseInt(now.getMinutes())/360; if (hr < 0) hr+=24; if (hr > 23) hr-=24; ampm = (hr > 11)?"PM":"AM"; statusampm = ampm.toLowerCase(); hr2 = hr; if (hr2 == 0) hr2=12; (hr2 < 13)?hr2:hr2 %= 12; if (hr2<10) hr2="0"+hr2 var finaltime=hr2+':'+((mins < 10)?"0"+mins:mins)+':'+((secs < 10)?"0"+secs:secs)+' '+statusampm; if (document.all) worldclock.innerHTML=finaltime else if (document.getElementById) document.getElementById("worldclock").innerHTML=finaltime else if (document.layers){ document.worldclockns.document.worldclockns2.document.write(finaltime) document.worldclockns.document.worldclockns2.document.close() } setTimeout('WorldClock()',1000); } window.onload=WorldClock //--> </script> <!--Place holder for NS4 only--> <ilayer id="worldclockns" width=100% height=35><layer id="worldclockns2" width=100% height=35 left=0 top=0 style="font:bold 16px Arial;"></layer></ilayer> </td></tr></table></form>

كود ساعة HTML لساعة في اطار احمر

طريقة التركيب

2- انسخ هذا الكود و ضعه في منطقة BODY

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <script language="JavaScript"> <!-- begin script var ddt1, delay; function debuteTemps1() { var hhmmss = " ", mymin, sec; delay = 1000; adate = new Date(); hhmmss += adate.getHours(); mymin = adate.getMinutes(); if (mymin < 10) hhmmss += ":0" + mymin; else hhmmss += ":" + mymin; sec = adate.getSeconds(); if (sec < 10) hhmmss += ":0" + sec; else hhmmss += ":" + sec; hhmmss = " " + hhmmss; document.Temps11.heure.value = hhmmss; ddt1 = setTimeout("debuteTemps1(delay)",delay); } // end script --> </script> <BODY onLoad="debuteTemps1()" onUnload="clearTimeout(ddt1)"> <body> </body> <form name="Temps11"> <p align="center"><font color="#FFFFFF"> <input name="heure" size="8" style="color: #000000; border: 3px double #800000; background-color: #FF0000"></font></p> </form> </html>

ساعة صغيرة في اطار يسار الصفحة

 

تطبيق الكود

طريقة التركيب

1- انسخ هذا الكود و ضعه في منطقة HEAD
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <style> <!-- .styling{ color:green; font: bold 15px Arial; padding: 3px; } --> </style>

2- انسخ هذا الكود و ضعه في منطقة BODY

<div align="center" dir="ltr" style="border: 4px double #000000; padding: 1px; background-color: #CCFFFF; float:right"> <span id="digitalclock" class="styling"></span> <script> <!-- var alternate=0 var standardbrowser=!document.all&&!document.getElementById if (standardbrowser) document.write('<form name="tick"><input type="text" name="tock" size="6"></form>') function show(){ if (!standardbrowser) var clockobj=document.getElementById? document.getElementById("digitalclock") : document.all.digitalclock var Digital=new Date() var hours=Digital.getHours() var minutes=Digital.getMinutes() var dn="AM" if (hours==12) dn="PM" if (hours>12){ dn="PM" hours=hours-12 } if (hours==0) hours=12 if (hours.toString().length==1) hours="0"+hours if (minutes<=9) minutes="0"+minutes if (standardbrowser){ if (alternate==0) document.tick.tock.value=hours+" : "+minutes+" "+dn else document.tick.tock.value=hours+" "+minutes+" "+dn } else{ if (alternate==0) clockobj.innerHTML=hours+"<font color='RED'> : </font>"+minutes+" "+"<sup style='font-size:2px'>"+dn+"</sup>" else clockobj.innerHTML=hours+"<font color='black'> : </font>"+minutes+" "+"<sup style='font-size:2px'>"+dn+"</sup>" } alternate=(alternate==0)? 1 : 0 setTimeout("show()",1000) } window.onload=show //--> </script></div>

 

 

ساعة صغيرة سوداء بدون خلفية

 

تطبيق الكود

طريقة التركيب
1- انسخ هذا الكود و ضعه في منطقة HEAD

2- انسخ هذا الكود و ضعه في منطقة BODY

تاريخ آخر تحديث للموقع

طريقة التركيب

انسخ هذا الكود و ضعه في منطقة BODY

<SCRIPT LANGUAGE="JavaScript"> var m = "آخر تحديث للموقع كان بتاريخ " + document.lastModified; var p = m.length-8; document.writeln("<center><center><font color=red face=Areal size=3>"); document.write(m.substring(p, 0)); document.writeln("</font></center>"); </SCRIPT>