ALIGN="சீரமைப்பு"

BGCOLOR="பின்னணி நிறம்"

COLSPAN="கலங்களின் எண்ணிக்கை"

HEIGHT="செல் உயரம்"

ROWSPAN="கலங்களின் எண்ணிக்கை"

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

WIDTH="செல் அகலம்"

ALIGN பண்புக்கூறானது கலத்தின் உள்ளடக்கங்களின் சீரமைப்பைக் குறிப்பிடுகிறது. இது மூன்று மதிப்புகளில் ஒன்றைக் கொண்டிருக்கலாம்: இடது (இடது விளிம்பு), வலது (வலது விளிம்பு) மற்றும் மையம் (மையம்). இயல்புநிலை CENTER ஆகும்.

BGCOLOR பண்புக்கூறு கலத்திற்கான பின்னணி நிறத்தைக் குறிப்பிடுகிறது. அதன் மதிப்பை குறியீட்டு குறியீட்டில் அல்லது RGB வடிவத்தில் குறிப்பிடலாம்.

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

HEIGHT பண்புக்கூறு கலத்தின் உயரத்தை பிக்சல்களில் குறிப்பிடுகிறது.

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

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

WIDTH பண்புக்கூறு கலத்தின் அகலத்தை பிக்சல்களில் குறிப்பிடுகிறது.

ஒருங்கிணைப்புக்கான கேள்விகள்.

1. தலைப்புகளிலிருந்து பத்திகள் எவ்வாறு வேறுபடுகின்றன?

   என்ன வகையான பட்டியல்கள் உள்ளன?

   எழுத்துருவை மாற்ற என்ன குறிச்சொற்கள் பயன்படுத்தப்படுகின்றன "தகவல்"?

4. வீட்டு பாடம்:

1. முதல் வரிசையில் ஒரு கலமும், இரண்டாவதாக இரண்டும், மூன்றில் மூன்று கலங்களும் உள்ள அட்டவணையை உருவாக்கவும்.

2. குறிச்சொல்லின் ALIGN பண்புக்கூறுக்கு வெவ்வேறு மதிப்புகளைப் பயன்படுத்துவதன் விளைவை நடைமுறையில் கவனிக்கவும் .

html குறிச்சொற்கள் (8)

நான் தற்சமயம் html/css ஐக் கற்றுக் கொண்டிருக்கிறேன், மேலும் ஒரு பொதுவான தொழில்நுட்பம் பாடி டேக்கின் மூலத்தில் ஒரு பொதுவான div கொள்கலனை வைப்பதை கவனித்தேன்:

இதற்கு நல்ல காரணம் உள்ளதா? உடல் குறிச்சொல்லை ஏன் css குறிப்பிட முடியாது?

மூன்றாம் தரப்பு குறியீட்டாளர்களால் செய்யப்படும் மிகப்பெரிய கெட்ட பழக்கங்களில் இதுவும் ஒன்றாகும்.

எனக்கு மேலே உள்ள அனைத்து பதில்களும் தவறானவை. உடல் அகலம், விளிம்புகள், பார்டர்கள் போன்றவற்றை எடுத்துக்கொள்கிறது மற்றும் உங்கள் அசல் கொள்கலனைப் போலவே செயல்பட வேண்டும். html உறுப்பானது உங்கள் பின்னணி "கேன்வாஸ்" ஆகச் செயல்பட வேண்டும். நான் உருவாக்கிய டஜன் கணக்கான தளங்களில், நான் ஒரு div கொள்கலனை மட்டுமே பயன்படுத்த வேண்டும்.

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

அதை செய்யாதே. டிவ்களை சிக்கனமாகப் பயன்படுத்தவும் மற்றும் துல்லியமான அமைப்பைக் குறிக்கவும்.

