CSS2, CSS3 എന്നിവ തമ്മിലുള്ള വ്യത്യാസം

CSS3- ലേക്കുള്ള പ്രധാന മാറ്റങ്ങൾ മനസിലാക്കുന്നു

CSS2, CSS3 എന്നിവ തമ്മിലുള്ള വലിയ വ്യത്യാസം, മൊഡ്യൂളുകൾ എന്ന് വിളിക്കുന്ന വിവിധ ഭാഗങ്ങളായി CSS3 വേർതിരിച്ചിട്ടുണ്ട്. ഈ മൊഡ്യൂളുകൾ ഓരോന്നും W3C വഴി ശുപാർശ ചെയ്യുന്ന പ്രക്രിയയുടെ വിവിധ ഘട്ടങ്ങളിൽ നടക്കുന്നു. ഈ പ്രോസസ്സ്, വിവിധ നിർമ്മാതാക്കളുടെ ബ്രൗസറിൽ സ്വീകരിച്ചതും നടപ്പിലാക്കുന്നതുമായ വിവിധ ഘടകങ്ങൾക്കായി കൂടുതൽ എളുപ്പമാക്കിത്തീർത്തിട്ടുണ്ട്.

നിങ്ങൾ ഈ പ്രക്രിയയെ CSS2- ൽ എന്ത്മായി താരതമ്യം ചെയ്താലും എല്ലാം അതിൽ ഉൾപ്പെടുത്തിയിരിക്കുന്ന എല്ലാ സ്റ്റാൻഡേഡ് ഷീറ്റുകളുടെയും ഒരു ഡോക്യുമെന്റായി സമർപ്പിച്ചു, ശുപാർശകൾ ലംഘിക്കുന്നതിന്റെ ചെറിയ ഗുണങ്ങളും വ്യക്തിഗത കഷണങ്ങളും നിങ്ങൾക്ക് കാണാനാകുന്നു. ഓരോ ഘടകങ്ങളും വ്യക്തിഗതമായി പ്രവർത്തിക്കുന്നതിനാൽ, CSS3 മൊഡ്യൂളുകളുടെ വിപുലമായ ബ്രൌസർ പിന്തുണ ഞങ്ങൾക്ക് ഉണ്ട്.

പുതിയതും മാറുന്നതും ആയ സവിശേഷതകളേപ്പോലെ, നിങ്ങൾക്ക് കഴിയുന്നത്ര ബ്രൌസറുകളും ഓപ്പറേറ്റിങ് സിസ്റ്റങ്ങളും പോലെ നിങ്ങളുടെ CSS3 പേജുകൾ നന്നായി പരിശോധിക്കുക. ലക്ഷ്യം എല്ലാ ബ്രൌസറിലും ഒരേപോലെ ദൃശ്യമാകുന്ന വെബ് പേജുകൾ സൃഷ്ടിക്കുന്നതല്ലെന്ന് ഓർക്കുക, എന്നാൽ CSS3 ശൈലികൾ ഉൾപ്പെടെ നിങ്ങൾ ഉപയോഗിക്കുന്ന ഏത് ശൈലികളും അവരെ പിന്തുണക്കുന്ന ബ്രൗസറുകളിൽ മികച്ച രീതിയിൽ ദൃശ്യമാക്കുകയും പഴയ ബ്രൗസറുകൾക്കായി അരുത്.

പുതിയ CSS3 സെലക്ടറുകൾ

പുതിയ സിഎസ്എസ് സെലക്ടറുകളുമായി സിഎസ്എസ് നിയമങ്ങൾ എഴുതാൻ കഴിയുന്ന പുതിയ രീതികളിൽ ഒരു പുതിയ കൂട്ടായ്മയും പുതിയ പുതിയ കോശിനേറ്റർ, പുതിയ പുതിയ സൂപ്പർ-എലക്റ്റുകൾ എന്നിവയും നൽകും.

മൂന്ന് പുതിയ ആട്രിബ്യൂട്ട് സെലക്ടർമാർ:

