இணையவலை வடிவமைப்பு

மையப்படுத்தப்பட்ட: CSS ஐ அமைப்பை

பக்கத்தின் அமைப்பை ஒரு மையமாக CSS ஐ வழி செய்ய அவசியமானதாக இருக்கிறது போது: உதாரணமாக, முக்கிய யூனிட் மையப்படுத்த. விரைவில் அல்லது பின்னர் எந்த குறியாக்கியில் பயன்படுத்த வேண்டும் இவை ஒவ்வொன்றும் இந்த பிரச்சனைக்கு பல்வேறு தீர்வுகளும் உள்ளன.

மையப்படுத்த உரை சீரமை

பெரும்பாலும் அலங்கார நோக்கங்களுக்கு உங்களை திணிக்க நேரத்தைக் குறைக்கும், இந்த வழக்கில் மையமாக உரை, CSS அமைக்க வேண்டும். முன்னதாக இந்த HTML-பண்புகளை பயன்படுத்தி செய்யப்பட்டது, ஆனால் இப்போது தரமான நடை தாள் உரை align வேண்டும். நீங்கள் நடுத்தர ஒரு ஒற்றை வரி கொண்டு தயாரிக்கப்படுகிறது உள்ள உரையின் CSS ஐ சீரமைப்பு வெளி திணிப்பு மாற்ற விரும்பும் தொகுதி மாறாக:

  • உரை சீரமைப்பு: மையம்;

இந்த சொத்து, வாரிசாக மற்றும் பெற்றோர் வரையிலான அனைத்துக் குழந்தைகளுக்கும் அனுப்பி வைக்கப்படுகிறது. அது உரை ஆனால் மற்ற கூறுகள் மட்டுமே பாதிக்கிறது. இந்த நோக்கத்திற்காக, அவர்கள் சிற்றெழுத்துக்களில் இருக்க வேண்டும் (எ.கா., இடைவெளி) அல்லது நிரை-தொகுதி (காட்சி சொத்து குறிப்பிடும் எந்த தொகுதிகள்: தொகுதி). இரண்டாவது விருப்பத்தைத் நீங்கள் அகலம் மற்றும் உறுப்பு உயரம், உள்தள்ளலை மேலும் நெகிழ்வான கட்டமைப்பு மாற்ற அனுமதிக்கிறது.

பக்கங்களை அடிக்கடி டேக் தனக்கு பண்பு align. இந்த உடனடியாக W3C, சீரமை பண்பு வழக்கற்றுப் ஒப்புக் என்பதால், குறியீடு தவறானது உள்ளது. ஒரு பக்கத்தில் அது பயன்படுத்தி பரிந்துரைக்கப்படவில்லை.

மையப்படுத்தப்பட்ட தொகுதி

நீங்கள் மத்தியில் கிராம ஒழுங்குமுறைப்படுத்த அமைக்க விரும்பினால், CSS ஐ மிகவும் வசதியாக வழி வழங்க முடியும்: வெளிப்புற திணிப்பு விளிம்பு பயன்படுத்த. பேட்டிங் தொகுதி உறுப்புகள் மேலும் லைன் தொகுதியாக குறிப்பிட முடியும். Svoysva மதிப்பு 0 (செங்குத்து திணிப்பு) மற்றும் வாகனக் கடன் (கிடைமட்டமாக தானியங்கி உள்தள்ளலை) இருக்க வேண்டும்:

  • விளிம்பு: 0 கார்;

இப்போது இந்த விருப்பத்தை முற்றிலும் சரியான கருதப்படுகிறது. CSS ஐ விளிம்பு சொத்து எங்களுக்கு பக்கத்தில் நிலைப்படுத்தல் உறுப்பு இணைந்துள்ள பல பிரச்சினைகளை தீர்க்க அனுமதிக்கிறது: வெளிப்புற திணிப்பு பயன்படுத்தி நீங்கள் சென்டர் ஒழுங்குமுறைப்படுத்த அமைக்க அனுமதிக்கிறது.

தொகுதி இடது அல்லது வலது ஓர சீரமைப்பு

