Web Development Code
Open in Telegram
قناة خاصه بتطوير الويب ونشر مشاريع الويب وكل مايخص الويب الادمن : @Noureldin13 #Html #Css #Bootstrap #JavaScript #ReactJs #Php #NodeJs #Mysql #MongoDB Buy ads: https://telega.io/c/codedevelopment جروب المناقشة : @codedevchat
Show more5 867
Subscribers
No data24 hours
-137 days
-7130 days
Posts Archive
5 867
لو انت من الناس اللي بتحب الكتب
الموقع دة كنز
مش زي مواقع كتير مليانة كتب لكن ملهاش فايدة
هو فيه كتاب لكل لغة تقريبا لكن كتاب احترافي فيه الخلاصة اللي انت عاوزها وبتعمق ولو عشت معاه شوية هتبقى محترف باذن الله
والكتب مجانية
https://goalkicker.com/
@codedevelopment
5 867
حد ايراضيها بسرعة يا جماعة
من بعد ال67 ما ضللناش ارض كثير
بلاش نصير نعيش في البحر 🤣🤣🤣
5 867
استخدام مدخل
radio
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<style>
</style>
</head>
<body>
<form name="register">
<label><!--تسميه حقل الادخال-->
Username
</label>
<input type="text" name="username" placeholder="type your name" ><!--المدخلات-->
<br>
<label><!--تسميه حقل الادخال-->
Password
</label>
<input type="password" name="password" placeholder="type your pass" ><!--المدخلات-->
<br>
<label>Upload your file</label>
<input type="file">
<br>
<input type="checkbox">
<label>Remember name</label>
<br>
<label>Choose your browser</label>
<br>
<input type="radio" name="browser" value="Chrome">Google Chrome <br>
<input type="radio" name="browser" value="FireFox">Mozila FireFox <br>
<input type="radio" name="browser" value="Opera">Opera <br>
<br>
<input type="submit" value="sing up">
<input type="reset">
</form>
</body>
</html>
#Html
@codedevelopment
5 867
اضافة
input
لرفع الملفات
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<style>
</style>
</head>
<body>
<form name="register">
<label><!--تسميه حقل الادخال-->
Username
</label>
<input type="text" name="username" placeholder="type your name" ><!--المدخلات-->
<br>
<label><!--تسميه حقل الادخال-->
Password
</label>
<input type="password" name="password" placeholder="type your pass" ><!--المدخلات-->
<br>
<label>Upload your file</label>
<input type="file">
<br>
<input type="checkbox">
<label>Remember name</label>
<br>
<input type="submit" value="sing up">
<input type="reset">
</form>
</body>
</html>
#Html
@codedevelopment
5 867
اضافه زر reset
لمسح ما كتبته
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<style>
</style>
</head>
<body>
<form name="register">
<label><!--تسميه حقل الادخال-->
Username
</label>
<input type="text" name="username" placeholder="type your name" ><!--المدخلات-->
<br>
<label><!--تسميه حقل الادخال-->
Password
</label>
<input type="password" name="password" placeholder="type your pass" ><!--المدخلات-->
<br>
<input type="checkbox">
<label>Remember name</label>
<br>
<input type="submit" value="sing up">
<input type="reset">
</form>
</body>
</html>
#Html
@codedevelopment
5 867
عمل زر submin
مثل زر singup
كما ف الصورة
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<style>
</style>
</head>
<body>
<form name="register">
<label><!--تسميه حقل الادخال-->
Username
</label>
<input type="text" name="username" placeholder="type your name" ><!--المدخلات-->
<br>
<label><!--تسميه حقل الادخال-->
Password
</label>
<input type="password" name="password" placeholder="type your pass" ><!--المدخلات-->
<br>
<input type="checkbox">
<label>Remember name</label>
<br>
<input type="submit" value="sing up">
</form>
</body>
</html>
#html
@codedevelopment
5 867
استخدام
maxlength
لتحديد عدد المدخل
كما ف الصورة حدد له 5
ولا يستطيع ادخال اكثر من 5
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<style>
</style>
</head>
<body>
<form name="register">
<label><!--تسميه حقل الادخال-->
Username
</label>
<input type="text" name="username" placeholder="type your name" maxlength="5" ><!--المدخلات-->
<label><!--تسميه حقل الادخال-->
Password
</label>
<input type="password" name="password" placeholder="type your pass" ><!--المدخلات-->
</form>
</body>
</html>
#Html
@codedevelopment
5 867
استخدام placeholder
بداخل المدخل
يظهر كما ف الصور ف صندوق الادخال
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<style>
</style>
</head>
<body>
<form name="register">
<label><!--تسميه حقل الادخال-->
Username
</label>
<input type="text" name="username" placeholder="type your name" ><!--المدخلات-->
<label><!--تسميه حقل الادخال-->
Password
</label>
<input type="password" name="password" placeholder="type your pass"><!--المدخلات-->
</form>
</body>
</html>
#html
@codedevelopment
5 867
شرح وسم
label
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<style>
</style>
</head>
<body>
<form name="register">
<label><!--تسميه حقل الادخال-->
Username
</label>
<input type="text"><!--المدخلات-->
<label><!--تسميه حقل الادخال-->
Password
</label>
<input type="password"><!--المدخلات-->
</form>
</body>
</html>
#html
@codedevelopment
5 867
المدخلات input
تكتب هكذا </input>
طبعا مع اظافه type او نوع له
مثال :
<input type="text"/>
هنا نقول له ان المدخلات هي نص عادي
طبعا هناك انواع اخرى ل input
مثل :
email
password
checkbox
range
time
radio
number
file
submit
#Html
@codedevelopment
5 867
<!DOCTYPE html>
يحدد بيان وثيقه html5
يكون بدايه الصفحه ب
<html>
ولها تاج قفل لا ننساه
</html>
<head>
يحتوي عن المعلومات الوصفيه للصفحه
تاج القفل
</head>
<title></title>
يظهر غي شريط عنوان المتصفح
يكون داخل تاج ال head
<body></body>
العنصر الاساسي للصفحه
مثل العناوين و الفقرات والصور الخ..
<h1>
<h2>
<h3>
<h4>
<h5>
يحدد حجم العنصر من كبير الي صغير
<p></p>
لكتابه الفقرات
مثال
<p>
my frist paragraph
</P>
out:
my frist paragraph
مثلا نريد عمل مسافات
<p>
my
frist
paragraph
</p>
لو عمل هكذا لن يحدث مسافات سيكون المخرج هكذا
my frist paragraph
الطريقه الصحيحه نقوم باستخدام
<br>
هكذا
<p>
my <br> frist <br> paragraph
</p>
out:
my
frist
paragraph
استدعاء الصور
وهو من وسم
<img>
وليس له وسم اغلاق
<img src="photo.jpg" alt="photo" >
src مكان استدعاء الصورة
photo.jpg
اسم الصورة
مثلا الصورة داخل مجلد اسمه image
نستدعيها هكذا
<img src="image/photo.jpg">
وهكذا
alt
هكذا مثلا لو متصفحك لا يستطيع تحميل الصورة او حدث شي بالصورة يظهرلك لك كلمه photo الذي كتبتها
alt="photo"
الارتباط التشعبي
وسم
<a></a>
واختصار لكلمه
achor
يعني مرسل
مثال:
<a href="https://google.com" > google <a>
out:
سيكون مكتوب كلمه
google
وتحتها خط ازرق تضغط عليها تفتح goole
في نفس ال tab الي انت فيه
واذا تريد الرابط يفتح في tab اخر تستخدم _blank
هكذا
<a href="https://google.com" target="_blank"> google <a>
ووسم <a>
يستخدم في شي اخر
مثال
<!DOCTYPE html>
<html>
<head>
<title>test</title>
</head>
<body>
<a href="#new"> chapter1 </a>
<a href="#new1"> chapter2 </a>
<h1>chapter 1<h1>
<P id="new">my frist paragraph</p>
<P>my frist paragraph</p>
<P>my frist paragraph</p>
<P>my frist paragraph</p>
<P>my frist paragraph</p>
<P>my frist paragraph</p>
<h1>chapter 2<h1>
<P id="new1">my frist paragraph</p>
<P>my frist paragraph</p>
<P>my frist paragraph</p>
<P>my frist paragraph</p>
<P>my frist paragraph</p>
<P>my frist paragraph</p>
<P>my frist paragraph</p>
</body>
</html>
عند تشغيله سيكون
مكتوب chpter1
chpter2
عند الضغط عليه ينقلك لهم
نتكلم عن الترميز العالمي
utf-8
الذي يدعم اللغه العربيه واللغه الانجليزية
يكون في وسم head
<head>
<meta charset="utf-8">
والنوع التاني يكون تحت الاسم عند البحث في الموقع يكون في الوصف
<meta name="descripion" contect="my frist project" >
نتكلم علي
link
لربط الصفحه بملف اخر
مثل css
<link rel="stylesheet" href="*">
مكان علامه *
نكتب الملف
نتكلم عن ال commant
<!--
هنا نكتب التعليق ولا يظهر في صفحة الويب
-->
#Html
@codedevelopment
5 867
عمل عد تنازلي بواسطة جافا سكربت
#ملاحظة بس يخلص العد بكون وصل عيد ميلادي 🐸😂😂💔
https://codepen.io/mounibkamhaz/pen/LYRmEXZ
@codedevelopment
5 867
