எந்த மதிப்புகளை உரை சீரமைக்கும் பண்புகளை எடுக்க முடியும்? மையம், அகலம் மற்றும் உள்தள்ளல் மூலம் HTML உரை சீரமைப்பு. பக்கத்தின் இடது பக்கத்தில் HTML உரை மற்றும் அதன் உள்தள்ளல்

CSS இன்டர்நெட் எக்ஸ்புளோரர் குரோம் ஓபரா சஃபாரி பயர்பாக்ஸ் அண்ட்ராய்டு iOS
2.1 6.0+ 8.0+ 1.0+ 3.5+ 1.0+ 1.0+ 1.0+ 1.0+
3 2.0+ 11.6+ 3.1+ 3.6+ 2.1+ 2.0+

சுருக்கமான தகவல்

CSS பதிப்புகள்

மதிப்புகள்

மையம் உரையை மையத்திற்கு சீரமைக்கிறது. உரைத் தொகுதி அமைந்துள்ள உலாவி சாளரத்தில் அல்லது கொள்கலனில் உரை கிடைமட்டமாக வைக்கப்படுகிறது. வலைப்பக்கத்தின் மையத்தில் இயங்கும் கண்ணுக்குத் தெரியாத அச்சில் உரையின் கோடுகள் கட்டப்பட்டிருப்பது போல் தெரிகிறது. இந்த சீரமைப்பு முறை தலைப்புகள் மற்றும் தலைப்புகள் போன்ற பல்வேறு கையொப்பங்களில் தீவிரமாகப் பயன்படுத்தப்படுகிறது; இது உரை வடிவமைப்பிற்கு அதிகாரப்பூர்வமான மற்றும் உறுதியான தோற்றத்தை அளிக்கிறது. மற்ற எல்லா நிகழ்வுகளிலும், மைய சீரமைப்பு அரிதாகவே பயன்படுத்தப்படுகிறது, ஏனெனில் இதுபோன்ற உரையை அதிக அளவில் படிக்க சிரமமாக உள்ளது. ஜஸ்டிஃபைட் என்பதை நியாயப்படுத்துங்கள், அதாவது ஒரே நேரத்தில் இடது மற்றும் வலதுபுறமாக சீரமைக்கப்பட்டது. இந்த செயலைச் செய்ய, இந்த வழக்கில் உலாவி வார்த்தைகளுக்கு இடையில் இடைவெளிகளைச் சேர்க்கிறது. இடது உரையை இடதுபுறமாக சீரமைக்கிறது. இந்த வழக்கில், உரையின் கோடுகள் இடதுபுறமாக சீரமைக்கப்படுகின்றன, மேலும் வலது விளிம்பு ஏணியாக அமைக்கப்பட்டிருக்கும். இந்த சீரமைப்பு முறை இணையதளங்களில் மிகவும் பிரபலமானது, ஏனெனில் இது பயனரை எளிதாகக் கண்டறிய அனுமதிக்கிறது புதிய கோடுபெரிய உரையை வசதியாகப் படிக்கவும். வலதுபுறம் உரையை வலப்புறம் சீரமைக்கிறது. இந்த சீரமைப்பு முறை முந்தைய வகைக்கு எதிரியாக செயல்படுகிறது. அதாவது, உரையின் வரிகள் வலது விளிம்பில் சீரமைக்கப்படுகின்றன, அதே சமயம் இடதுபுறம் "கிழிந்ததாக" இருக்கும். இடது விளிம்பு சீரமைக்கப்படாததால், புதிய வரிகள் படிக்கப்படும் இடத்தில், இந்த உரையை சீரமைத்ததை விட படிக்க கடினமாக உள்ளது. எனவே, வலது சீரமைப்பு பொதுவாக மூன்று வரிகளுக்கு மேல் இல்லாத குறுகிய தலைப்புகளுக்குப் பயன்படுத்தப்படுகிறது. உரையை வலமிருந்து இடமாகப் படிக்க வேண்டிய குறிப்பிட்ட தளங்களை நாங்கள் கருத்தில் கொள்ள மாட்டோம், ஒருவேளை இதேபோன்ற சீரமைப்பு முறை பயனுள்ளதாக இருக்கும். தானியங்கு உறுப்பு நிலையை மாற்றாது. மரபுரிமை பெற்றோரின் மதிப்பைப் பெறுகிறது. உரை வலமிருந்து இடமாகச் செல்லும்போது உரை இடமிருந்து வலமாகவும், வலமாகவும் சென்றால் இடதுபுறமாகத் தொடங்கவும். உரை வலமிருந்து இடமாகச் செல்லும்போது உரை இடமிருந்து வலமாகவும் இடதுபுறமாகவும் சென்றால் வலதுபுறம் முடிவடையும்.