சில நேரங்களில் CSS ஐ வழி மையம் ஒழுங்குமுறைப்படுத்த தேவையில்லை, ஆனால் அது அடுத்த இரண்டு தொகுதிகள், இடது பக்கத்தில் இருந்து மற்றொன்று பிற வைக்க அவசியம் - வலது இருந்து. இதற்காக மூன்று மதிப்புகளில் ஒன்றை ஆகலாம் மிதவை சொத்து உள்ளது: இடது, வலது அல்லது யாரும். நீங்கள் அருகருகில் வைக்கப்பட்ட வேண்டும் என்று இரண்டு தொகுதிகள் உள்ளதாக வைத்துக்கொள்வோம். அதன்பிறகு குறியீட்டை பின்வருமாறு இருக்கிறது:

  • .left {மிதவை: விட்டு;}
  • .right {மிதவை: வலது}

முதல் இரண்டு தொகுதிகள் (எ.கா., அடிக்குறிப்பு) கீழ் அமைந்துள்ளது அளிக்கப்படவேண்டும் மூன்றாவது தொகுதி, இருந்தால், அது தெளிவான அம்சம் பதிவு செய்ய அவசியம்:

  • .left {மிதவை: விட்டு;}
  • .right {மிதவை: வலது}
  • அடிக்குறிப்பில் {தெளிவான: இரு}

மொத்த ஓட்டம் வெளியே இடது மற்றும் வலது வீழ்ச்சி வகுப்புகளை தொகுதிகள், அதாவது, மற்ற உறுப்புகள் சீரமைக்கப்பட்டது கூறுகள் இருப்பது மிகவும் அலட்சியம் செய்துள்ளமை. சொத்து தெளிவான: இரு ஓட்டம் செல்கள் இருந்து துரிதப்படுத்திய அடிக்குறிப்பில் தொகுதி அல்லது வேறு எந்த புலப்படும் அனுமதிக்கிறது மற்றும் இடது மற்றும் வலது இரண்டு மடக்கு (மிதவை) தடை செய்கிறது. எனவே, நமது உதாரணத்தில், அடிக்குறிப்பு கீழ்நோக்கி இடம்பெயர்க்கப்படுகிறது.

செங்குத்து சீரமைப்பு

அங்கு CSS ஐ வழிகளில் மையத்தில் ஓரங்களை அமைக்க போதாது வழக்குகள் உள்ளன, நீங்கள் குழந்தை தொகுதி செங்குத்து நிலையை மாற்ற வேண்டும். எந்த வரி அல்லது நிரை-தொகுதி உறுப்பு, மேல் அல்லது கீழ் விளிம்பு எதிராக அழுத்தப்படும் முடியும் பெற்றோர் உறுப்பு மத்தியில் அமைந்துள்ள அல்லது ஒரு தன்னிச்சையான இடத்திலும் இருக்கும். பெரும்பாலும் தொகுதி மையத்தில் ஒழுங்குமுறைப்படுத்த தேவைப்படுகிறது, அது செங்குத்து-சீரமை பண்பு பயன்படுத்துகிறது. இரண்டு தொகுதிகள், மற்றொருவர் உள்ள காக்கப்பட்ட உள்ளன வேண்டும். நிரை-தொகுதி உறுப்பு (: இன்லைன் தொகுதி காட்சி) - இந்த உட்புற அலகு. அது செங்குத்து தொகுதி குழந்தை align அவசியம்:

  • மேல் எல்லை ஒழுங்குமுறைப்படுத்த - .child {செங்குத்து-சீரமைப்பு: மேல்};
  • மையம் - .child {செங்குத்து-சீரமைப்பு: நடுநிலை};
  • கீழே விளிம்பில் ஒழுங்குமுறைப்படுத்த - .child {செங்குத்து-சீரமைப்பு: கீழ்};

தொகுதி கூறுகள் ஆடியோ text-align, அல்லது செங்குத்து-சீரமை பொருந்தாது.

சீரமைக்கப்பட்டன அலகுகள் சாத்தியமான பிரச்சினைகள்

