# العنصر style

> يحتوي العنصر معلومات عن تنسيق المستند أو جزءٍ منه، إذ تحتوى داخل هذا العنصر معلومات التنسيق التي من المتوقع أن تكون بلغة CSS.

- Canonical URL: https://coreiten.com/article/العنصر-style
- Language: ar
- Section: HTML
- Author: Sami
- Published: 2025-05-20T00:00:00+03:00
- Modified: 2026-01-30T23:55:48+03:00
- Publisher: CoreITen (https://coreiten.com)
- Keywords: ما هو العنصر style في html, شرح العنصر style, بطاقة العنصر style, دعم المتصفحات للعنصر style, خاصيات العنصر style, التنسيق الافتراضي للعنصر style, تعلم html من الصفر

---

**أنماط التنسيق <style>**

يحتوي العنصر `<style>` معلومات عن تنسيق المستند أو جزءٍ منه، إذ تحتوى داخل هذا العنصر معلومات التنسيق التي من المتوقع أن تكون بلغة CSS.

مثال بسيط عن العنصر `<style>` مع بعض تعليمات التنسيق داخله:

```html
<style>
body {
  color: red;
}
</style>
```

## بطاقة العنصر

| تصنيفات المحتوى | البيانات الوصفية |
| --- | --- |
| المحتوى المسموح | محتوى نصي يُطابِق قيمة الخاصية type، ألا وهي text/css. |
| الوسم المختصر | لا يمكن حذف أيّ من وسمَي البداية أو النهاية |
| العناصر الأب | أي عنصر يقبل البيانات الوصفية. |
| واجهة DOM | HTMLStyleElement |

## دعم المتصفحات

| Chrome | Firefox | Edge | Safari | Opera |
| --- | --- | --- | --- | --- |
| مدعوم | مدعوم | مدعوم | مدعوم | مدعوم |

## الخاصيات

يمكن استخدام [الخاصيات العامة](https://coreiten.com/article/%D8%A7%D9%84%D8%AE%D8%A7%D8%B5%D9%8A%D8%A7%D8%AA-%D8%A7%D9%84%D8%B9%D8%A7%D9%85%D8%A9) في هذا العنصر.

### type

هذه الخاصية تُحدِّد نوع MIME للغة المستخدمة للتنسيق (لا يجب تحديد ترميز المحارف)؛ هذه الخاصية اختيارية والقيمة الافتراضية لها هي `text/css`.

```html
<style type="text/css">
body {
  color:red;
}
</style>
```

### media

هذه الخاصية تُعرِّف ما هي media query التي يجب تطبيق الأنماط عليها؛ القيمة الافتراضية هي `all`.

الأنماط الآتية ستُطبّق على الصفحة في حال طباعتها:

```html
<style media="print">
body {
  color:red;
}
</style>
```

### title

هذه الخاصية تستعمل لتعريف [أنماط بديلة](https://coreiten.com/article/%D8%A7%D9%84%D8%B9%D9%86%D8%B5%D8%B1-link) للصفحة.

## التنسيق الافتراضي

تخفي جميع المتصفحات هذا العنصر بضبط قيمة الخاصية `display` إلى `none`:

```css
style {
  display: none;
}
```

## انظر أيضًا

يُستخدَم العنصر `<link>` لإضافة صفحات أنماط خارجية إلى مستندات HTML.

## مواضيع ذات صلة

- [تعلم html من الصفر](https://coreiten.com/topic/%D8%AA%D8%B9%D9%84%D9%85-html-%D9%85%D9%86-%D8%A7%D9%84%D8%B5%D9%81%D8%B1)