HTML5 CSS2.1 IE Cr Op Sa Fx

உரை-சீரமைப்பு

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

இந்த எடுத்துக்காட்டின் முடிவு படத்தில் காட்டப்பட்டுள்ளது. 1.

அரிசி. 1. சஃபாரி உலாவியில் உரையை சீரமைக்கவும்

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

அரிசி. 2. இன்டர்நெட் எக்ஸ்புளோரர் 7 இல் உரை சீரமைப்பு

பொருள் மாதிரி

document.getElementById("elementID ").style.textAlign

உலாவிகள்

பதிப்பு 7.0 வரை மற்றும் உள்ளடக்கிய IE ஆனது தொகுதி-நிலை உறுப்புகளின் உள்ளடக்கங்களை மட்டுமல்ல, உறுப்புகளையும் சீரமைக்கிறது.

உரை சீரமைப்பு மற்றும் உள்தள்ளலை தீர்மானிக்கும் HTML குறிச்சொற்கள்

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

கீழே உள்ள உதாரணம் எவ்வாறு சீரமைப்பது என்பதைக் காட்டுகிறது அகலத்திற்கு உரைபக்கங்கள்:

align="இடது" align="right"

சேவைத் துறையில் பணிபுரியும் தொழிலாளர்களின் எண்ணிக்கை மற்றும் தகவல்களைப் பரப்புவது ஒவ்வொரு நாளும் அதிகரித்து வருகிறது. கடந்த நூற்றாண்டுகளின் சின்னங்கள் பண்ணை மற்றும் தொழிற்சாலை என்றால், தற்போதைய 21 ஆம் நூற்றாண்டின் சின்னம் தகவல் ஓட்டத்தை அணுகக்கூடிய கணினிகள் பொருத்தப்பட்ட அலுவலகமாகும்.

align="நியாயப்படுத்து" align="center"

சேவைத் துறையில் பணிபுரியும் தொழிலாளர்களின் எண்ணிக்கை மற்றும் தகவல்களைப் பரப்புவது ஒவ்வொரு நாளும் அதிகரித்து வருகிறது. கடந்த நூற்றாண்டுகளின் சின்னங்கள் பண்ணை மற்றும் தொழிற்சாலை என்றால், தற்போதைய 21 ஆம் நூற்றாண்டின் சின்னம் தகவல் ஓட்டத்தை அணுகக்கூடிய கணினிகள் பொருத்தப்பட்ட அலுவலகமாகும்.

சேவைத் துறையில் பணிபுரியும் தொழிலாளர்களின் எண்ணிக்கை மற்றும் தகவல்களைப் பரப்புவது ஒவ்வொரு நாளும் அதிகரித்து வருகிறது. கடந்த நூற்றாண்டுகளின் சின்னங்கள் பண்ணை மற்றும் தொழிற்சாலை என்றால், தற்போதைய 21 ஆம் நூற்றாண்டின் சின்னம் தகவல் ஓட்டத்தை அணுகக்கூடிய கணினிகள் பொருத்தப்பட்ட அலுவலகமாகும்.