சில நேரங்களில் CSS ஐ வழி மையத்தில் align DIV ஒரு சிறிய சிக்கல் ஏற்படுத்தும். உதாரணமாக, ஒரு மிதவை பயன்படுத்தும் போது: .first, .second மற்றும் .third: உதாரணமாக, மூன்று தொகுதிகள் உள்ளன. இரண்டாவது மற்றும் மூன்றாவது வளாகங்கள், முதலிரண்டு ஆகியனவாகும். ஒரு வகுப்பில் ஒரு உறுப்பு இரண்டாவது இடது சீரமைக்கப்பட்டது, கடந்த தொகுதி - வலது. சீரமை பிறகு இரண்டு ஸ்ட்ரீம் இருந்து நீக்கப்பட்டார். பெற்றோர் உறுப்பு வரையறுக்கப்படவில்லை உயரம் என்றால் (எ.கா., 30em), அது துணை அலகுகள் உயரம் நீட்டவும் நிறுத்தப்படும். .second மற்றும் .third காண்கிறது இது ஒரு சிறப்பு அலகு, - இந்த பிழை தவிர்க்க, "ஸ்பேசர்" பயன்படுத்த. CSS ஐ குறியீடு:

  • .second {மிதந்து: இடது}
  • .third {மிதவை: வலது}
  • .clearfix {உயரம்: 0; தெளிவான: இரு;}

போலி அடிக்கடி பயன்படுத்தப்படுகிறது: பிறகு, மேலும் psevdorasporki உருவாக்குவதன் மூலம் இடத்தில் தொகுதிகள் திரும்ப அனுமதிக்கிறது (கொள்கலன் உள்ளே வகுப்பில் div மூலமாகவோ உதாரணமாக அமைந்ததும், ஒரு .first .left மற்றும் .right கொண்டுள்ளது):

  • .left {மிதவை: இடது}
  • .right {மிதவை: வலது}
  • கொள்கலன்: {உள்ளடக்கத்தை பிறகு: ''; காட்சி: அட்டவணை; தெளிவான: இரு;}

மேலே தரப்பட்ட - பரவலாகக் காணப்படும் சில வேறுபாடுகள் உள்ளன. நீங்கள் எப்போதும் பரிசோதனைகள் மூலம் psevdorasporki உருவாக்க எளிதான மற்றும் மிகவும் வசதியான வழி காணலாம்.

மற்றொரு சிக்கல் அடிக்கடி எதிர்கொள்ளும் அமைப்பை - வரிசை தொகுதி உறுப்புகள் ஒழுங்குமுறைப்படுத்த. அவர்களில் ஒவ்வொரு பிறகு ஒரு இடைவெளி தானாகவே சேர்க்கப்படும். கையாள அது எதிர்மறை உள்தள்ளலை மூலம் வரையறுக்கப்படுகிறது விளிம்பு சொத்து, உதவுகிறது. மிகக் குறைவாகப் பயன்படுத்தப்படும் உதாரணமாக, மீட்டமைத்தாலோ பிற வழிகளில் உள்ளன எழுத்துரு அளவு. இந்த வழக்கில், பெற்றோர் உறுப்பு பண்புகள் பதிவு எழுத்துரு அளவு: 0. உரை தொகுதிகள் உள்ள அமைந்துள்ள என்றால், வரிசை தொகுதி உறுப்புகள் தன்மைகள் ஆகியவை விருப்பப்படும் எழுத்துரு அளவு திரும்பியுள்ளனர். உதாரணமாக, எழுத்துரு அளவு: 1em. முறை எப்போதும் வசதியான அல்ல, அது மிகவும் பொதுவாக வெளி லாபம் தரும் பயன்படுத்தப்படுகிறது பதிப்பு.

ஒரு சிறிய தளத்தில் பொது அமைப்பு மற்றும் அமைப்பு, மற்றும் கடைகளில் பொருட்களை இடம், மற்றும் புகைப்படங்கள்: பிளாக்ஸ் இணைப்பது நீங்கள் அழகான மற்றும் செயல்பாட்டு பக்கங்களை உருவாக்க அனுமதிக்கிறது.

Similar articles

 

 

 

 

Trending Now

 

 

 

 

Newest

Copyright © 2018 ta.unansea.com. Theme powered by WordPress.