بعض الوظائف لا تعمل على هذا المتصفح، حاول استخدام متصفح آخر
About Privacy Terms
بسم الله الرحمن الرحيم
شاركـ أصدقائك

كورس HTML | شرح الأنماط (styles) | موقع فولدرات

الرئيسية / الحاسب الآلي / لغات البرمجة / HTML / كورس HTML | شرح الأنماط (styles)

القرآن الكريم كامل المصحف الذكي (جديد) , المصحف النصي

 

شرح html للمبتدئين

 

تستخدم سمة نمط  HTML Style لإضافة أنماط إلى عنصر ، مثل اللون والخط والحجم وغيرها.

 

مثال :

<!DOCTYPE html>
<html>
<body>
 
<p>السلام عليكم</p>
<p style="color:red;">السلام عليكم</p>
<p style="color:green;">السلام عليكم</p>
<p style="font-size:50px;">السلام عليكم</p>

</body>
</html>

 

الناتج كالآتي :

html style شرح إضافة لون للخط و تغيير حجم الخط

 

سمة نمط HTML :

يمكن تحديد نمط عنصر HTML باستخدام سمة النمط attribute.

تحتوي سمة نمط HTML على بناء الجملة التالي:

<tagname style="property:value;">

 

لون الخلفية : background-color

تحدد خاصية لون الخلفية لعنصر HTML.

 

مثال:

<!DOCTYPE html>
<html>
<body style="background-color:orange;">
 
<h1>هنا عنوان الصفحة</h1>
<p>هنا تكون الفقرة </p>
 
</body>
</html>

 

الناتج كالآتي :

html style شرح إضافة لون للخلفية background

 

 

مثال آخر:

<!DOCTYPE html>
<html>
<body style="background-color:yellow;">
 
<h1>هنا عنوان الصفحة</h1>
<p>هنا تكون الفقرة </p>
 
</body>
</html>

الناتج كالآتي :

html style شرح إضافة لون للخلفية background

لون الخط : color

تحدد خاصية لون النص لعنصر HTML.

 

مثال:

<!DOCTYPE html>
<html>
<body>
 
<h1 style="color:blue;">هنا عنوان الصفحة</h1>
<p style="color:red;">هنا تكون الفقرة</p>
 
</body>
</html>
 

 

الناتج كالآتي :

html style شرح color background

 

نوع الخط : font-family

تحدد خاصية عائلة الخطوط في CSS الخط الذي سيتم استخدامه لعنصر HTML.

 

مثال:

<!DOCTYPE html>
<html>
<body>
 
<h1 style="font-family:courier;">هنا عنوان الصفحة</h1>
<p style="font-family:arial;">هنا تكون الفقرة</p>
 
</body>
</html>
 

 

الناتج كالآتي :

html style شرح font-family background

 

حجم الخط :  font-size

تحدد خاصية حجم النص لعنصر HTML.

 

مثال:

<!DOCTYPE html>
<html>
<body>
 
<h1 style="font-size:70px;">هنا عنوان الصفحة</h1>
<p style="font-size:50px;">هنا تكون الفقرة</p>
 
</body>
</html>
 

 

الناتج كالآتي :

html style شرح حجم الخط background

 

محاذاة النص : text-align

تحدد خاصية محاذاة النص لعنصر HTML.

 

مثال:

<!DOCTYPE html>
<html>
<body>
 
<h1 style="text-align:center;">هنا عنوان الصفحة</h1>
<p style="text-align:center;">هنا تكون الفقرة</p>
 
</body>
</html>
 

 

الناتج كالآتي :

html style شرح إضافة لون للخلفية background

لا تنسى مشاركة الصفحة ومن صالح دعائكم

صورة
SQL
كورس SQL | شرح SELECT TOP

يتم استخدام عبارة SELECT TOP لتحديد عدد السجلات المراد إرجاعها. تعتبر عبارة SELECT TOP مفيدة في الجداول الكبيرة التي تحتوي على آلاف السجلات. يمكن أن تؤثر إعادة عدد كبي ...

صورة
شروحات أمازون
خبير أمازون | كيفية ترجمة موقع أمازون

أمازون موقع شاسع به العديد من المسارات والروابط. يصعب على العديد من الأشخاص التنقل عبر الموقع إذا لم يكن بلغتهم الأولى. هذا هو السبب في أن مواقع أمازون المختلفة متوفرة بل ...

صورة
CSS
كورس CSS | شرح Borders

الخاصية border هي صيغة مختصرة في CSS تقبل قيمًا متعددة لرسم خط حول العنصر الذي يتم تطبيقه عليه. تسمح لك خصائص حدود CSS بتحديد نمط وعرض ولون حدود العنصر. ...

صورة
CSS
كورس CSS | كيفية إضافة CSS

هناك ثلاث طرق لإضافة CSS إلى HTML. يمكنك إضافة CSS مضمن لتصميم عنصر HTML واحد على الصفحة. يمكنك تضمين ورقة أنماط داخلية عن طريق إضافة CSS إلى قسم الرأس في مستند HTML ا ...

صورة
JAVASCRIPT
كورس JavaScript | شرح Output

إمكانيات عرض JavaScript يمكن لـ JavaScript "عرض" البيانات بطرق مختلفة: الكتابة في عنصر HTML ، باستخدام innerHTML. الكتابة في مخرجات HTML باستخدام document.write. ال ...

صورة
CSS
كورس CSS | مقدمة css

ما هي CSS؟ تُعد Cascading Style Sheets ، التي يشار إليها باعتزاز باسم CSS ، لغة تصميم بسيطة تهدف إلى تبسيط عملية جعل صفحات الويب قابلة للتقديم. يتعامل CSS مع الشكل وا ...