ഇന്റർനെറ്റ്, വെബ് ഡിസൈൻ
മധ്യഭാഗത്തുള്ള: സി.എസ്.എസ്-ലേഔട്ട്
പേജിന് ലേഔട്ട് പലപ്പോഴും ഒരു കേന്ദ്രീകരിച്ചുള്ള സിഎസ്എസ്-വഴി അത്യാവശ്യമാണ്: ഉദാഹരണത്തിന്, പ്രധാന യൂണിറ്റ് മധ്യഭാഗത്തേക്ക്. ഇന്നല്ലെങ്കിൽ പിന്നീട് ഏതെങ്കിലും കോഡറും ഉപയോഗിക്കാം ഓരോന്നും ഈ പ്രശ്നം നിരവധി പരിഹാരങ്ങൾ, ഉണ്ട്.
സെന്ററിലേക്കുള്ള ടെക്സ്റ്റ് വിന്യസിക്കുക
പലപ്പോഴും നിങ്ങൾ അടിച്ചേൽപിക്കുന്നതിനു സമയം കുറയ്ക്കാൻ, ഈ കേസിൽ ടെക്സ്റ്റ് കേന്ദ്രമാക്കി സിഎസ്എസ് സജ്ജീകരിക്കണമെങ്കിൽ അലങ്കാര ആവശ്യങ്ങൾക്കായി. മുമ്പ് ഈ HTML-ആട്രിബ്യൂട്ടുകൾ ഉപയോഗിച്ച്, എന്നാൽ ഇപ്പോൾ അടിസ്ഥാന ഷീറ്റ് ഉപയോഗിച്ച് വാചക വിന്യാസം ആവശ്യമാണ്. നിങ്ങൾ നടുവിൽ വാചകത്തിന്റെ സി.എസ്.എസ് വിന്യാസത്തിൽ ബാഹ്യ പാഡിംഗോട് മാറ്റം ആഗ്രഹിക്കുന്ന തടയൽ വിപരീതമായി ഒരു ലൈൻ ഉപയോഗിച്ച് നിർമ്മിച്ചതാണ്:
- ടെക്സ്റ്റ്-വിന്യാസം: മധ്യത്തിൽ;
ഈ പ്രോപ്പർട്ടി മാതാപിതാക്കളുടെ നിന്ന് കുട്ടികൾക്ക് അവകാശമായിരുന്നതുട പാസാക്കുന്നതിന് ആണ്. ഇത് ടെക്സ്റ്റ് മാത്രമല്ല മറ്റ് ഘടകങ്ങൾ മാത്രമല്ല ബാധിക്കുന്നു. ഈ ആവശ്യത്തിനായി, അവർ ചെറിയക്ഷരം വേണം (ഉദാ, ചാൺ) അല്ലെങ്കിൽ വരി-ബ്ലോക്ക് (ഡിസ്പ്ലേ പ്രോപ്പർട്ടി വ്യക്തമാക്കുന്ന ഏതെങ്കിലും ബ്ലോക്കുകൾ: ബ്ലോക്ക്). അവസാന ഓപ്ഷൻ പുറമേ നിങ്ങൾ തിരിച്ചറിയൽ എന്ന ഘടകം, കൂടുതൽ ഉത്തമമായ ക്രമീകരണം എന്ന വീതിയും ഉയരവും മാറ്റാൻ അനുവദിക്കുന്നു.
പേജുകൾ പലപ്പോഴും ടാഗ് തനിക്കു ആട്രിബ്യൂട്ട് വിന്യസിക്കുക. ഇത് ഉടൻ W3C വിന്യസിക്കുക ആട്രിബ്യൂട്ട് കാലഹരണപ്പെട്ട ഏറ്റുപറഞ്ഞ ശേഷം, കോഡ് അസാധുവാണ് ചെയ്യുന്നു. ഒരു പേജിൽ അത് ഉപയോഗിച്ച് ശുപാർശ ചെയ്തിട്ടില്ല.
മധ്യഭാഗത്ത് ബ്ലോക്ക്
ബാഹ്യ പാഡിംഗോട് മാർജിൻ ഉപയോഗം: നിങ്ങൾ നടുവിൽ കളരി അലൈൻമെന്റ് സജ്ജീകരിക്കണമെങ്കിൽ, സി.എസ്.എസ് തികച്ചും ഒരു സുഖപ്രദമായ വാഗ്ദാനം കഴിയും. പാഡിംഗ് ബ്ലോക്ക് മൂലകങ്ങളുടെ വ്യക്തമാക്കണം കഴിയും, ലൈൻ-ബ്ലോക്ക്. സ്വൊയ്സ്വ മൂല്യം 0 (റിയലിസം), സ്വയം (തിരശ്ചീനമായി ഓട്ടോമാറ്റിക് തിരിച്ചറിയൽ) ആയിരിക്കണം:
- മാർജിൻ: 0 ഓട്ടോ;
ഇപ്പോൾ ഈ ഓപ്ഷൻ തികച്ചും സാധുവായ അംഗീകരിച്ചിട്ടുണ്ട്. ബാഹ്യ പാഡിംഗോട് ഉപയോഗിക്കുന്നതും മധ്യഭാഗത്ത് അലൈൻമെന്റ് സജ്ജമാക്കാൻ അനുവദിക്കുന്നു: സിഎസ്എസ്-മാർജിൻ പ്രോപ്പർട്ടി പേജിൽ സ്ഥാനനിർണ്ണയം ഘടകം ബന്ധപ്പെട്ട പല പ്രശ്നങ്ങളും പരിഹരിക്കാൻ നമ്മെ അനുവദിക്കുന്നു.
തടയൽ എന്ന ഇടത് അല്ലെങ്കിൽ വലത് അറ്റം അലൈൻമെന്റ്
ചിലപ്പോൾ സിഎസ്എസ്-വഴി കേന്ദ്രം അലൈൻമെന്റ് ആവശ്യമില്ല, എന്നാൽ അടുത്ത രണ്ടു ബ്ലോക്കുകൾ, ഇടതു ഭാഗത്തു നിന്നും ഒരു മറ്റ് പറ്റൂ - വലത് നിന്നും. ഇടത്, വലത് അല്ലെങ്കിൽ ആരും: ഈ മൂന്നു മൂല്യങ്ങളിൽ ഒന്ന് എടുക്കുന്ന ഫ്ലോട്ട് പ്രോപ്പർട്ടി, ഇല്ല. നിങ്ങൾ ഇരുവശങ്ങളിലായി വച്ച വേണം രണ്ടു ബ്ലോക്കുകൾ പറയട്ടെ. അപ്പോൾ കോഡ് താഴെ കൊടുക്കുന്നു:
- ചേരുമായിരുന്നുള്ളു {ഫ്ലോട്ട്: ശേഷിക്കുന്നു;}
- എന്റെ ബയോഡേറ്റ {ഫ്ലോട്ട്: വലത്}
ആദ്യ രണ്ട് ബ്ലോക്കുകൾ (ഉദാ, അടിക്കുറിപ്പ്) പ്രകാരം സ്ഥിതി വേണം ഒരു മൂന്നാം ബ്ലോക്ക്, ഇല്ല എങ്കിൽ, അത് വ്യക്തമായ സവിശേഷത രജിസ്റ്റർ അത്യാവശ്യമാണ്:
- ചേരുമായിരുന്നുള്ളു {ഫ്ലോട്ട്: ശേഷിക്കുന്നു;}
- എന്റെ ബയോഡേറ്റ {ഫ്ലോട്ട്: വലത്}
- അടിക്കുറിപ്പ് {വ്യക്തമായ: രണ്ട്}
മൊത്തം ഒഴുക്ക് നിന്നു ഇടത്, വലത് വീഴ്ചയുടെ ക്ലാസുകൾ ബ്ലോക്ക്, ആ, എന്നു വിന്യസിച്ചിരിക്കുന്ന ഘടകങ്ങൾ തന്നെ നിലനിൽപ്പിനു അവഗണിച്ചു എല്ലാ ഘടകങ്ങളും വസ്തുത. പ്രോപ്പർട്ടി വ്യക്തമായ: അടിക്കുറിപ്പ് തടയൽ അനുവദിക്കുന്നു അല്ലെങ്കിൽ മറ്റേതെങ്കിലും കാണാവുന്ന രണ്ട് ഒഴുക്ക് കോശങ്ങൾ നിന്ന് പ്രെചിപിതതെദ് ആൻഡ് ഇടതും വലതും രണ്ടിലും (ഫ്ലോട്ട്) പൊതിയാൻ നിരോധിക്കുന്നു. അതുകൊണ്ട്, നമ്മുടെ ഉദാഹരണത്തിൽ, അടിക്കുറിപ്പ് താഴോട്ട് നാടുവിട്ടുപോയ ആണ്.
ലംബമായ വിന്യാസം
സി.എസ്.എസ്-വഴികൾ കേന്ദ്രം അലൈൻമെന്റ് സജ്ജമാക്കാൻ പോരാ, നിങ്ങൾക്ക് കുട്ടിയുടെ തടയൽ വെർട്ടിക്കൽ സ്ഥാനം മാറ്റേണ്ടതുണ്ട് സാഹചര്യങ്ങളിൽ ഉണ്ട്. ഏതെങ്കിലും ലൈൻ അല്ലെങ്കിൽ വരി-ബ്ലോക്ക് ഘടകം, അപ്പർ അല്ലെങ്കിൽ താഴത്തെ എഡ്ജ് നേരെ അമർത്തി കഴിയും മൂല ഘടകം മധ്യത്തിൽ സ്ഥിതി അല്ലെങ്കിൽ എത്രവേണമെങ്കിലും ലൊക്കേഷനിൽ ആയിരിക്കും. പലപ്പോഴും അത് ലംബ-വിന്യസിക്കുക ആട്രിബ്യൂട്ട് ഉപയോഗിക്കുന്നു, തടയൽ കേന്ദ്രത്തിൽ അലൈൻമെന്റ് ആവശ്യമാണ്. രണ്ടു ബ്ലോക്കുകൾ, മറ്റ് നെസ്റ്റഡ് ഒരു ഉണ്ട് കരുതുക. വരി-ബ്ലോക്ക് ഘടകം (: ഇൻലൈൻ-ബ്ലോക്ക് ഡിസ്പ്ലേ) - ഈ ഇൻഡോർ യൂണിറ്റ് ൽ. ഇത് ലംബമായ ബ്ലോക്ക് കുട്ടി വിന്യസിക്കുക അത്യാവശ്യമാണ്:
- ന്റെമേലതിരു് അലൈൻമെന്റ് - .ഛില്ദ് {ലംബ-വിന്യാസം: മുകളിൽ};
- കേന്ദ്രീകരിച്ചുള്ള - .ഛില്ദ് {ലംബ-വിന്യാസം: മധ്യത്തിൽ};
- ചുവടറ്റത്തെ അലൈൻമെന്റ് - .ഛില്ദ് {ലംബ-വിന്യാസം: ചുവടെ};
ഓഡിയോ ടെക്സ്റ്റ്-വിന്യസിക്കുക, ലംബ-വിന്യസിക്കുക ബാധകമല്ല ബ്ലോക്ക് ഘടകങ്ങൾ ന്.
വിന്യസിച്ച യൂണിറ്റ് സാധ്യമായ പ്രശ്നങ്ങൾ
ചിലപ്പോൾ സിഎസ്എസ്-വഴി കേന്ദ്രം അല്പം കുഴപ്പങ്ങൾ കഴിയും വിന്യസിക്കുക div. ഉദാഹരണത്തിന്, ഒരു ഫ്ലോട്ട് ഉപയോഗിച്ച്: .കല്യാണപ്പാര്ട്ടിയുടെ കടവുമായി രണ്ടാം ആൻഡ് പകര്ത്തി: ഉദാഹരണത്തിന്, മൂന്ന് ബ്ലോക്കുകൾ ഉണ്ട്. രണ്ടാം മൂന്നാം ബ്ലോക്കുകൾ ആദ്യം കിടക്കുന്നു. ഒരു ക്ലാസ് രണ്ടാം ഇടത്-വിന്യസിച്ചിരിക്കുന്ന, കഴിഞ്ഞ തടയൽ ഒരു ഘടകം - വലതുഭാഗത്ത്. പരിപൂര്ണമാണ് ശേഷം രണ്ടു സ്ട്രീമിൽ നിന്ന് ഒഴിവാക്കി. മൂല ഘടകം ഉയരം (ഉദാ, ൩൦എമ്) എന്നാണറിയപ്പെടുന്നത് എങ്കിൽ, അത് സബ്സിഡിയറി യൂണിറ്റുകൾ ഉയരം നീട്ടി നിരതരായി ചെയ്യും. അയ്യ എന്ന ആൻഡ് പകര്ത്തി കാണുന്നു ഒരു പ്രത്യേക യൂണിറ്റ്, - ഈ പിശക് ഒഴിവാക്കുന്നതിന്, "സ്പേസര്" ഉപയോഗിക്കുക. സിഎസ്എസ്-കോഡ്:
- ഫിയൊനിക്സ് {ഫ്ലോട്ട്: ഇടത്}
- പകര്ത്തി {ഫ്ലോട്ട്: വലത്}
- .ച്ലെഅര്ഫിക്സ {ഉയരം: 0; വ്യക്തമായ: രണ്ടും;}
പലപ്പോഴും ഉപയോഗിച്ച കപട: ശേഷം, പുറമേ പ്സെവ്ദൊരസ്പൊര്കി സൃഷ്ടിക്കുന്നതിലൂടെ സ്ഥലത്തേക്കു ബ്ലോക്കുകൾ തിരികെ അനുവദിക്കുന്ന (കണ്ടെയ്നർ ഉള്ളിൽ ക്ലാസ് കളരി ഉദാഹരണ സ്ഥിതിചെയ്യുന്നത് ഒരു ബഹിരെ ചേരുമായിരുന്നുള്ളു ആൻഡ് എന്റെ ബയോഡേറ്റ അടങ്ങുന്നതാണ്):
- ചേരുമായിരുന്നുള്ളു {ഫ്ലോട്ട്: ഇടത്}
- എന്റെ ബയോഡേറ്റ {ഫ്ലോട്ട്: വലത്}
- .ചൊംതൈനെര്: {ഉള്ളടക്കം ശേഷം: ''; ഡിസ്പ്ലേ: പട്ടിക; വ്യക്തമായ: രണ്ടും;}
മുകളിൽ - ഏറ്റവും സാധാരണമായ, ചില വ്യതിയാനങ്ങൾ ഉണ്ടെങ്കിലും അവ. നിങ്ങൾക്ക് എല്ലായ്പ്പോഴും പരീക്ഷണങ്ങളിൽ പ്സെവ്ദൊരസ്പൊര്കി സൃഷ്ടിക്കാൻ ഏറ്റവും എളുപ്പവും സൗകര്യപ്രദവുമായ കണ്ടെത്താൻ കഴിയും.
പതിവായി നേരിട്ടു ലേഔട്ട് മറ്റൊരു പ്രശ്നം - ലൈൻ-ബ്ലോക്ക് മൂലകങ്ങളുടെ വിന്യാസം. ഒരു സ്പേസ് അവരിൽ ഓരോ ശേഷം സ്വയം ചേർത്തു. നെഗറ്റീവ് തിരിച്ചറിയൽ നിർവചിച്ചുണ്ട് ഏത് അരികുകൾ പ്രോപ്പർട്ടി, സഹായിക്കുന്നു കൈകാര്യം ചെയ്യുക. അധികമായി ഉപയോഗിക്കുന്ന രീതികൾ ഉദാഹരണത്തിന്, റീസെറ്റ്, ഉണ്ട് ഫോണ്ട് വലിപ്പം. ഈ സാഹചര്യത്തിൽ, മൂല ഘടകം വിശേഷതകൾ രജിസ്റ്റർ ഫോണ്ട്-വലിപ്പം: 0. വാചകത്തിന്റെ എബൌട്ട് എങ്കിൽ, ലൈൻ-ബ്ലോക്ക് മൂലകങ്ങളുടെ പ്രോപ്പർട്ടികൾ ആവശ്യമുള്ള ഫോണ്ട് വലിപ്പം മടങ്ങിയെത്തിയാൽ. ൧എമ്:, ഫോണ്ട് സൈസ് ഉദാഹരണത്തിന്. രീതി എപ്പോഴും സുഖ, അതിനാൽ അത് വളരെ സാധാരണയായി ഉപയോഗിക്കുന്ന ബാഹ്യ മാര്ജിന് കൂടെ പതിപ്പ്.
ജനറൽ ലേഔട്ട് ലേഔട്ട്, കടകളിൽ സാധനങ്ങൾ സ്ഥാനം, ഒരു ചെറിയ സൈറ്റിൽ ഫോട്ടോകൾ: പരിപൂര്ണമാണ് ബ്ലോക്ക് നിങ്ങൾ എന്നാല്, പി പേജുകൾ സൃഷ്ടിക്കാൻ അനുവദിക്കുന്നു.
Similar articles
Trending Now