நியாயமான மதிப்பு சீரானதை உறுதி செய்கிறது உரையை வலது மற்றும் இடப்புறமாக சீரமைக்கவும், அது அகலத்தில். இந்த முறை அச்சிடலில் பரவலாகப் பயன்படுத்தப்படுகிறது.

HTML இல் உரையை மையத்திற்கும் அகலத்திற்கும் சீரமைத்தல்

HTML இல் உரையை மையமாக, உரையை வலதுபுறமாக சீரமைக்கவும்:

விளைவாக:

பண்புக்கூறுகள் மற்றும் மதிப்புகள்

  • align="left" - வரையறுக்கிறது இடது உரை சீரமைப்பு(இயல்புநிலை).
  • align="center" - உரையை மையத்தில் சீரமைக்கிறது.
  • align="right" - உரையை வலது பக்கம் சீரமைக்கிறது.

சீரமை | HTML உரை உள்தள்ளல்

HTML உரைபக்கத்தின் இடதுபுறத்தில் அதன் உள்தள்ளல்

நாங்கள் உற்பத்தி செய்வோம் உரை உள்தள்ளல்இடதுபுறத்தில் இரண்டு வழிகளில்:

விளைவாக:

புதிய சாளரத்தில் பார்க்கவும்.

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

இந்தக் கட்டுரையில், டெக்ஸ்ட்-அலைன்-லாஸ்ட் பண்பின் அனைத்து அம்சங்களையும் உள்ளடக்குவோம், அது ஏற்றுக்கொள்ளும் மதிப்புகள் மற்றும் உலாவி ஆதரவு உட்பட.

பயன்பாடு மற்றும் ஏற்றுக்கொள்ளப்பட்ட மதிப்புகள்

டெக்ஸ்ட்-அலைன்-லாஸ்ட் பண்பைப் பயன்படுத்துவது எளிது. உரையின் கடைசி வரியை வலது பக்கம் சீரமைக்க குறியீடு துணுக்கு இதோ:

