Ғаламтор

Қойындылар мен аралықтарды құру үшін HTML және CSS-ті қалай пайдалану керек

Автор: Monica Porter
Жасалған Күн: 13 Сапта Жүру 2021
Жаңарту Күні: 14 Мамыр 2024
Anonim
Қойындылар мен аралықтарды құру үшін HTML және CSS-ті қалай пайдалану керек - Ғаламтор
Қойындылар мен аралықтарды құру үшін HTML және CSS-ті қалай пайдалану керек - Ғаламтор

Мазмұны

Браузерлер HTML жол үзілістерін тасалайды, сондықтан кеңістікті дұрыс құру үшін CSS қолданыңыз

Браузерлердің ақ кеңістікті қалай қолданатындығы алдымен интуитивті емес, әсіресе егер сіз гипермәтінді белгілеу тілі ақ кеңістікті мәтінді өңдеу бағдарламаларына қатысты қалай қолданатынын салыстырсаңыз. Мәтінді өңдеудің бағдарламалық жасақтамасында сіз құжатқа көптеген бос орындарды немесе қойындыларды қоса аласыз, сол аралық құжаттың мазмұнында көрінеді. Бұл WYSIWYG дизайны HTML-ге немесе веб-беттерге қатысты емес.

Басып шығарудағы бос орын

Мәтінді өңдеудің бағдарламалық жасақтамасында үш негізгі бос орын таңбасы болып табылады ғарыш, қойындысы, және вагонды қайтару. Бұл таңбалардың әрқайсысы белгілі бір жолмен әрекет етеді, бірақ HTML-де браузерлер олардың барлығын бірдей етеді. HTML түзетуінде бір бос орын немесе 100 бос орын қалдырсаңыз да, бос орындарды таблицалармен және кареткалармен қайта араластырсаңыз да, беттерді шолғыш көрсеткен кезде, олардың бәрі бір бос орынға қысқарады. Веб дизайн терминологиясында бұл белгілі ақ кеңістіктің құлдырауы. Веб-параққа бос кеңістікті қосу үшін сіз бұл әдеттегі аралық пернелерді қолдана алмайсыз, себебі шолғышта көрсетілген кеңістікті қайталанған кеңістіктер бір кеңістікке тарайды,


HTML қойындыларын құру және кеңістік құру үшін CSS пайдалану

Бүгінгі таңда веб-сайттар құрылымы мен стилін бөлумен жасалады. Беттің құрылымы HTML-мен өңделеді, ал стиль каскадты стильдермен белгіленеді. Аралықты құру немесе белгілі бір орналасуға қол жеткізу үшін HTML кодына бос орын таңбаларын қосудың орнына CSS-ке жүгініңіз.

Егер сіз мәтін бағандарын жасау үшін қойындыларды қолданғыңыз келсе, оны қолданыңыз

бағанның орналасуын алу үшін CSS-ке орналастырылған элементтер. Бұл орналасуды CSS қалқымалы, абсолютті және салыстырмалы орналастыру немесе Flexbox немесе CSS Grid тәрізді жаңа CSS орналасу әдістері арқылы жасауға болады.

Егер сіз шығаратын деректер кестелік деректер болса, кестелерді пайдаланып, сол мәліметтерді қалағаныңызша туралаңыз. Кестелер веб-дизайнда жиі жаман рэп алады, өйткені олар көптеген жылдар бойы таза орналасу құралы ретінде теріс пайдаланылған, бірақ егер сіздің мазмұныңызда нақты кестелік деректер болса, кестелер әлі де жарамды.


Шеттер, толтыру және мәтін шегінісі

CSS-пен аралықты құрудың ең көп таралған тәсілдері келесі CSS стильдерінің біреуін қолдану:

  • маржа
  • толтыру
  • мәтін шегінісі

Мысалы, параграфтың бірінші жолын төмендегі CSS-пен кесте тәрізді шегіністі шертіңіз (бұл сіздің параграфыңызда оған «бірінші» деген сыныптық атрибут бар дегенді ескеріңіз):

бірінші
мәтін шегінісі: 5em;
}

Бұл абзац бес таңбадан тұрады.

Элементтің жоғарғы, төменгі, сол немесе оң жақтарына (немесе сол жақтардың комбинациясына) бос орын қосу үшін CSS-де шеттік немесе толтыру қасиеттерін қолданыңыз. CSS-ке жүгіну арқылы кез-келген бос орынға қол жеткізіңіз.

CSS-ті жоқ мәтінді бірнеше бос орынға жылжыту

Егер сізде тек мәтін алдыңғы элементтен бірнеше орынға жылжытылса, үзілмейтін бос орынды пайдаланыңыз.


Бөлінбейтін кеңістікті пайдалану үшін сіз қосасыз HTML түзетуінде сізге қанша қажет болса.

HTML бұл бұзылмайтын кеңістіктерді құрметтейді және оларды бір кеңістікке түсірмейді. Алайда, бұл тәсіл дұрыс емес тәжірибе болып саналады, өйткені ол құжатқа макет қажеттіліктеріне қол жеткізу үшін қосымша HTML түзетулерін қосады. Мүмкіндігінше, қажетті эффектке қол жеткізу үшін жай бос орындарды қосудан аулақ болыңыз және оның орнына CSS шеттері мен толтырғыштарын пайдаланыңыз.

Қызықты Хабарламалар

Танымал Мақалалар

Geeky Tech сыйлықтарына арналған 8 керемет сайт
Ғаламтор

Geeky Tech сыйлықтарына арналған 8 керемет сайт

Ойлаңыз, Geek - бұл Жұлдыздар Соғысы мен Марвелден бастап, Зелда және Покемон аңызына дейінгі барлық нәрсеге деген сүйіспеншілігін көрсететін адамдарға арналған орын. Think Geek сайтында киімнен баст...
ITunes-те компьютерлерді қалай авторизациялауға болады
Технологиялар Министрі Санаттар

ITunes-те компьютерлерді қалай авторизациялауға болады

ITune-тегі компьютерге немесе Mac-қа авторизациялау, компьютерге сіздің Apple ID көмегімен сатып алған кез-келген медиа құралдарына кіруге және ойнатуға рұқсат береді. Apple корпорациясы бес компьюте...