புதுப்பிப்பு - SO இல் என்ன தவறு என்று தெரியவில்லை, ஏனெனில் இந்த பதிலை 5 ஆண்டுகளுக்கு முன்பு என்னால் திருத்த முடியும், ஆனால் நான் அதைச் செய்வதற்கு முன் எனக்கு 50 பிரதிநிதிகள் தேவை என்று கூறுவதால் என்னால் கருத்துகளுக்கு பதிலளிக்க முடியாது. அதன்படி, இங்கு பெறப்பட்ட பதில்களுடன் எனது பதிலையும் சேர்க்கிறேன். - = - = -

எனது பதிலுக்கு பல ஆண்டுகளுக்குப் பிறகு இதை நான் கண்டுபிடித்தேன், மேலும் சில பின்தொடர்தல் பதில்கள் இருப்பதைப் பார்த்தேன். நிச்சயமாக, நீங்கள் விளையாடுகிறீர்களா?

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

எடுத்துக்காட்டு 1: தெரியாதவர்களுக்கு இடமளிக்க வடிவமைக்கப்பட்ட ஒரு பொதுவான டெம்ப்ளேட். இந்த வழக்கில், நீங்கள் இயல்புநிலை CMS டெம்ப்ளேட்டைப் பார்க்கிறீர்கள், இது ஒரு div இன் உள்ளே ஒரு div உள்ளது.

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

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

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

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

இயல்பாக, பெரும்பாலான உலாவிகள் இணையப் பக்கத்தின் அளவை எடுத்துக் கொள்கின்றன. எனவே சில பக்கம் ஒரே மாதிரியாக காட்டப்படாது வெவ்வேறு உலாவிகள். எனவே பயனரின் பயன்பாடு குறிப்பிட்ட ஒருவருக்கு மாறலாம் HTML உறுப்பு. எடுத்துக்காட்டாக, ஒரு குறிப்பிட்ட HTML குறிச்சொல்லின் மார்க்கர், அளவு, அகலம் மற்றும் உயரத்தை ஒரு பயனர் சேர்க்கலாம்.

சில உலாவிகள் ( இன்டர்நெட் எக்ஸ்புளோரர்) உடலின் சில பண்புகளை ஆதரிக்காது, குறிப்பாக அகலம் மற்றும் அதிகபட்ச அகலம் .

எனக்கு மிகவும் பொதுவான காரணங்கள்:

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

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

உடல் அகலத்தை அமைக்கும்போது என்னால் முடியும். என் விஷயத்தில் - 960 பிக்சல்கள்.

இது நான் பயன்படுத்தும் css:

இது ஒரு நிலையான அகலம் கொண்ட இன்லைன் தொகுதிகளை சரியாக மையப்படுத்துகிறது.

இது அனைவருக்கும் பயனுள்ளதாக இருக்கும் என்று நம்புகிறேன்.

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

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

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

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

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

ஒரு கொள்கலனைப் பயன்படுத்தி, ஒரு வெப்மாஸ்டர் விரும்பிய பாணியை HTML பக்கத்தின் ஒரு குறிப்பிட்ட உறுப்புடன் "பிணைக்க" முடியும். கூடுதலாக, கொள்கலன் html பக்கத்தின் ஒரு உறுப்புக்கு நடத்தை "பைண்டிங்" வழங்குகிறது.

இரண்டு வகையான கொள்கலன்கள் உள்ளன: தொகுதி கொள்கலன்கள் மற்றும் இன்லைன் கொள்கலன்கள்.

உள்ளமைக்கப்பட்ட கொள்கலன் html பக்கத்தின் தொகுதி உறுப்பின் ஒரு பகுதியாகும். எடுத்துக்காட்டாக, ஒரு தொகுதி கொள்கலன் என்பது பத்தி உரையின் ஒரு பகுதியாக இருக்கலாம், ஒரு பத்தியில் வைக்கப்பட்டுள்ள ஒரு கிராஃபிக் படம் போன்றவை.

