NTF Hub — NTF Web Lab
HTML • CSS • JavaScript • CSS Lab • Inspector
← الأدوات

NTF Web Lab — معمل تطوير الويب

اكتب HTML وCSS وJavaScript، وشاهد النتيجة مباشرة مع أدوات فحص تفاعلية، CSS Lab، محاكي Responsive، وقوالب مشاريع جاهزة.

الوضع Developer Lab
الإصدار v6
المكونات HTML • CSS • JS
وضع التشغيل
المشروع
Ctrl+Enter تشغيل | Ctrl+Space إكمال

HTML

CSS

JavaScript

المعاينة

جاهز
Responsive Auto
Viewport
Breakpoint
Active Media Queries
لا توجد media queries فعّالة.
Generate
Width
Min
Max
@media (max-width: ...)
Responsive Audit يفحص مشاكل التجاوب داخل المعاينة الحالية.
الحالة لم يتم الفحص بعد
اضغط Run Audit لفحص الصفحة.
اضغط تشغيل لعرض شجرة DOM.
اختر عنصرًا لعرض Selector Path.
اختر عنصرًا لعرض معلوماته.
اختر عنصرًا لعرض CSS Inspector.
اختر عنصرًا لعرض القواعد المطابقة، الخصائص المتجاوزة، والوراثة.
اختر عنصرًا لعرض Box Model.
Console output
console output...
لا توجد مشاريع محفوظة بعد.
CSS Lab اختر عنصرًا من المعاينة أو DOM
Flexbox Playground
Grid Builder
Box Model Studio
Color Studio
Typography Lab
Animation Studio
CSS Variables
HTML Lab اختر عنصرًا من المعاينة أو DOM

Visual DOM Editor

للسحب والإفلات: افتح تبويب Elements واسحب العنصر داخل شجرة DOM لتغيير ترتيبه.

Attributes Inspector

Text Editor

HTML Outline

اضغط تحديث التحليل.

Accessibility Checker

اضغط تحديث التحليل.

Semantic Checker

اضغط تحديث التحليل.

HTML Validator

اضغط تحديث التحليل.
NTF AI مساعد ذكي لمراجعة HTML وCSS وJavaScript داخل المعمل.
جاهز
اختر مهمة من الأعلى لإرسال الكود إلى NTF AI.