• ആരംഭിക്കുന്ന ഗുണിത കൃത്യമായി ഘടകവുമായി പൊരുത്തപ്പെടുന്നു [foo ^ = "bar"] മൂലകമുപയോഗിച്ച് "bar"
• കൃത്യമായ എഫക്റ്റ് (foo $ = "bar") എന്ന ഒത്തുനോക്കിയതിന്റെ ഗുണിത മൂലകമാണ് foo എന്ന് വിളിക്കുന്ന ഒരു ആട്രിബ്യൂട്ട് "bar"
• ആട്രിബ്യൂട്ട് മാച്ച് എലമെൻറ് [foo * = "bar"] അടങ്ങുന്നു എക്സിക്യുട്ടബിൾ foo എന്ന പേരിൽ ഒരു സ്ട്രിംഗ് "bar" ഉദാ

16 പുതിയ സൂപ്പർ ക്ലാസുകൾ:

• : റൂട്ട്
  • പ്രമാണത്തിന്റെ റൂട്ട് ഘടകം. ഇത് HTML ൽ എല്ലായ്പ്പോഴും.
• : nth- കുട്ടി (n)
  • കൃത്യമായ ചൈൽഡ് ഘടകങ്ങളുമായി പൊരുത്തപ്പെടുത്തുന്നതിന് ഇത് ഉപയോഗിക്കുക അല്ലെങ്കിൽ ഒരേയൊരു പൊരുത്തങ്ങൾ നേടാൻ വേരിയബിളുകൾ ഉപയോഗിക്കുക.
• : nth-last-child (n)
  • അവസാനമുള്ളതിൽ നിന്ന് കൃത്യമായി കണക്കാക്കുന്ന കൃത്യമായ കുട്ടിയുടെ ഘടകങ്ങളുമായി പൊരുത്തപ്പെടുത്തുക.
• : nth- ഓഫ്-തരം (n)
  • പ്രമാണത്തിന് മുമ്പുള്ള അതേ പേരിലുള്ള സമാന സോളിംഗ് എഫക്റ്റുകൾ മായ്ക്കുക.
• : nth-last-of-type (n)
  • താഴെ നിന്ന് എണ്ണിവരുന്ന അതേ പേരുള്ള സാപ്പിംഗ് ഘടകങ്ങൾ പൊരുത്തപ്പെടുത്തുക.
• :അവസാനത്തെ കുട്ടി
  • രക്ഷകർത്താക്കളുടെ അവസാന കുട്ടി ഘടകവുമായി പൊരുത്തപ്പെടുത്തുക.
• : ആദ്യം-തരം
  • ആ തരത്തിലുള്ള ആദ്യ സാന്നിദ്ധ്യം ഘടകവുമായി പൊരുത്തപ്പെടുത്തുക.
• : അവസാനത്തെ തരം
  • ആ തരത്തിലുള്ള അവസാന സിബിംഗ് ഘടകം യോജിപ്പിക്കുക.
• : മാത്രം കുട്ടി
  • അതിന്റെ രക്ഷകർത്താക്കളുടെ ഒരേയൊരു കുട്ടിക്ക് യോജിച്ച ഭാഗം നൽകുക.
• : മാത്രം-തരം
  • അതിന്റെ തരത്തിലുള്ള ഒരേയൊരു ഘടകം യോജിപ്പിക്കുക.
• : ശൂന്യമാണ്
  • കുട്ടികളല്ലാത്ത (ടെക്സ്റ്റ് നോഡുകൾ ഉൾപ്പെടെ) ഘടകങ്ങളെ പൊരുത്തപ്പെടുത്തുക.
• : ലക്ഷ്യം
  • ഉദ്ധരണി URI യുടെ ലക്ഷ്യം ഉളവാക്കുക.
• : പ്രാപ്തമാക്കി
  • അത് പ്രാപ്തമാക്കുമ്പോൾ ഘടകം യോജിപ്പിക്കുക.
• : അപ്രാപ്തമാക്കി
  • അത് പ്രവർത്തനരഹിതമാകുമ്പോൾ ഘടകം യോജിപ്പിക്കുക.
• : പരിശോധിച്ചു
  • പരിശോധിക്കപ്പെടുമ്പോൾ ഘടകം പൊരുത്തപ്പെടുത്തുക (റേഡിയോ ബട്ടൺ അല്ലെങ്കിൽ ചെക്ക്ബോക്സ്).

• : അല്ല (കൾ)
  • എലമെൻറിന്റെ ലളിതമായ സെലക്ടറുകളുമായി പൊരുത്തപ്പെടാത്തപ്പോൾ പൊരുത്തപ്പെടുത്തുക.

ഒരു പുതിയ കോമ്പിനേറ്റർ:

