Курсҳо ва IDs Кӯмаки CSS-ро васеъ кунед
Сохтани вебсайтҳо дар веб-сайти имрӯза бояд фаҳмиши амиқи CSS (Саҳифаҳои Style Cascading) -ро талаб мекунад. Ин дастурҳоест, ки ба шумо вебсайтро барои муайян кардани он, ки чӣ тавр дар равзанаи браузер таҳия хоҳад шуд. Шумо як силсила "тарҳҳо" -ро ба ҳуҷҷати HTML-и худ, ки назар ва эҳсосоти вебсаатонро эҷод мекунад, истифода мебарад.
Роҳҳои зиёде барои татбиқи услубҳои дар боло номбаршуда истифода мешаванд, аммо бештари вақтҳо мехоҳед, ки танҳо як ҷузъи унсурҳоро дар ҳуҷҷат истифода баред, аммо на ҳамаи мисолҳои ин элементро истифода баред.
Шумо инчунин мехоҳед, ки сабки шумо эҷод кунед, ки шумо метавонед ба якчанд унсурҳо дар ҳуҷҷат муроҷиат кунед, бе такрори қоидаҳои стандартиро барои ҳар як мисоли алоҳида такрор кунед. Барои ноил шудан ба ин намудҳои дилхоҳ, шумо синфҳои синф ва ID-ро истифода мебаред. Ин хосиятҳо хусусиятҳои глобалӣ доранд, ки метавонанд ба қариб ҳар як HTML калимаҳоро истифода баранд .Ин маънои онро дорад, ки оё шумо тақсимоти параграфҳо, параграфҳо, пайвандҳо, рӯйхатҳо ё ягон дигар қисмҳои HTML дар ҳуҷҷати худ мебошед, шумо метавонед ба кликҳо ва нишонаҳои ID ба шумо кӯмак мекунад, ки ин вазифаҳоро иҷро кунед!
Интихоби синф
Интихоби класс ба шумо имконият медиҳад, ки дар як ҳуҷҷат як ҷузъи якхела ё таклифотро интихоб кунед. Масалан, шумо мехоҳед, ки қисмҳои муайяни матнро бо ранги дигар дар қисми дигари матн дар ҳуҷҷат номбар кунед. Ин қисмҳои банақшагирифта метавонанд «ҳушёр» бошанд, ки шумо дар саҳифа ҷойгиред. Шумо метавонед парагрҳои худро бо синфҳои зерин таъин кунед:
p {ранги: # 0000ff; }}
p.alert {ранги: # ff0000; }}
Ин сабақҳо рангҳои ҳама параграфҳоро ба сиёҳ (# 0000ff) гузоштаанд, аммо ҳар як параграф бо хусусиятҳои синфии "ҳушдор" ба ҷои сурх (# ff0000) тарроҳӣ хоҳад кард. Ин сабаби он аст, ки attribute class дар муқоиса бо қоидаҳои аввалини CSS, ки танҳо интихоби аломат истифода мекунад.
Ҳангоми кор бо CSS, қоидаҳои махсуси мушаххас каме мушаххасро кам мекунад. Пас, дар ин мисол, қоидаҳои умумӣ ранги ҳамаи параграфҳоро тасвир мекунад, аммо ҳукмҳои дуюм, қоидаи махсусро аз ҳадди аксар танзим мекунад, ки танҳо дар баъзе қисмҳо муқаррар карда мешаванд.
Ин аст, ки чӣ тавр ин метавонад дар баъзе ишораи HTML истифода шавад:
Ин параграф дар кабуд нишон дода мешавад, ки ин саҳифа барои саҳифа мебошад.
Ин параграф низ дар кабуд аст.
Ва ин параграф дар сурх нишон дода мешавад, зеро ин хосияти классикӣ ранги кабудро аз намуди интихобкунандаи элементҳо бар хоҳад гардонд.
Дар ин мисол, тарзи "p.alert" фақат ба параграфи унсурҳо, ки синфи ҳушдорро истифода мебарад, истифода мебарад. Агар шумо мехоҳед, ки синфро дар якчанд элементҳои HTML истифода баред, шумо элементи HTMLро аз ибтидо занг задан (танҳо боварӣ ҳосил кунед, ки давра (.) дар ҷои таркед), монанди ин:
.tert {ранги аслии: # ff0000;}
Ин синф ҳоло ба ҳама гуна унсуре, ки онро зарур аст, дастрас аст. Ҳама порчаи HTML, ки дорои арзиши классикии "ҳушдор" аст, ки ин услубро ба даст меорад. Дар HTML дар поён, мо ҳам параграф ва сатҳи сатри 2 дорем, ки синфи ҳушдорро истифода мебаранд. Ҳар дуи онҳо ранги аслии ранги сурхро дар асоси CSS нишон додаанд.
Параграф дар сурх сурх карда мешавад.
Ва ин h2 низ сурх хоҳад буд.
Дар сомонаҳои имрӯза, хусусиятҳои синф аксар вақт дар аксҳо истифода мешаванд, чунки онҳо аз нуқтаи назари мушаххасе, ки IDs доранд, осонтар кор мекунанд. Шумо бисёр саҳифаҳои HTML пайдо карда метавонед, ки дорои хосиятҳои синфҳо мебошанд, ки баъзеи онҳо дар як ҳуҷҷат якчанд маротиба такрор мешаванд ва дигарон метавонанд танҳо як маротиба пайдо шаванд.
Интихобгарони ID
Интихоби ID ба шумо имкон медиҳад, ки номро ба сабки мушаххас ном набаред ва бе пайвастшавӣ бо аломат ё дигар элементҳои HTML . Бигӯед, ки тақсимоти HTML дар бораи он, ки дар бораи ҳодиса маълумот мавҷуд аст, тақсим карда шуд.
Шумо метавонед ин тақсимоти хосияти "рӯйхат" -ро дошта бошед, ва агар шумо хоҳед, ки тақсимоти он бо сарҳади васеи сиёҳии 1-пикселӣ шумо чунин рамзи ID-ро нависед:
#event {border: 1px solid # 000; }}
Мушкили бо интихобкунандагони ID ин аст, ки онҳо дар ҳуҷҷати HTML такрор карда намешаванд. Онҳо бояд беназир бошанд (шумо метавонед дар ҳамон як ID дар якчанд саҳифаҳои сомонаи худ истифода кунед, аммо танҳо дар як ҳуҷҷати алоҳидаи HTML). Пас, агар шумо 3 рӯйдоде дошта бошед, ки ҳамаи онҳо ба ин марҳила заруранд, шумо бояд ба онҳо зикри номуайянии "event1", "event2" ва "event3" -ро дарбар гиред ва ҳар яке аз онҳо тарона кунед. Бинобар ин, истифодаи услуби дараҷаи дараҷаи «ҳодиса» хеле осон аст ва ҳамаи онҳоро якҷоя мекунад.
Масъалаи дигар бо хусусиятҳои номуайянӣ ин аст, ки онҳо дорои хосиятҳои баландтар аз сифатҳои синфӣ мебошанд. Ин маънои онро дорад, ки агар шумо бояд CSS-ро, ки услуби пештара муқаррар кардааст, бартараф карда шавад, агар шумо ба IDs хеле сахт такя карда тавонед, он душвор аст. Ин сабабест, ки бисёре аз таҳиягарони интернетӣ аз IDs дар тамғакоғази худ дур шудаанд, ҳатто агар онҳо танҳо як арзиши якхеларо истифода набаранд ва ба қариб ҳамаи намудҳо хосиятҳоро ба синфҳои камтари мушаххас табдил медиҳанд.
Яке аз маҳалҳое, ки хусусиятҳои ID-ро ба бозӣ фаро мегирад, вақте ки шумо хоҳед, ки саҳифаеро, ки дар саҳифаи пайвастшавӣ саҳифа дорад, эҷод кунед. Масалан, агар шумо вебсайти стандартии параллетӣ дошта бошед, ки ҳамаи мундариҷаро дар саҳифаи ягонаи дорои пайвандҳо, ки ба қисмҳои гуногуни ин саҳифа "партоянд" дохил мекунанд. Ин бо истифодаи хосиятҳои ID ва алоқаҳои матн, ки ин пайвастҳои пайвасткуниро истифода мебаранд, анҷом дода мешавад.
Шумо фақат арзиши ин хосиятро, ки пеш аз он # нишон дода шудааст, илова карда метавонед, ки ин хосият ба монанди:
Ин алоқа мебошад
Вақте ки тугмаи чапи мушро пахш кардаед, ин пайванд ба қисмати саҳифа, ки ин хосият дорад. Агар ягон унсур дар саҳифа ин арзиши ID-ро истифода накунад, пайваст кардан ҳеҷ коре намекунад.
Дар хотир доред, ки агар шумо хоҳед, ки дар саҳифа дар саҳифа саҳифаҳоро эҷод кунед, истифодаи унсурҳои ID талаб карда мешавад, аммо шумо ҳоло метавонед ба курсҳо барои мақсадҳои умумии CSS нигаред. Ин аст, ки чӣ гуна ман имрӯз саҳифаҳоро менависам - Ман интихобкунандагони синфро ба қадри имкон имконият медиҳам ва танҳо ба IDs, вақте ки ба ман лозим аст, ки на танҳо ҳамчун қалам барои CSS, балки ҳамчун пайванд дар саҳифаи худ истифода барад.
Мақолаи аслӣ аз тарафи Ҷенифер Кренин. Аз ҷониби Jeremy Girard таҳрир карда шуд 8/9/17