அறிமுக வரைபடம் ( text-align: justify; // IE மற்றும் Edge-க்கு தேவையான உரை-சீரமைப்பு-கடைசி: வலது; )

சொத்து ஏழு மதிப்புகளை எடுக்கலாம். align:left , right , and centre ஆகிய நிலையான HTML உரை மதிப்புகளை நீங்கள் அறிந்திருக்கலாம். அவை கடைசி வரியில் உள்ள உரையை கொள்கலனின் வலது, இடது மற்றும் மையத்தில் சீரமைக்கின்றன.

கீழே உள்ள எடுத்துக்காட்டு இந்த மூன்று மதிப்புகளுக்கு இடையிலான வேறுபாடுகளை விளக்குகிறது:

உதாரணத்தைப் பார்க்கவும்

நான்காவது மதிப்பு, ஜஸ்டிஃபை , கடைசி வரியை நியாயப்படுத்துகிறது, இதனால் கொள்கலனின் முழு அகலத்திலும் உரை சமமாக விநியோகிக்கப்படுகிறது. சொற்களுக்கு இடையில் பொருத்தமான இடைவெளிகளைச் சேர்ப்பதன் மூலம் இது அடையப்படுகிறது. உரையின் அளவைப் பொறுத்து, வார்த்தைகளுக்கு இடையில் மிகப்பெரிய இடைவெளிகளுடன் முடிவடையாமல், கடைசி வரியில் உள்ள இடத்தை முழுமையாக நிரப்ப இந்த பண்பு பயன்படுத்தப்படலாம்.

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

உதாரணத்தைப் பார்க்கவும்

உரையின் கடைசி வரியை இடதுபுறமாக சீரமைப்பது இடமிருந்து வலமாக வாசிக்கப்படும் மொழிகளுக்கு ஏற்றது ( LTR), ஆனால் RTL மொழிகளுக்கு இது தவறாக இருக்கும். இதுபோன்ற சந்தர்ப்பங்களில், இடது அல்லது வலது மதிப்புகளைப் பயன்படுத்துவது சிக்கல்களை ஏற்படுத்தும்.

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

நீங்கள் எழுதவும் படிக்கவும் தொடங்கும் இடத்திலிருந்து எதிர் விளிம்பில் உரையை சீரமைக்க இறுதி மதிப்பையும் பயன்படுத்தலாம். இது எல்.டி.ஆர் மொழிகளுக்கு வலதுபுறம் மற்றும் ஆர்டிஎல் மொழிகளுக்கு இடது மதிப்புக்கு ஒத்திருக்கும்.

உதாரணத்தைப் பார்க்கவும்

இந்த சொத்தின் இயல்பு மதிப்பு தானியங்கு ஆகும். பயன்படுத்தப்படும் போது, ​​கடைசி வரியில் உள்ள உரையானது HTML உரை align பண்புகளின் மதிப்பின்படி சீரமைக்கப்படும். இல்லையெனில், டெக்ஸ்ட் ஜஸ்டிஃபை பண்பைப் பகிர்ந்தளிக்கும் வகையில் அமைத்தால் மட்டுமே கொள்கலனின் அகலம் முழுவதும் உரை விநியோகிக்கப்படும். இல்லையெனில், எழுத்து மற்றும் வாசிப்பு தொடங்கும் விளிம்பில் உரை சீரமைக்கப்படும்.

முக்கிய குறிப்புகள்

text-align-last வேலை செய்ய, text-align பண்பு நியாயப்படுத்த அமைக்கப்பட வேண்டும். ஆனால் இந்த விதி ஐஇ மற்றும் எட்ஜில் மட்டுமே செயல்படுத்தப்படுகிறது. பயர்பாக்ஸ் மற்றும் குரோம் ஆகியவற்றில், பண்பை நியாயப்படுத்த உரை சீரமைக்காமல் செயல்படும். கீழே உள்ள எடுத்துக்காட்டில், உரை எட்ஜ் மற்றும் IE இல் சரியாக சீரமைக்கப்பட வேண்டும். மற்ற உலாவிகளில், பத்திகளின் கடைசி வரிகள் டெக்ஸ்ட்-அலைன்-லாஸ்ட் பண்பின் மதிப்பின்படி சீரமைக்கப்படும், மீதமுள்ள வரிகள் வலது-சீரமைக்கப்படும்.

டெமோவைப் பார்க்கவும்

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

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

உள்ளடக்கத்தின் கடைசி வரியை மட்டும் சீரமைக்க வேண்டும் என்றால், நீங்கள் :last-child அல்லது :last-of-type தேர்விகளைப் பயன்படுத்தலாம். கீழே உள்ள டெமோவிலிருந்து குறியீட்டை உதாரணமாக எடுத்துக் கொள்ளுங்கள்:

கட்டுரை ( text-align: justify; ) article p:last-of-type ( text-align-last: right; )

இது எங்கள் கட்டுரையின் கடைசி பத்தியின் கடைசி வரியை வலதுபுறமாக சீரமைக்கிறது. மீதமுள்ள வரிகள் HTML உரை சீரமைப்பு பண்புகளின் மதிப்பின் அடிப்படையில் சீரமைக்கப்படுகின்றன.

டெமோவைப் பார்க்கவும்

சீரமைப்பை மாற்ற நீங்கள் மற்ற தேர்வாளர்களையும் பயன்படுத்தலாம்: :even மற்றும் :odd.

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

பின்வரும் குறியீடு துணுக்கைக் கவனியுங்கள்:

p ( text-align: justify; ) p:nth-of-type(2) ( text-align-last: left; )

இரண்டாவது பத்தியில் ஒரே ஒரு வரி மட்டுமே இருந்தால், உரை சீரமைக்கப்படும், ஏனெனில் text-align-last முன்னுரிமை பெறும். கீழே உள்ள டெமோ காட்டுகிறது இந்த குறியீடு CSS செயல்பாட்டில் உள்ளது, மேலும் சில HTML எடுத்துக்காட்டுகள்சீரமைக்க.

டெமோவைப் பார்க்கவும்

உலாவி ஆதரவு

" என்ற விருப்பத்தைப் பயன்படுத்தி இந்த சொத்துக்கான ஆதரவை இயக்கலாம் சோதனை இணைய தள அம்சங்களை இயக்கவும்"வி கூகிள் குரோம்மற்றும் ஓபரா, முறையே 35 மற்றும் 22 பதிப்புகளில் தொடங்குகிறது. இது Chrome 47+ மற்றும் Opera 34+ இல் முழுமையாக ஆதரிக்கப்படுகிறது.

பயர்பாக்ஸில் இந்த சொத்தை பயன்படுத்த, நீங்கள் அதை -moz- உடன் முன்னொட்டாக வைக்க வேண்டும். தொடக்க மற்றும் இறுதி மதிப்புகள் IE ஆல் ஆதரிக்கப்படவில்லை. அதே நேரத்தில், எட்ஜ் இந்த சொத்தை முழுமையாக ஆதரிக்கிறது. டெக்ஸ்ட்-அலைன்-லாஸ்ட்-ஐ முழுமையாக ஆதரிக்காத ஒரே பிரபலமான உலாவி சஃபாரி ஆகும்.

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

  • எதுவும் இல்லை - உரை மாற்றங்கள் இல்லாமல் எழுதப்பட்டுள்ளது;
  • மூலதனமாக்கு- ஒவ்வொரு வார்த்தையும் ஒரு பெரிய எழுத்துடன் தொடங்கும்;
  • சிற்றெழுத்து - அனைத்து எழுத்துகளும் சிற்றெழுத்து (சிறிய எழுத்து);
  • பெரிய எழுத்து- அனைத்து எழுத்துகளும் பெரிய எழுத்துகளாக மாறும் (பெரிய எழுத்து).

எடுத்துக்காட்டாக, H1 தலைப்பு பெரிய எழுத்துக்களில் இருக்க வேண்டும் என்று பின்வரும் விதி குறிப்பிடுகிறது:

H1 (உரை-மாற்றம்: பெரிய எழுத்து;)

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

உரை அலங்காரம்: உரை-அலங்கார சொத்து

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


அரிசி. 11.4

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

ப:இணைப்பு (உரை-அலங்காரம்: அடிக்கோடு;)

சொற்களுக்கு இடையே உள்ள இடைவெளி: சொல் இடைவெளி பண்பு

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

எனவே, பின்வரும் விதி H1 தலைப்பில் உள்ள சொற்களுக்கு இடையிலான இடைவெளியை 1em ஆல் அதிகரிக்கிறது:

H1 (வார்த்தை இடைவெளி: 1எம்;)

Text alignment: text-align properties

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

பின்வரும் விதியானது DIV உறுப்புக்குள் உள்ள அனைத்து உறுப்புகளின் மையச் சீரமைப்பை அமைக்கிறது:

DIV (உரை-சீரமைப்பு: மையம்;)

முன்னணி: வரி உயர சொத்து

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

எழுத்து இடைவெளி: எழுத்து இடைவெளி சொத்து

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

பின்வரும் விதி H1 தலைப்பில் எழுத்து இடைவெளியை 0.5em அதிகரிக்கிறது.

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

கடந்த கட்டுரையில், கட்டமைக்கப்பட வேண்டிய பண்புகளைப் பார்த்தோம் தோற்றம்இல் எழுத்துருக்கள்.

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

CSS இல் உரை-அலங்காரம், உரை-சீரமைப்பு, உரை-இன்டென்ட்

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

இதற்கு நான்கு சாத்தியமான அர்த்தங்கள் மட்டுமே உள்ளன:

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

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

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

உரை-சீரமைப்பு:நியாயப்படுத்து;

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

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

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

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

உரை-இன்டென்ட்:-1எம்;

சரி, டெக்ஸ்ட்-இன்டென்ட்டின் பொதுவான பயன்பாடு (நிலையான சிவப்புக் கோட்டை அமைக்க) இப்படி இருக்கும்: text-indent:40px; (இந்தப் பத்திக்கு பொருந்தும்). இந்த விதி, முன்பு விவாதிக்கப்பட்ட உரை-சீரமைப்பைப் போலவே, தொகுதி கூறுகளுக்கு மட்டுமே பொருந்தும், அதாவது பல வரிகள் தோன்றலாம் (பத்திகள், தலைப்புகள், முதலியன).

சரி, இப்போது நாம் செல்லலாம் உரை-அலங்காரம்(ஒரு கிடைமட்ட கோட்டைப் பயன்படுத்தி வடிவமைப்பு), இது ஏற்கனவே அனைத்து Html உறுப்புகளுக்கும் (இன்லைன் மற்றும் பிளாக் இரண்டும்) பயன்படுத்தப்படுகிறது.

இதற்கு நான்கு அர்த்தங்கள் மட்டுமே இருக்க முடியும்:

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

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

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

உரை-அலங்காரம்: கோடு-மூலம் மேல்கோடு;

உரை அலங்காரத்திற்கான மதிப்புகள் (அவற்றில் பலவற்றை ஒரே நேரத்தில் பயன்படுத்த விரும்பினால்) எழுதப்பட வேண்டும் ஒரு விண்வெளி பாத்திரம் மூலம்.

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

அடுத்து நாம் செங்குத்து சீரமைப்பு - செங்குத்து-சீரமைப்பு. HTML குறியீட்டில் உள்ள அனைத்து உறுப்புகளுக்கும், இன்லைன் கூறுகளை அவற்றின் அடிப்படையுடன் தொடர்புடைய உரையுடன் சீரமைப்பது என்று பொருள். உண்மை, இதற்கு இது கொஞ்சம் வித்தியாசமானது - இந்த கலங்களில் உள்ள அனைத்து உள்ளடக்கங்களும் செங்குத்தாக சீரமைக்கப்படும்.

CSS செங்குத்து-சீரமைப்பு விதிக்கு, நீங்கள் பின்வரும் மதிப்புகளைப் பயன்படுத்தலாம்:

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

எடுத்துக்காட்டாக, நான் அதே விரிவுபடுத்தப்பட்ட உரைக்கு செங்குத்து-வரிசை: அடிப்படை என்று எழுதினால், எந்த மாற்றமும் ஏற்படாது, ஏனெனில் இந்த CSS விதிக்கு அடிப்படை மதிப்பு இயல்பாகவே பயன்படுத்தப்படுகிறது.

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

நீங்கள் இதை இப்படி எழுதலாம்:

vertical-align:10px;

மற்றும் நாம் பெறுவோம் துண்டுகளை பெரிய எழுத்துருவுடன் மேலே மாற்றவும்அடிப்படையுடன் தொடர்புடைய 10 பிக்சல்கள். நாம் எதிர்மறை மதிப்பை எழுதினால்:

செங்குத்து-சீரமைப்பு:-10px;

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

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

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

செங்குத்து-சீரமைப்பு:நடுத்தர;

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

Css சொத்தின் செங்குத்து-சீரமைப்பு துணை மற்றும் சூப்பர் ஆகியவற்றின் மதிப்புகள் நடந்த துணை மற்றும் சூப்பர்-குறியீட்டிற்கு ஒத்திருக்கும் தூய HTML(பயன்பாட்டிற்கு முன் CSS பண்புகள்காட்சி வடிவமைப்புக்காக).

உரை-மாற்றம், எழுத்து இடைவெளி, வார்த்தை இடைவெளி மற்றும் வெள்ளை-வெளி

எதுவும் முன்னிருப்பாகப் பயன்படுத்தப்படவில்லை மற்றும் உரையில் உள்ள எழுத்துக்கள் எந்த வகையிலும் மாறாது - Html இல் எழுதப்பட்டபடி, அவை இவ்வாறு காட்டப்படும். உரை-மாற்றத்திற்கான பெரிய எழுத்து துண்டில் உள்ள அனைத்து எழுத்துக்களையும் பெரிய எழுத்துகளாக மாற்றும் ( இந்த வாக்கியத்தில் ஒரு உதாரணம் காட்டப்பட்டுள்ளது, இதில் text-transform:percase rule பயன்படுத்தப்பட்டது, மேலும் எழுத்துக்கள் முதலில் சிறிய எழுத்தில் எழுதப்பட்டன).

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

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

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

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

எழுத்து இடைவெளி:0.4எம்;

அல்லது உங்களால் முடியும் "இந்தச் சொற்றொடரில் உள்ள சின்னங்களை எப்படி நெருக்கமாகக் கொண்டுவருவது"பயன்படுத்தி:

எழுத்து இடைவெளி:-1px;

வார்த்தை இடைவெளியைப் பற்றியும் இதைச் சொல்லலாம், ஒரே வித்தியாசம் என்னவென்றால், சொற்களுக்கு இடையிலான தூரம் மாறும், எடுத்துக்காட்டாக, இந்த சொற்றொடரில், இந்த CSS கட்டமைப்பைப் பயன்படுத்தி:

வார்த்தை இடைவெளி:4எம்;

இதேபோல், வார்த்தைகளுக்கு இடையிலான தூரத்தைக் குறைக்க, வார்த்தை இடைவெளியில் எதிர்மறை மதிப்புகளைப் பயன்படுத்தலாம்.

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

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

எனவே, வெள்ளை இடம் மூன்று மதிப்புகளில் ஒன்றை எடுக்கலாம்:

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

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

சோதனை உரையின் துண்டு

அதிர்ஷ்டம் உங்களுக்கு உரித்தாகட்டும்! வலைப்பதிவு தளத்தின் பக்கங்களில் விரைவில் சந்திப்போம்

நீங்கள் ஆர்வமாக இருக்கலாம்

பட்டியல் நடை (வகை, படம், நிலை) - Html குறியீட்டில் பட்டியல்களின் தோற்றத்தைத் தனிப்பயனாக்குவதற்கான Css விதிகள்
மவுஸ் கர்சரை மாற்ற Z-index மற்றும் CSS கர்சர் விதியைப் பயன்படுத்தி நிலைப்படுத்துதல்
திணிப்பு, விளிம்பு மற்றும் பார்டர் - அமைக்கப்பட்டுள்ளது CSS உள்மற்றும் வெளிப்புற விளிம்புகள், அத்துடன் அனைத்து பக்கங்களுக்கான சட்டங்களும் (மேல், கீழ், இடது, வலது)
CSS என்பது எதற்காக, அடுக்கு நடை தாள்களை எவ்வாறு இணைப்பது HTML ஆவணம்மற்றும் இந்த மொழியின் அடிப்படை தொடரியல்
CSS - பிளாக் லேஅவுட் கருவிகளில் மிதந்து தெளிவுபடுத்தவும்
CSS - அது என்ன, அடுக்கு நடை தாள்கள் எவ்வாறு இணைக்கப்படுகின்றன HTML குறியீடுநடை மற்றும் இணைப்பைப் பயன்படுத்துதல்
பரிமாண அலகுகள் (பிக்சல்கள், Em மற்றும் Ex) மற்றும் CSS இல் பரம்பரை விதிகள்
டேக், கிளாஸ், ஐடி மற்றும் யுனிவர்சல் செலக்டர்கள், அத்துடன் நவீன CSS இல் பண்புக்கூறு தேர்வாளர்கள்
நிலை (முழுமையான, உறவினர் மற்றும் நிலையான) - நிலைப்படுத்தும் முறைகள் HTML கூறுகள் CSS இல் (இடது, வலது, மேல் மற்றும் கீழ் விதிகள்)
CSS இல் பின்னணி (நிறம், நிலை, படம், மீண்டும், இணைப்பு) - பின்னணி அல்லது பின்னணி வண்ணத்தை அமைப்பதற்கான அனைத்தும் Html படங்கள்உறுப்புகள்