• മൂലകം a ~ elementB
  • മൂലബിംബം എപ്പോൾ എവിടെയെങ്കിലും എലിക്കു പിന്നിലുണ്ടെന്ന് ഓർക്കുക, ഉടനടിയല്ല.

പുതിയ പ്രോപ്പർട്ടികൾ

CSS3 നിരവധി പുതിയ CSS ഗുണങ്ങളും അവതരിപ്പിച്ചു. ഈ സവിശേഷതകളിൽ മിക്കതും ഫോട്ടോഷോപ്പ് പോലുള്ള ഗ്രാഫിക്സ് പ്രോഗ്രാമുകളുമായി കൂടുതൽ സാദൃശ്യമുള്ള ദൃശ്യ ശൈലികൾ സൃഷ്ടിക്കേണ്ടതാണ്. ഇവയിൽ ചിലത്, ബോർഡർ-ആർമിസ് അല്ലെങ്കിൽ ബോക്സ്-ഷാഡോ പോലെയാണ്, CSS3 ആണെങ്കിൽ ആമുഖം മുതൽ. ഫ്ലുക്സ്ബോക്സ് അല്ലെങ്കിൽ CSS ഗ്രിഡ് തുടങ്ങിയവയെപ്പോലുള്ള മറ്റുള്ളവർ, ഇപ്പോഴും പലപ്പോഴും CSS3 കൂട്ടിച്ചേർക്കലായി പരിഗണിക്കപ്പെടുന്ന പുതിയ ശൈലികളാണ്.

ബോക്സിൽ മാറ്റം വരുത്തിയിട്ടില്ല. എന്നാൽ നിങ്ങളുടെ ബോക്സുകളുടെ പശ്ചാത്തലങ്ങളും ബോർഡറുകളും ശൈലിയിൽ സഹായിക്കാൻ കഴിയുന്ന പുതിയ പുതിയ സ്റ്റൈൽ പ്രോപ്പർട്ടികൾ ഉണ്ട്.

ഒന്നിലധികം പശ്ചാത്തലം I mages

പശ്ചാത്തല-ഇമേജ്, പശ്ചാത്തല-നില, പശ്ചാത്തല-ആവർത്തിക്കുന്ന ശൈലികൾ ഉപയോഗിച്ച് നിങ്ങൾക്ക് ഒന്നിലധികം പശ്ചാത്തല ഇമേജുകൾ ബോക്സിൽ പരസ്പരം മുകളിൽ ലേയറിലാക്കാൻ കഴിയും. ആദ്യത്തെ ഇമേജ് ഉപയോക്താവിനോട് ഏറ്റവും സമീപമുള്ള പാളി, താഴെ കൊടുത്തിരിക്കുന്നവയിൽ പിറകിലാണ്. ഒരു പശ്ചാത്തല നിറം ഉണ്ടെങ്കിൽ, എല്ലാ ചിത്ര പാളികളിലും താഴെ ചിത്രീകരിക്കും.

പുതിയ പശ്ചാത്തല ശൈലി പ്രോപ്പർട്ടികൾ

CSS3- ൽ ചില പുതിയ പശ്ചാത്തല പ്രോപ്പർട്ടികൾ ഉണ്ട്.

• പശ്ചാത്തല-ക്ലിപ്പ്
  • ഈ ചിത്രം പശ്ചാത്തല ഇമേജ് എങ്ങനെ ക്ലിപ് ചെയ്യണം എന്ന് നിർവചിക്കുന്നു. ഡിഫാൾട്ട് ബോർഡർ ബോക്സ് ആണ്, എന്നാൽ ഇത് പാഡിംഗ് ബോക്സിലേക്കോ ഉള്ളടക്ക ബോക്സിലേക്കോ മാറ്റാവുന്നതാണ്.
• പശ്ചാത്തല-ഉത്ഭവം
  • ഈ പ്രോപ്പർട്ടി പാഡിംഗ് ബോക്സ്, ബോർഡർ ബോക്സ് അല്ലെങ്കിൽ ഉള്ളടക്ക ബോക്സിൽ സ്ഥലങ്ങൾ ആയിരിക്കണമോ എന്ന് നിർണ്ണയിക്കുന്നു.
• പശ്ചാത്തല വലുപ്പം
  • പശ്ചാത്തല ചിത്രത്തിന്റെ വലിപ്പം സൂചിപ്പിക്കുന്നതിന് ഈ പ്രോപ്പർട്ടി നിങ്ങളെ അനുവദിക്കുന്നു. പേജിൽ യുക്തമാക്കുന്നതിന് ചെറിയ ചിത്രങ്ങൾ നീക്കാൻ ഇത് അനുവദിക്കുന്നു.

