تشرح هذه المدونة كيفية استخدام علامة إطار العرض الوصفية لتصميم الويب سريع الاستجابة بتنسيق HTML:
ما هي علامة Viewport الوصفية؟
ال ' منفذ العرض 'هي العلامة الأكثر أهمية لإنشاء تصميم سريع الاستجابة من خلال التحكم في كيفية ظهور المحتوى على أحجام الشاشات المختلفة. يتم وضع هذه العلامة داخل ' 'ويحتوي على سمتين فيه. الأول هو ' اسم 'التي تخبرنا بالغرض من هذه العلامة والثانية هي' محتوى 'الذي يحتفظ بالبيانات المتعلقة بالقيمة الواردة في' اسم ' يصف.
السمات المختلفة للعلامة الوصفية لإطار العرض
تشتمل العلامة الوصفية لإطار العرض على السمات التالية التي يمكن وضعها كقيمة لـ ' محتوى ' يصف:
سمة 'العرض'
ال ' عرض ”تحدد المنطقة المرئية لصفحة الويب للمحتوى عموديًا. تبدو علامتها الوصفية كما يلي:
< ميتا اسم = 'منفذ العرض' محتوى = 'العرض = عرض الجهاز' >
سمة 'الارتفاع'
ال ' ارتفاع 'تحدد الطول الرأسي لصفحة الويب لضمان تطابق ارتفاع منفذ العرض مع ارتفاع الشاشة. تبدو علامتها الوصفية كما يلي:
< ميتا اسم = 'منفذ العرض' محتوى = 'الارتفاع = 400' >
سمة 'مقياس أولي'
ال ' النطاق الأولي تضمن السمة 'عرض صفحة الويب بمستوى تكبير مناسب عند تحميلها لأول مرة. على سبيل المثال ، قم بزيارة الرمز أدناه:
< ميتا اسم = 'منفذ العرض' محتوى = 'العرض = عرض الجهاز ، المقياس الأولي = 1.0' >سمة 'المقياس الأقصى'
ال ' الحجم الأقصى 'تحدد مستوى التكبير الأقصى لصفحة الويب لمنع مشاكل التخطيط:
< ميتا اسم = 'منفذ العرض' محتوى = 'العرض = عرض الجهاز ، الحد الأقصى للمقياس = 1.0' >
سمة 'المقياس الأدنى'
ال ' الحد الأدنى 'لتقييد المستخدم من التصغير كثيرًا عن طريق تحديد الحد الأدنى لمستوى مقياس التصغير:
< ميتا اسم = 'منفذ العرض' محتوى = 'العرض = عرض الجهاز ، الحد الأدنى للمقياس = 0.5' >سمة 'قابلة للتطوير من قِبل المستخدم'
ال ' قابلة للتطوير من قبل المستخدم 'تسمح أو لا تسمح للمستخدم بجعل شاشة صفحة الويب تصغير أو تكبير عن طريق تعيين القيمة على' لا ' أو ' نعم '. العلامة الوصفية التي تسمح للمستخدم بالتكبير أو التصغير هي:
< ميتا اسم = 'منفذ العرض' محتوى = 'العرض = عرض الجهاز ، قابل للتحجيم بواسطة المستخدم = نعم' >كيفية استخدام Viewport Meta Tag لتصميم الويب سريع الاستجابة بتنسيق HTML؟
لفهم استخدام العلامة الوصفية لإطار العرض لتصميم الويب سريع الاستجابة. دعونا نلقي نظرة على مثال:
افترض داخل ' بعد تجميع مقتطف الشفرة أعلاه ، تبدو صفحة الويب كما يلي: يُظهر الإخراج أن المحتوى لا يستجيب لأنه لا يتم عرضه بشكل مثالي على الأجهزة الصغيرة. الآن لجعله سريع الاستجابة ، أضف ' منفذ العرض ' علامة متغيرة: بعد تحديث الشفرة ، تبدو صفحة الويب على هذا النحو بأحجام مختلفة للشاشة: يوضح الناتج النهائي أن صفحة الويب تستجيب الآن بعد إضافة علامة وصفية داخل ' ' بطاقة شعار. تسمح العلامة الوصفية لإطار العرض للمطور بتقديم مجموعة من الإرشادات إلى المتصفح والتي تحدد كيفية عرض صفحة الويب على أجهزة مختلفة بحجم الشاشة. يتم وضع علامة meta tag داخل ' 'وتتضمن سمات تساعد في إنشاء تصميمات مواقع ويب سريعة الاستجابة. أوضحت هذه المدونة كيفية استخدام العلامة الوصفية لإطار العرض لتصميم الويب سريع الاستجابة بتنسيق HTML. ' بطاقة شعار: < شعبة >
< ص >
< ب > مدعوم من Linuxhint ، لفهم العلامة الوصفية لإطار العرض بشكل أفضل ، افتح صفحة الويب على شاشة مختلفة مقاس الأجهزة / ب >
< / ص >
< IMG src = '../bg.jpg' كل شئ = 'هاكر' عرض = '460' ارتفاع = '3. 4. 5' >
< ص أسلوب = 'المساحة المتروكة: 5 بكسل' >
< أنا > انضم إلى فريق Linuxhint < / أنا >
مدعوم من Linuxhint ، لفهم العلامة الوصفية لإطار العرض بشكل أفضل ، افتح صفحة الويب على شاشة مختلفة مقاس الأجهزة مدعومة من Linuxhint ، لفهم العلامة الوصفية لإطار العرض بشكل أفضل ، افتح صفحة الويب على شاشة مختلفة مقاس الأجهزة مدعومة من Linuxhint ، لفهم العلامة الوصفية لإطار العرض بشكل أفضل ، افتح صفحة الويب على شاشة مختلفة مقاس الأجهزة مدعومة من Linuxhint ، لفهم العلامة الوصفية لإطار العرض بشكل أفضل ، افتح صفحة الويب على شاشة مختلفة مقاس الأجهزة.
< / ص >
< / شعبة >
< ميتا اسم = 'منفذ العرض' محتوى = 'العرض = عرض الجهاز ، المقياس الأولي = 1.0' / >
< / رأس >
خاتمة