உட்பொதிக்கப்பட்ட கொள்கலனை உருவாக்க, இணைக்கப்பட்ட குறிச்சொல் பயன்படுத்தப்படுகிறது SPAN. தேவையான தொகுதி உறுப்பு துண்டு குறிச்சொல்லின் உள்ளே வைக்கப்பட்டுள்ளது SPAN, மற்றும் விரும்பிய பாணி CSS இல் உருவாக்கப்பட்டது, இது குறிச்சொல்லுடன் "இணைக்கப்பட்டது" SPAN.

பிளாக் கொள்கலன்கள்

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

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

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

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

DIV தளவமைப்பின் அடிப்படையில் 2 நெடுவரிசைகளில் இணையதள தளவமைப்பை உருவாக்குகிறோம்

எனவே, முந்தைய கட்டுரையில், எங்கள் ஹோஸ்டிங்கில் ஒரு சோதனை கோப்புறையை உருவாக்கினோம் (இந்த நோக்கங்களுக்காக, அதன் திறன்களின் கண்ணோட்டத்தைப் பார்க்கவும்) TEST கோப்புறை, அதில் எங்கள் எதிர்கால தளவமைப்பின் இரண்டு முக்கிய கோப்புகளை வைத்தோம்: Index.html மற்றும் ஸ்டைல் .css. உண்மையில், அவை சட்டத்தின் எங்கள் எளிய பதிப்பை உருவாக்கும்.

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

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

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

ஆனால் இந்த அடைவு ரூட் கோப்புறையாக இருக்காது. ரூட்டில் Index.php கோப்பும், நீங்கள் பயன்படுத்தும் இயந்திரத்தின் மற்ற எல்லா கோப்புகள் மற்றும் கோப்புறைகளும் இருக்க வேண்டும்.

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

உதாரணமாக, நீங்கள் பின்வரும் படத்தைக் காணலாம்:

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

சரி, கடைசி முயற்சியாக, ஹோஸ்டிங் உரிமையாளரிடம் கேட்கலாம். எனவே, இதுபோன்ற விஷயங்களில் உங்களுக்கு உதவ அவர்கள் கடமைப்பட்டுள்ளனர். ஆனால் பொதுவாக, இது பெரும்பாலும் அழைக்கப்படும் PUBLIC_HTML அல்லது HTMLDOCS.

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

FileZilla ஐப் பயன்படுத்தி ஒரு கோப்பகத்தை உருவாக்குவது எப்படி? ஆம், மிகவும் எளிமையானது. நிரலின் வலது பக்கத்தில் உள்ள இறுதி கோப்பகத்தைத் திறந்து, வெற்று இடத்தில் வலது கிளிக் செய்து, சூழல் மெனுவிலிருந்து "கோப்பகத்தை உருவாக்கு" என்பதைத் தேர்ந்தெடுக்கவும்.

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

உள்ளூர் டென்வர் சேவையகத்திற்கு, நீங்கள் பின்வரும் கோப்பகத்தில் ஒரு சோதனை கோப்பகத்தை உருவாக்க வேண்டும்:

சி:\சர்வர்\ஹோம்\லோக்கல் ஹோஸ்ட்\www\

இயக்கி "C" க்கு பதிலாக, உள்ளூர் சர்வர் நிறுவப்பட்ட உங்கள் கணினியில் இயக்ககத்தை குறிப்பிட வேண்டும். பின்னர், Div தளவமைப்பின் அடிப்படையில் நாங்கள் உருவாக்கும் 2-நெடுவரிசை தளவமைப்பைப் பார்க்க, உலாவியின் முகவரிப் பட்டியில் பின்வரும் பாதையைத் தட்டச்சு செய்ய வேண்டும்:

http://localhost/test/

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

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

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

https://site/test

ஆனால் இங்கே இரண்டு "ஆனால்" உள்ளன. முதலில், https://site/ க்கு பதிலாக உங்கள் URL ஐ உள்ளிட வேண்டும், இரண்டாவதாக, உங்கள் TEST கோப்பகத்தின் பெயரை உருவாக்கும் லத்தீன் எழுத்துக்களின் விஷயத்தில் கவனம் செலுத்துங்கள்.

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

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