നിലവിലുള്ള പശ്ചാത്തല ശൈലിയിലുള്ള പ്രോപ്പർട്ടികൾ മാറ്റുന്നു

നിലവിലുള്ള പശ്ചാത്തല ശൈലിയിൽ കുറച്ച് മാറ്റങ്ങൾ ഉണ്ട്:

• പശ്ചാത്തല-ആവർത്തിക്കുക
  • ഈ പ്രോപ്പർട്ടിക്ക് രണ്ട് പുതിയ മൂല്യങ്ങളുണ്ട്: സ്ഥലം, ചുറ്റും. ചായം പൂശിയാതെ പെട്ടിയിലായിരുന്നു ചലിപ്പിച്ചിരിക്കുന്നത്. റൗണ്ട് പശ്ചാത്തല ഇമേജ് വീണ്ടെടുക്കുന്നു, അത് ബോക്സിൽ മുഴുവൻ തവണ ടൈൽ ചെയ്യാനിടയുണ്ട്.
• പശ്ചാത്തല അറ്റാച്ചുമെന്റ്
  • ഒരു പുതിയ മൂല്ല്യം "ലോക്കൽ" ചേർത്തിരിയ്ക്കുന്നു, അതിലൂടെ ആ ഘടകം ഒരു സ്ക്രോൾ ബാറിലാണെങ്കിൽ പശ്ചാത്തലത്തിലെ ഘടകം ആ ഘടകം സ്ക്രോൾ ചെയ്യും.
• പശ്ചാത്തലം
  • പശ്ചാത്തല ഷോർട്ട് ഹാൻഡ് പ്രോപ്പർട്ടി വലുപ്പവും ഉറവിട സ്വഭാവവും ചേർക്കുന്നു.

CSS3 ബോർഡർ പ്രോപ്പർട്ടികൾ

നമ്മൾ ഉപയോഗിച്ചിരിക്കുന്ന സ്റ്റൈലുകൾ (സോളിഡ്, ഡബിൾ, ഡാഷ്ഡ് തുടങ്ങിയവ) അല്ലെങ്കിൽ CSS3 ഇമേജുകൾക്ക് അല്ലെങ്കിൽ അവർ ഒരു ഇമേജ് ആയിരിക്കാം. പ്ലസ്, CSS3 വൃത്താകൃതിയിലുള്ള മൂലകങ്ങൾ സൃഷ്ടിക്കുന്നതിനുള്ള കഴിവ് നൽകുന്നു. ബോർഡർ ഇമേജുകൾ രസകരമാണ്, കാരണം നിങ്ങൾക്ക് നാലുചുരുക്കുകളുടെ ഒരു ഇമേജ് സൃഷ്ടിച്ച്, ആ ഇമേജ് എങ്ങനെ നിങ്ങളുടെ ബോർഡറുകളിൽ പകർത്തണമെന്ന് നിർദ്ദേശിക്കുക.

പുതിയ ബോർഡർ ശൈലി പ്രോപ്പർട്ടികൾ

CSS3- ൽ ചില പുതിയ അതിർത്തി പ്രോപ്പർട്ടികൾ ഉണ്ട്:

• ബോർഡർ-ആരം
  • ബോർഡർ-ടോപ്പ്-വലത്-ആരം , ബോർഡർ-വൈൻ-ആർട്ട്-റേഡിയസ് , ബോർഡർ-ലെഫ്റ്റ്-ഇടത്-ആരം , ബോർഡർ-മുകളിൽ-ഇടത്-ആരം
  • നിങ്ങളുടെ അതിരുകളിലാണ് ഉരുണ്ട മൂലകൾ സൃഷ്ടിക്കാൻ ഈ സൗകര്യങ്ങൾ നിങ്ങളെ അനുവദിക്കുന്നു.
• border-image-source
  • ഇതിനകം നിർവ്വചിച്ച ഫോർമാറ്റ് ശൈലികൾക്കു പകരം ഇമേജ് ഉറവിട ഫയൽ വ്യക്തമാക്കുന്നു.
• ബോർഡർ-ഇമേജ്-സ്ലൈസ്
  • ബോർഡർ ഇമേജ് അറ്റങ്ങളിൽ നിന്ന് അകത്തേക്കുള്ള ഓഫ്സെറ്റുകൾ പ്രതിനിധീകരിക്കുന്നു
