وانەی 15 لە 67
وانەی ١٥: پانی و بەرزی وێنە (width و height)
فایلەکانی دەستپێک: فۆڵدەرێک بە ناوی lesson-15 بە هەمان شێوەی وانەی ١٤. وێنەی tea-glass.jpg 1200 پیکسڵ پانە و 900 پیکسڵ بەرزە. لاپەڕەکە ئەمەی لەناو <body> هەیە:
<h1>ڕێبەری چا</h1>
<img src="images/tea-glass.jpg" alt="چایێکی ڕەشی گەرم لە پیالەیەکی بچووکدا لەسەر ژێرپیالەیەک">بەشی ١: قەبارە دابنێ
فایلی دەستپێک بکەرەوە. وێنەکە گەورەیە. بە شێوەی بنەڕەتی، وێبگەڕ وێنەیەک بە قەبارەی ڕاستەقینەی پیشان دەدات، کە 1200 پیکسڵ پانییەکەیەتی. لەم نموونەیەی هێشتا
CSSی نییە، ئەمە زۆر گەورەترە لەوەی دەمانەوێت.بۆ کۆنترۆڵکردنی قەبارەکە، دوو تایبەتمەندی زیاد دەکەین:
width و height.<img src="images/tea-glass.jpg" alt="چایێکی ڕەشی گەرم لە پیالەیەکی بچووکدا لەسەر ژێرپیالەیەک" width="400" height="300">فایلەکە پاشەکەوتی بکە و نوێی بکەرەوە. وێنەکە ئێستا زۆر بچووکترە.
تێبینی: ژمارەکان بە پیکسڵن. تەنها ژمارەکە بنووسە، بەبێ «px».
بەشی ٢: ڕێژەکان بپارێزە
وێنە ڕەسەنەکە 1200 لە 900ە. ئەوە ڕێژەی چوار بۆ سێیە 4:3. قەبارە نوێکەمان، 400 لە 400، هەمان ڕێژەی هەیە، بۆیە وێنەکە دروست دەردەکەوێت.
ئێستا تەنها بەرزییەکە بگۆڕە:
<img src="images/tea-glass.jpg" alt="چایێکی ڕەشی گەرم لە پیالەیەکی بچووکدا لەسەر ژێرپیالەیەک" width="400" height="100">فایلەکە پاشەکەوتی بکە و نوێی بکەرەوە. وێنەکە پەستێنراو دیارە. بەرزییەکە بگەڕێنەرەوە بۆ 300.
ئەگەر یەک ژمارە بگۆڕیت، ئەوی تر بە هەمان ڕێژە بگۆڕە. بۆ پانییەکی 300، بەرزییەکە 225ـە.
هەڵەیەکی باو: پانی و بەرزییەک بەکاربهێنیت کە ڕێژەکەی لەگەڵ وێنەکە جیاوازە، کە وێنەکە درێژ دەکات یان دەیپەستێنێت.
بەشی ٣: بۆچی هەردووکیان دابنێین؟
بۆچی تەنها پانییەکە دانانێین؟ کاتێک هەردووکیان دانراون، وێبگەڕ قەبارەی وێنەکە دەزانێت پێش ئەوەی بارکرابێت. ئەو شوێنە بەتاڵ دەهێڵێتەوە، بۆیە تێکستی خوارەوە ناپەڕێتەوە کاتێک وێنەکە دەردەکەوێت. ئەمە ئەزموونێکی جواترە بۆ سەردانیکەر.
دواتر،
CSS ڕێگای باشترمان دەداتێ بۆ گونجاندنی وێنە لەگەڵ شاشە جیاوازەکان. ئێستا width و height دەستپێکێکی باشمان دەدەن.<body>
<h1>ڕێبەری چا</h1>
<img src="images/tea-glass.jpg" alt="چایێکی ڕەشی گەرم لە پیالەیەکی بچووکدا لەسەر ژێرپیالەیەک" width="400" height="300">
</body>پوختە
widthوheightقەبارەی وێنەیەک دیاری دەکەن، بە پیکسڵ.- تەنها ژمارەکە بنووسە، بەبێ یەکە.
- هەمان ڕێژەی ڕەسەنەکە بپارێزە، ئەگینا وێنەکە درێژ یان پەستێنراو دەردەکەوێت.
- دانانی هەردووکیان وا دەکات وێبگەڕ شوێن بپارێزێت، بۆ ئەوەی لاپەڕەکە لە کاتی بارکردندا نەپەڕێتەوە.
ڕاهێنان
١.
teapot.jpg زیاد بکە بۆ لاپەڕەکە. 800 پیکسڵ پانە و 600 بەرزە. بیکە بە 300 پیکسڵ پان، بەبێ پەستاندنی. ٢. بە ئەنقەست تەنها یەک ژمارە بگۆڕە، ببینە چی ڕوو دەدات، و چاکی بکەرەوە.
چوونەژوورەوە بۆ پاشەکەوتکردنی پێشکەوتنت لە فێربووندا.