இணையதள தளவமைப்பை divs இல் 2 நெடுவரிசைகளில் அமைக்கத் தொடங்குகிறோம்

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

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

நாங்கள் அவற்றின் அளவுகளை அமைத்து, பக்கத்தில் அவற்றின் நிலையை சரிசெய்வோம் CSS ஐப் பயன்படுத்துகிறது. எனவே ஆரம்பிக்கலாம்.

Index.html உடன் தொடங்குவோம். உங்களுக்கு வசதியான எடிட்டரில் திருத்துவதற்கு அதைத் திறக்கவும் (இந்த நோக்கத்திற்காக நான் சிறந்த இலவசத்தைப் பயன்படுத்துகிறேன் உரை ஆசிரியர்கள்நோட்பேட்++ - ).

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

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

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

ஏன் இதே போல்டரில்? ஏனென்றால், கோப்பிற்கான எந்தப் பாதையையும் நீங்கள் குறிப்பிடவில்லை என்றால் (அதன் பெயரை மட்டும் குறிப்பிடவும்), தற்போது இயங்கக்கூடிய கோப்பு அமைந்துள்ள அதே கோப்பகத்தில் உலாவி அதைத் தேடும் (எங்கள் விஷயத்தில், இது Index.html). அந்த. ஒரு பாதை இல்லாதது நான் Style.cssக்கான பாதையை படிவத்தில் எழுதியது போலவே இருக்கும்:

ஆனால் முதல் பதிவு விருப்பம் குறுகியது மற்றும் உலகளாவியது, ஏனெனில் கோப்புகளைக் கொண்ட கோப்புறைக்கான பாதை அங்கு நேரடியாகக் குறிப்பிடப்படவில்லை, அதாவது நீங்கள் மற்றொரு கோப்பகத்தில் Index.html மற்றும் Style.css கோப்புகளை வைக்கலாம், முகவரிப் பட்டியில் இருந்து Index.html ஐ அணுகலாம், மேலும் Style.css இன்னும் ஏற்றப்படும். உறவினர் மற்றும் முழுமையான இணைப்புகள் பற்றி மேலும் படிக்கவும்).

இது சம்பந்தமாக, ஹோஸ்டிங் அல்லது உள்ளூர் சேவையகத்தைப் பற்றி நீங்கள் கவலைப்பட வேண்டியதில்லை என்பதை நான் கவனிக்க விரும்புகிறேன். வெறும் உங்கள் கணினியில் உருவாக்கவும்எந்த கோப்புறையையும் அதில் எங்கள் Index.html மற்றும் Style.css ஐ வைக்கவும். அவற்றில் முதலில் Style.css கோப்பிற்கான பாதையை படிவத்தில் எழுதவும்:

அவ்வளவுதான். கோப்புகளைத் திறப்பதற்கு உங்கள் இயல்புநிலை உலாவியில் நீங்கள் இப்போது Index.html ஐ (அதில் இருமுறை கிளிக் செய்யவும்) திறக்க முடியும். HTML நீட்டிப்புஉங்கள் கணினியில், Style.css தானாகவே ஏற்றப்படும்.

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

தேவையான தொகுதிகளின் தொகுப்பை index.html இல் பதிவு செய்கிறோம்

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

இந்த தொகுதிகளின் பெயர்கள், தெளிவுக்காக தளவமைப்பின் பகுதிகளுக்கு Div கொள்கலன்களுக்குள் சேர்க்கப்படலாம். Html பாடி குறிச்சொற்களை திறப்பதற்கும் மூடுவதற்கும் இடையில் இதையெல்லாம் எழுதுவோம். Index.html இல் இதுபோன்ற குறியீட்டைப் பெறுவீர்கள்:

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

இலவச திட்டங்கள் மற்றும் பயனுள்ள குறிப்புகள் உலகம்
2024 whatsappss.ru