Сайттарды долбоорлоодо көбүнчө бир негизги суроону чечишиңиз керек: ар кандай экрандык чечимдер менен ачылганда барактын жүрүм-туруму кандай болот? Бул жерде эки вариант бар - "резина" (созулган) сайт баракчалары же статикалык. Биринчи вариант талкууланат. Макетти жактырсаңыз дагы, созулуп жасалгалоонун негизги жобосу - салыштырмалуу масштабдуулук.
Ал зарыл
- - HTML билими;
- - html-кодду түзөтүү программасы.
Нускамалар
1 кадам
Сайттын шаблону үчүн негизги файлды тандаңыз, ал негизги белгилөөнү чагылдырат. Бул index.html же index.php файлы болушу мүмкүн. Веб-сайттын шаблондорун түзөтүүчү мыкты программалардын бири - Macromedia Dreamweawer. Ушул программанын негизинде керектүү түзөтүү жүргүзүлөт.
Шаблон файлын ачыңыз же жаңысын "Файл" - "Жаңы", категориясы - "Негизги бет" - "HTML" же "Динамикалык баракча" - "PHP" буйругу менен түзүңүз. Бул жерде сайттын түзүмү эки файлдын биринде катталган жалпы учурду карайбыз.
2-кадам
Дасторкондо, див-блоктордо жана бириктирилген (бир эле мезгилде таблицалар жана блоктор) макеттин ар кандай түрлөрү бар экендиги эч кимге жашыруун эмес. HTML теги столдун жайгашуусуна жооп берет
Ар бир менчик үчүн пайызын (100%) көрсөтүңүз. Бул ар кандай геометриядагы экрандарга автоматтык түрдө жайылып жаткан стол клеткаларынын таасирине жетишет. Бул 19 дюймдук монитор же смартфон болушу мүмкүн - алардын ар бири мазмунду туура көчүрөт.
3-кадам
Эгер сиз таблицанын уячаларынын ортосундагы дал келүүнү так көрсөтүшүңүз керек болсо, анда төмөнкү мисалды колдонуңуз:
| … … 1-уячанын мазмуну. … | … … 2-уячанын мазмуну. … |
Бул жерден сиз уячалардын бири таблицанын өзү үчүн аныкталгандардын бардыгынын 30% кеңдиги менен көрсөтүлгөнүн көрө аласыз. Жөнөкөй эсептөө көрсөткөндөй, экинчи клетка үчүн 100% -30% = 70% калат. Бул учурда, стол уячаларынын биринде width атрибуту коюлбашы керектигин унутпаңыз. Браузер бардык эсептөөлөрдү өз алдынча жүргүзөт жана үстөлдү уячалар менен туура сунат. Таблицалардын ичиндеги мазмун ар кандай экрандарда туура созулуп, кичирейет.
4-кадам
Div жайгашуусу менен түзүлгөн кырдаалда, блок блоктору демейки шартта экрандын толук кеңдигине чейин созулуп, биринин артынан экинчиси солдон оңго, жогорудан ылдый карай жүрөт. Алардын геометриясын тактоо үчүн CCS классын же идентификаторун (ID) түзүңүз, анда сиз, мисалы, атрибуттар жана / же кутучанын көлөмү жана абалы категориясы үчүн (Box) көрсөтүңүз. Көрсөтүлгөн стилди сайттын белгилөө файлы менен байланыштырып, классты (ID) керектүү тегге байлоону унутпаңыз. Адатта, ал сценарийдин эң башында, бардык келечектеги сайттын геометриясын аныктап турат.
… … сайттын мазмуну. …
Же мындай:
… … сайттын мазмуну. …
CSS эрежесинин коду төмөнкүдөй болот:
… Менин классым {
туурасы: 30%;
бийиктиги: 50%;
}
#myID {
туурасы: 30%;
бийиктиги: 50%;
}