• border-image-width
  • നിങ്ങളുടെ ബോർഡർ ചിത്രത്തിന് വീതിയുടെ മൂല്യം നിർവ്വചിക്കുന്നു.
• border-image-outs
  • ബോർഡർ ഇമേജ് ഏരിയാ ബോർഡർ ബോക്സിന് പുറത്തുള്ള തുക വ്യക്തമാക്കുന്നു.
• border-image-stretch
  • ബോർഡർ ചിത്രത്തിന്റെ വശങ്ങളും വശങ്ങളും എങ്ങനെയാണ് തണ്ടുകളോ സ്കെയിൽ ചെയ്തോ എന്ന് നിർവ്വചിക്കുന്നു.
• ബോർഡർ-ഇമേജ്
  • എല്ലാ അതിർത്തി ഇമേജ് പ്രോപ്പർട്ടികൾക്കുള്ള ഷോർട്ട് ഹാൻഡ് പ്രോപ്പർട്ടിയും.

ബോർഡറുകളും പശ്ചാത്തലങ്ങളുമായി ബന്ധപ്പെട്ട കൂടുതൽ CSS3 സവിശേഷതകൾ

ഒരു പേജ് ഛേദിയിൽ ഒരു ബോക്സ് തകർക്കുമ്പോൾ, ഇൻലൈൻ ഘടകങ്ങൾക്കുള്ള നിര ബ്രേക്ക് (ഇൻലൈൻ ഘടകങ്ങൾക്കായി) ബോക്സ്-ഡീബേറേഷൻ ബ്രേക്ക് പ്രോപ്പർട്ടി, ബോക്സും പാഡിംഗും ഉപയോഗിച്ച് പുതിയ ബോക്സുകൾ എങ്ങനെയാണ് പൊതിഞ്ഞതെന്ന് നിർവചിക്കുന്നത്. ഈ വസ്തുവലുപയോഗിച്ച് ഒന്നിലധികം തകർക്കപ്പെട്ട ബോക്സുകൾക്കിടയിൽ പശ്ചാത്തലങ്ങൾ വേർതിരിക്കാനാകും.

ബോക്സ് ഘടകങ്ങളിലേക്ക് നിഴലുകൾ ചേർക്കാൻ ഉപയോഗിക്കുന്ന ഒരു ബോക്സ്-ഷാഡോ പ്രോപ്പർട്ടിയും ഉണ്ട്.

CSS3 ഉപയോഗിച്ച്, നിങ്ങൾക്ക് ഇപ്പോൾ എളുപ്പത്തിൽ പട്ടികകളില്ലാത്തതോ അല്ലെങ്കിൽ കൂടുതൽ സങ്കീർണ്ണമായ ഡിഗ് ടാഗ് ഘടനയോ ഉള്ള ഒന്നിലധികം നിരകളുള്ള ഒരു വെബ് പേജ് സജ്ജമാക്കാൻ കഴിയും. നിങ്ങൾ എത്ര ബാറ്ററി ഘടകം ഉണ്ടായിരിക്കണം എത്ര വിപുലമാക്കണമെന്നും അവ എത്രത്തോളം വലുതാണെന്നോ ബ്രൌസറിനോട് പറയുക. അതിനൊപ്പം നിങ്ങൾക്ക് ബോർഡറുകൾ (നിയമങ്ങൾ), നിരയുടെ ഉയരത്തിലേക്ക് കയറാനുള്ള പശ്ചാത്തല വർണങ്ങൾ എന്നിവ ചേർക്കാൻ കഴിയും, കൂടാതെ നിങ്ങളുടെ വാചകം യാന്ത്രികമായി എല്ലാ നിരകളിലൂടെയും നീക്കും.

CSS3 നിരകൾ - നിരകളുടെ എണ്ണവും വീതിയും നിശ്ചയിക്കുക

നിങ്ങളുടെ നിരകളുടെ എണ്ണവും വീതിയും നിർവ്വചിക്കാൻ അനുവദിക്കുന്ന മൂന്ന് പുതിയ സവിശേഷതകളുണ്ട് :

• നിര-വിഡ്ത്ത്
  • നിങ്ങളുടെ നിരകൾ ആയിരിക്കണം വീതി നിർവചിക്കുന്നത്. വിപുലമായ നിരകളുള്ള സ്പെയ്സ് പൂരിപ്പിക്കുന്നതിന് ബ്രൗസർ ടെക്സ്റ്റ് ഒഴിക്കും.
• നിര-എണ്ണം
  • പേജിലെ നിരകളുടെ എണ്ണം നിർവ്വചിക്കുന്നു. ബ്രൌസർ സ്പെയ്സിലേക്ക് ചേരുന്നതിന് മതിയായ അളവുകൾ നിർമ്മിക്കും, എന്നാൽ നിങ്ങൾ സൂചിപ്പിക്കുന്ന നമ്പർ മാത്രം.
• നിരകൾ
  • ഷോർട്ടാൻഡിലുള്ള പ്രോപ്പർട്ടി നിങ്ങൾ വീതിയോ അല്ലെങ്കിൽ അക്കമോ (അല്ലെങ്കിൽ രണ്ടും, എന്നാൽ അപൂർവ്വമായി അർത്ഥമാക്കുന്നത്) എന്ന് നിർവ്വചിക്കാൻ കഴിയും.

CSS3 നിര വിടവുകളും ചട്ടങ്ങളും

ഒരേ മൾട്ടിക്ലൈറ്റ് രംഗത്തെ നിരകൾക്കിടയിൽ ശൂന്യവും നിയമങ്ങളും സ്ഥാപിച്ചിരിക്കുന്നു. വിടവുകൾ നിരകൾ തള്ളിക്കളയും, പക്ഷേ നിയമങ്ങൾ ഏറ്റെടുക്കുന്നില്ല. നിരയുടെ വിടവ് കൂടുതൽ വിസ്തരിക്കുന്നെങ്കിൽ, അത് അടുത്തുള്ള നിരകൾ പൊതിയുന്നു. നിര നിയമങ്ങളും വിടവുകൾക്കും അഞ്ച് പുതിയ സ്വഭാവസവിശേഷതകൾ ഉണ്ട്:

• നിര-വിടവ്
  • നിരകൾക്കിടയിലുള്ള വിടവിന്റെ വീതി നിർവ്വചിക്കുന്നു.
• നിര-റൂൾ-വർണ്ണം
  • നിയമത്തിന്റെ നിറം നിർവചിക്കുന്നു.
• നിര-റൂൾ-ശൈലി
  • ഭരണം (സോളിഡ്, ഡോട്ട്ഡ്, ഇരട്ട മുതലായവ) നിർവചിക്കുന്നു.
• കോളം-റൂൾ-വീതി
  • റൂളിന്റെ വീതി നിർവ്വചിക്കുന്നു.
• കോളം-റൂൾ
  • ഒരേസമയം മൂന്നു നിര റൂൾ പ്രോപ്പർട്ടികളെയെല്ലാം ഒരു ഷോർട്ട് ഹാൻഡ് ആശ്രിതമാക്കുന്നു.

CSS3 കോളം ബ്രേക്കുകൾ, സ്പാനിംഗ് നിരകൾ, പൂരിപ്പിക്കൽ നിരകൾ എന്നിവ

നിരയിലെ ബ്രേക്കുകൾ ഉപയോഗിച്ചു നിർവ്വചിക്കുന്ന അതേ CSS2 ഓപ്ഷനുകൾ ഉപയോഗിക്കുന്നു, പക്ഷേ മൂന്നു പുതിയ സവിശേഷതകളാണ്: ബ്രേക്ക്-മുൻ , ബ്രേക്ക്-ബിൽ , ബ്രേക്ക് ഇൻ-ഇൻ .

പട്ടികകൾ പോലെ, കോളം-സ്പാൻ പ്രോപ്പർട്ടി ഉപയോഗിച്ച് നിങ്ങൾക്ക് നിരകൾ സ്പാൻ ചെയ്യാൻ കഴിയും. ഒരു പത്രം പോലെ ഒന്നിലധികം നിരകൾ സ്പാൻ ചെയ്യുന്ന ഹെഡ് ലൈനുകൾ സൃഷ്ടിക്കാൻ ഇത് നിങ്ങളെ അനുവദിക്കുന്നു.

ഓരോ കോളത്തിലും എത്രത്തോളം ഉള്ളടക്കം ഉണ്ടെന്ന് ഫിൽ ചെയ്യൽ നിരകൾ തീരുമാനിക്കും. കോളം നിറഞ്ഞുതുടങ്ങും കൂടാതെ അടുത്തതിലേക്ക് പോകുന്നതുവരെ സ്വപ്രേരിതമായി ഉള്ളടക്കം സ്വപ്രേരിതമായി ഒഴുകുന്ന സമയത്ത് സമചതുരാകൃതിയിലുള്ള നിരകൾ ഓരോ നിരയിലും ഒരേ അളവ് ഉള്ളടക്കത്തെ നൽകാൻ ശ്രമിക്കുന്നു.

CSS3- ൽ ഉൾപ്പെടുത്തിയിട്ടുള്ള CSS3- ൽ കൂടുതൽ സവിശേഷതകൾ

CSS3 2 ൽ നിലവിലില്ലെങ്കിലും CSS3 ഉൾപ്പെടെ നിരവധി സവിശേഷതകളുണ്ട്:

• CSS ടെംപ്ലേറ്റ് ലേഔട്ട് മൊഡ്യൂൾ, CSS3 ഗ്രിഡ് പൊസിഷൻ ഘടകം : CSS ഉപയോഗിച്ച് ഗ്രിഡുകൾ ഉണ്ടാക്കുന്നു.
• CSS3 ടെക്സ്റ്റ് മൊഡ്യൂൾ : ഔട്ട്ലുക്ക് ടെക്സ്റ്റും, CSS ഉപയോഗിച്ച് ഡ്രോപ്പ് ഷാഡോകളും സൃഷ്ടിക്കുക.
• CSS3 കളർ ഘടകം : ഇപ്പോൾ അതാര്യവുമുണ്ട്.
• ബോക്സ് മാതൃകയിലുള്ള മാറ്റങ്ങൾ : ഐഇ റ്റാഗിനെ പോലെയുള്ള ഒരു മാർക്യൂ സ്വത്ത് ഉൾപ്പെടെ.
• CSS3 ഉപയോക്തൃ ഇന്റർഫേസ് മൊഡ്യൂൾ : നിങ്ങൾക്ക് പുതിയ കഴ്സററുകൾ, പ്രവർത്തനങ്ങൾക്കുള്ള പ്രതികരണങ്ങൾ, ആവശ്യമുള്ള ഫീൽഡുകൾ, വലുപ്പം മാറ്റൽ ഘടകങ്ങൾ എന്നിവ നൽകുക .
• മീഡിയ ചോദ്യങ്ങൾ : ഒരു സ്റ്റൈൽ ഷീറ്റ് എങ്ങനെയാണ് ഉപയോഗിക്കേണ്ടതെന്ന് വ്യക്തമാക്കുമ്പോൾ മീഡിയ ചോദ്യങ്ങൾ നിങ്ങൾക്ക് കൂടുതൽ ഫ്ലെക്സിബിലിറ്റി നൽകുന്നു. ഉദാഹരണത്തിന്, 20em ൽ കൂടുതൽ വലുപ്പമുള്ള വ്യൂപോർട്ട് ഹാൻഡ് സെൽഡ് ഡിവൈസുകൾക്കുള്ള സ്റ്റൈൽ ഷീറ്റ് നിങ്ങൾക്ക് നിർവ്വചിക്കാവുന്നതാണ്.
• CSS3 റൂബി ഘടകം : ഡോക്യുമെന്റുകളെ വ്യാഖ്യാനിക്കുന്നതിന് രസകരമായ റൂബി ഉപയോഗിക്കുന്ന ഭാഷകൾക്കുള്ള പിന്തുണ നൽകുന്നു.
• CSS3 Paged മീഡിയ ഘടകം : പേജിങ് മീഡിയ (പേപ്പർ, ട്രാൻസാക്ഷൻസ്, തുടങ്ങിയവ) കൂടുതൽ പിന്തുണയ്ക്കായി.
• സൃഷ്ടിച്ച ഉള്ളടക്കം : എൽ തലക്കെട്ട് , ഫൂട്ടറുകൾ, അടിക്കുറിപ്പുകൾ, കൂടാതെ പ്രോഗ്രമാറ്റിക്കായി സൃഷ്ടിച്ച മറ്റു ഉള്ളടക്കങ്ങൾ, പ്രത്യേകിച്ച് പേഡ് മീഡിയ മുതലായവ.
• സിഎസ്ഒ സ്പീച്ച് മൊഡ്യൂൾ : ആറീയതിലെ മാറ്റങ്ങൾക്കുള്ള മാറ്റങ്ങൾ.