ރީބޫޓް ކުރާށެވެ
ރީބޫޓް، އެއް ފައިލެއްގައި އެލިމެންޓަށް ޚާއްޞަ ސީއެސްއެސް ބަދަލުތަކުގެ ކޮލެކްޝަނެއް، ކިކްސްޓާޓް ބޫޓްސްޓްރެޕް އިން ބިލްޑް ކުރުމަށް އެލިގަންޓް، ކޮންސިސްޓެންޓް، އަދި ސާދާ ބޭސްލައިނެއް ފޯރުކޮށްދެއެވެ.
ކުރިމަތިލުން
ރީބޫޓް ބިނާވެފައިވަނީ ނޯމަލައިޒްގެ މައްޗަށް ކަމަށާއި، ހަމައެކަނި އެލިމެންޓް ސެލެކްޓަރސް ބޭނުންކޮށްގެން ކޮންމެވެސް ވަރަކަށް ޚިޔާލު ތަފާތު ސްޓައިލްތަކާއެކު ގިނަ އެޗްޓީއެމްއެލް އެލިމެންޓްތަކަށް ފޯރުކޮށްދެއެވެ. އިތުރު ސްޓައިލިންގ ހެދެނީ ހަމައެކަނި ކްލާސްތަކާއެކުގައެވެ. މިސާލަކަށް، އަޅުގަނޑުމެން <table>ސާދާ ބޭސްލައިނަކަށްޓަކައި ބައެއް ސްޓައިލްތައް ރީބޫޓްކޮށް، ފަހުން .table, .table-bordered, އަދި އެއަށްވުރެ ގިނަ ކަންތައްތައް ފޯރުކޮށްދެމެވެ.
މިއީ އަޅުގަނޑުމެންގެ ގައިޑްލައިންތަކާއި ރީބޫޓްގައި އޯވަރރައިޑް ކުރާނެ ކަންތައްތައް އިޚްތިޔާރު ކުރުމަށް ހުރި ސަބަބުތަކެވެ:
- ސްކޭލް ކުރެވޭ ކޮމްޕޮނެންޓް ސްޕޭސިންގ އަށް s
remގެ ބަދަލުގައި s ބޭނުން ކުރުމަށް ބައެއް ބްރައުޒާ ޑިފޯލްޓް ވެލިއުތައް އަޕްޑޭޓް ކުރާށެވެ .em - ދުރުހެލިވާށެވެ
margin-top. ވަރުގަދަ މާރޖިންތައް ވެއްޓި، ހީވެސް ނުކުރާ ނަތީޖާތަކެއް ލިބިދާނެ އެވެ. ނަމަވެސް މިއަށްވުރެ މުހިންމު ކަމަކީ، އެއް މިސްރާބަކީ،marginނަފްސާނީ ގޮތުން މާ ސާދާ މޮޑެލެކެވެ. - ޑިވައިސް ސައިޒްތަކުގެ ތެރެއިން ފަސޭހައިން ސްކޭލް ކުރުމަށްޓަކައި، ބްލޮކް އެލިމެންޓްތަކުން
rems އަށްmargins ބޭނުން ކުރަންވާނެއެވެ. font-ގުޅުންހުރި ޕްރޮޕަޓީތަކުގެ ޑިކްލެރޭޝަންތައް އެންމެ ކުޑަމިނުން ބެހެއްޓުން،inheritކުރެވެން އޮތް ކޮންމެ ވަގުތެއްގައި ބޭނުންކޮށްގެން.
ސީއެސްއެސް ވެރިއޭބަލްސް އެވެ
v5.1.1 ގައި އިތުރުކޮށްފައިވެއެވެ
v5.1.1 އާއެކު، އަޅުގަނޑުމެންގެ @importހުރިހާ ސީއެސްއެސް ބަންޑަލްތަކެއްގައި އަޅުގަނޑުމެންގެ ބޭނުންވާ s ސްޓޭންޑަރޑައިޒް ކޮށްފިން ( bootstrap.css, bootstrap-reboot.css, އަދި bootstrap-grid.cssހިމެނޭ ގޮތަށް _root.scss. މިއީ :rootހުރިހާ ބަންޑަލްތަކަށް ލެވެލް ސީއެސްއެސް ވެރިއޭބަލްތައް އިތުރުކޮށްދޭ ކަމެކެވެ ވަގުތު ފާއިތުވަމުންދާ ވަރަކަށް އިތުރުކުރެވޭ އިތުރު ސީއެސްއެސް ވެރިއޭބަލްތައް ބައްލަވާށެވެ.
ޕޭޖް ޑިފޯލްޓް ވެއެވެ
އަދި <html>އެލިމެންޓްތައް <body>އަޕްޑޭޓްކޮށްފައިވަނީ ރަނގަޅު ޕޭޖް ވައިޑް ޑިފޯލްޓްތައް ފޯރުކޮށްދިނުމަށެވެ. އިތުރަށް ވަކިން ހާއްސަކޮށް:
- ދަ
box-sizingއަކީ ގްލޯބަލްކޮށް ކޮންމެ އުނިއިތުރެއްގެ މައްޗަށް ސެޓްކޮށްފައިވާ އެއްޗެއް—އޭގެ ތެރޭގައި*::beforeއަދި*::after, އަށްborder-box. މިއީ ޕެޑިންގ ނުވަތަ ބޯޑަރ ގެ ސަބަބުން ދުވަހަކުވެސް އެލިމެންޓްގެ ޑިކްލެއާ ކުރެވިފައިވާ ފުޅާމިނަށްވުރެ އިތުރު ނުވާނެކަން ކަށަވަރުކޮށްދޭ ކަމެކެވެ.- ގައި އެއްވެސް އަސާސެއް
font-sizeޑިކްލެއާ ނުކުރެވި<html>، އެކަމަކު16pxގަބޫލުކުރެވެނީ (ބްރައުޒާ ޑިފޯލްޓް) އެވެ.font-size: 1remis applied on the<body>ފޯރ އީޒީ ރެސްޕޮންސިވް ޓައިޕް-ސްކޭލިންގ ވިއާ މީޑިއާ ކިއުއަރީސް ވިތް ރިސްޕެކްޓިންގ ޔޫޒަރ ޕްރެފެރެންސްސް އެންޑް އެންޝުއަރިންގ އެމޯރ އެކްސެސިބަލް އެޕްރޯޗް. މި ބްރައުޒާ ޑިފޯލްޓް އޯވަރރައިޑް ކުރެވޭނީ$font-size-rootވެރިއޭބަލް ބަދަލުކޮށްގެންނެވެ.
- ގައި އެއްވެސް އަސާސެއް
- ދަ
<body>ވެސް ސެޓް ކުރަނީ ގްލޯބަލްfont-family,font-weight,line-height, އަދިcolor. މިއީ ފޮންޓް އެއްގޮތް ނުވުން ހުއްޓުވުމަށްޓަކައި ފަހުން ބައެއް ފޯމް އެލިމެންޓްތަކުން ވާރުތަވާ ކަމެކެވެ. - ރައްކާތެރިކަމަށްޓަކައި، ދަ
<body>ހޭސް އަ ޑިކްލެއަރޑްbackground-color, ޑިފޯލްޓިންގ ޓު#fff.
ނެޓިވް ފޮންޓް ސްޓޭކް
ބޫޓްސްޓްރަޕް އިން ކޮންމެ ޑިވައިސްއަކާއި އޮއެސްއެއްގައި ވެސް އޮޕްޓިމަމް ޓެކްސްޓް ރެންޑަރިންގ އަށް “ނެޓިވް ފޮންޓް ސްޓޭކް” ނުވަތަ “ސިސްޓަމް ފޮންޓް ސްޓޭކް” ބޭނުންކުރެއެވެ. މި ސިސްޓަމް ފޮންޓްތައް ފަރުމާކޮށްފައިވަނީ ޚާއްޞަކޮށް މިއަދުގެ ޑިވައިސްތަކަށް ވިސްނައިގެން، ސްކްރީންތަކުގައި ރެންޑަރިންގ ރަނގަޅުކޮށް، ވެރިއޭބަލް ފޮންޓް ސަޕޯޓާއި، އަދިވެސް އެތައް ކަމެއް ކޮށްގެންނެވެ. ނެޓިވް ފޮންޓް ސްޓޭކްތަކާ ބެހޭ އިތުރު މައުލޫމާތު މި ސްމޭޝިންގ މެގަޒިންގެ ލިޔުމުގައި ކިޔައިބަލާށެވެ .
$font-family-sans-serif:
// Cross-platform generic font family (default user interface font)
system-ui,
// Safari for macOS and iOS (San Francisco)
-apple-system,
// Windows
"Segoe UI",
// Android
Roboto,
// Basic web fallback
"Helvetica Neue", Arial,
// Linux
"Noto Sans",
"Liberation Sans",
// Sans serif fallback
sans-serif,
// Emoji fonts
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
ފާހަގަކޮށްލަންޖެހޭ ކަމަކީ ފޮންޓް ސްޓޭކްގައި އިމޯޖީ ފޮންޓްތައް ހިމެނޭތީ، އާންމު ގިނަ ސިމްބަލް/ޑިންގްބެޓް ޔުނިކޯޑް އަކުރުތައް ގިނަ ކުލައެއްގެ ޕިކްޓޯގްރާފްތަކެއްގެ ގޮތުގައި ރެންޑަރ ކުރެވޭނެއެވެ. އެމީހުންގެ ސިފަ ތަފާތުވާނީ، ބްރައުޒާ/ޕްލެޓްފޯމްގެ ނެޓިވް އިމޯޖީ ފޮންޓުގައި ބޭނުންކުރާ ސްޓައިލަށް ބަލާފައި، އަދި އެއްވެސް ސީއެސްއެސް colorސްޓައިލެއްގެ އަސަރެއް ނުކުރާނެއެވެ.
މިއީ މުޅި ބޫޓްސްޓްރެޕްގައި ގްލޯބަލްކޮށް އޮޓޮމެޓިކުން އިންހެރިޓް font-familyކުރެވޭ ގޮތަށް އަމަލުކުރެވޭނެ ގޮތެކެވެ . <body>ގްލޯބަލް ބަދަލު ކުރުމަށް , ބޫޓްސްޓްރެޕް font-familyއަޕްޑޭޓްކޮށް އަލުން ކޮމްޕައިލް ކުރާށެވެ.$font-family-base
ސީއެސްއެސް ވެރިއޭބަލްސް އެވެ
ބޫޓްސްޓްރެޕް 5 މެޗުއަރވަމުންދާ ވަރަކަށް، އަބަދުވެސް ސާސް އަލުން ކޮމްޕައިލް ކުރަން ނުޖެހި، އިތުރު ރިއަލް ޓައިމް ކަސްޓަމައިޒޭޝަން ފޯރުކޮށްދިނުމުގެ ވަސީލަތެއްގެ ގޮތުގައި ސީއެސްއެސް ވެރިއޭބަލްތަކާއެކު ގިނަ ސްޓައިލްތައް ބިނާކުރެވޭނެއެވެ . އަޅުގަނޑުމެންގެ އުސޫލަކީ އަޅުގަނޑުމެންގެ ސޯސް ސާސް ވެރިއޭބަލްތައް ނަގައިގެން ސީއެސްއެސް ވެރިއޭބަލްތަކަށް ބަދަލުކުރުމެވެ. އެގޮތަށް ސީއެސްއެސް ވެރިއޭބަލްސް ބޭނުން ނުކުރިޔަސް، ސާސްގެ ހުރިހާ ބާރެއް ލިބިގެންދެއެވެ. މިއީ އަދިވެސް ކުރިއަށްދާ ކަމެއް ކަމަށާއި ފުރިހަމައަށް ތަންފީޒު ކުރަން ވަގުތު ނަގާނެ ކަމަށް ވެސް ވިދާޅުވި އެވެ.
މިސާލަކަށް، :rootއާންމު <body>ސްޓައިލްތަކަށް މި ސީއެސްއެސް ވެރިއޭބަލްތަކަށް ބަލާލާށެވެ:
@if $font-size-root != null {
--#{$variable-prefix}root-font-size: #{$font-size-root};
}
--#{$variable-prefix}body-font-family: #{$font-family-base};
--#{$variable-prefix}body-font-size: #{$font-size-base};
--#{$variable-prefix}body-font-weight: #{$font-weight-base};
--#{$variable-prefix}body-line-height: #{$line-height-base};
--#{$variable-prefix}body-color: #{$body-color};
@if $body-text-align != null {
--#{$variable-prefix}body-text-align: #{$body-text-align};
}
--#{$variable-prefix}body-bg: #{$body-bg};
ޢަމަލީގޮތުން ބަލާއިރު، އެ ވެރިއޭބަލްތައް ދެން ރީބޫޓްގައި އެޕްލައި ކުރެވެނީ މިހެންނެވެ:
body {
margin: 0; // 1
font-family: var(--#{$variable-prefix}body-font-family);
@include font-size(var(--#{$variable-prefix}body-font-size));
font-weight: var(--#{$variable-prefix}body-font-weight);
line-height: var(--#{$variable-prefix}body-line-height);
color: var(--#{$variable-prefix}body-color);
text-align: var(--#{$variable-prefix}body-text-align);
background-color: var(--#{$variable-prefix}body-bg); // 2
-webkit-text-size-adjust: 100%; // 3
-webkit-tap-highlight-color: rgba($black, 0); // 4
}
އެއީ ތިމާ ބޭނުން ގޮތަކަށް ރިއަލް ޓައިމް ކަސްޓަމައިޒޭޝަންތައް ހެދުމުގެ ފުރުސަތު ލިބޭ އެއްޗެކެވެ:
<body style="--bs-body-color: #333;">
<!-- ... -->
</body>
ސުރުޚީތަކާއި ޕެރެގްރާފްތަކެވެ
ހުރިހާ ހެޑިންގ އެލިމެންޓްތައް-އެބަހީ، <h1>—އަދި <p>އެތަކެތި margin-topނައްތާލުމަށް ރީސެޓް ކުރެވެއެވެ. ފަސޭހައިން ޖާގަ ދިނުމަށްޓަކައި ސުރުޚީތަކާއި margin-bottom: .5remޕެރެގްރާފްތައް އިތުރުކޮށްފައިވެއެވެ .margin-bottom: 1rem
| ސުރުޚީ | މިސާލު |
|---|---|
<h1></h1> |
ހ1. ބޫޓްސްޓްރެޕް ހެޑިންގ އެވެ |
<h2></h2> |
ހ2. ބޫޓްސްޓްރެޕް ހެޑިންގ އެވެ |
<h3></h3> |
ހ3. ބޫޓްސްޓްރެޕް ހެޑިންގ އެވެ |
<h4></h4> |
ހ4. ބޫޓްސްޓްރެޕް ހެޑިންގ އެވެ |
<h5></h5> |
ހ5. ބޫޓްސްޓްރެޕް ހެޑިންގ އެވެ |
<h6></h6> |
ހ6. ބޫޓްސްޓްރެޕް ހެޑިންގ އެވެ |
ލިސްޓްތައް
ހުރިހާ ލިސްޓެއް— <ul>, <ol>, އަދި <dl>—އެތަކެތި margin-topނައްތާލާފައި ހުރި ލިސްޓެއް އަދި އެއް margin-bottom: 1rem. ނެސްޓް ކުރެވިފައިވާ ލިސްޓްތަކުގައި އެއްވެސް margin-bottom. padding-leftއަދި އޮން <ul>އަދި <ol>އެލިމެންޓްސް ވެސް އަޅުގަނޑުމެން ރީސެޓް ކޮށްފިން .
- ހުރިހާ ލިސްޓެއްގެ މަތީ މާރޖިން އުނިކޮށްފައިވެއެވެ
- އަދި އެމީހުންގެ ބޮޓޮމް މާރޖިން ނޯމަލައިޒް ވެގެން ދިޔައެވެ
- ނެސްޓް ކުރެވިފައިވާ ލިސްޓްތަކުގައި ބޮޓޮމް މާރޖިންއެއް ނެތެވެ
- މިގޮތަށް އެމީހުންނަށް ލިބެނީ މާ ހަމަހަމަ ސިފައެކެވެ
- ޚާއްޞަކޮށް އޭގެ ފަހުން އިތުރު ލިސްޓް އައިޓަމްތައް އަންނައިރު
- އަދި ކަނާތު ޕެޑިން ވެސް ވަނީ ރީސެޓްކޮށްފަ އެވެ
- މިއޮތީ ތަރުތީބުކޮށްފައިވާ ލިސްޓެކެވެ
- މަދު ލިސްޓް އައިޓަމަކާއެކުގައެވެ
- އެއީ އެއް އޯވަރޯލް ލޫކެވެ
- ކުރީގެ ތަރުތީބު ނުކުރެވި ހުރި ލިސްޓެއް ފަދައިންނެވެ
ސާދާ ސްޓައިލިންގ އާއި، ސާފު ހައިރާކީ އާއި، ރަނގަޅު ސްޕޭސިންގ އަށްޓަކައި، ޑިސްކްރިޕްޝަން ލިސްޓްތަކުގައި އަޕްޑޭޓްކޮށްފައިވާ marginސ. s އަށް <dd>ރީސެޓްކޮށް އިތުރުކުރުން . s ބޮލްޑްކޮށްފައި ހުރެއެވެ .margin-left0margin-bottom: .5rem<dt>
- ޑިސްކްރިޕްޝަން ލިސްޓްތަކެވެ
- ޑިސްކްރިޕްޝަން ލިސްޓަކީ ޝަރުތުތައް މާނަކުރުމަށް ފުރިހަމަ ލިސްޓެކެވެ.
- މުއްދަތު
- މި ލަފުޒަށް ދޭ މާނަ.
- ހަމަ އެ ލަފުޒަށް ދޭ ދެވަނަ މާނައެކެވެ.
- އަނެއްކާ ޓާރމް
- މި އަނެއް ލަފުޒަށް މާނަކުރުމެވެ.
އިންލައިން ކޯޑެވެ
ކޯޑްގެ އިންލައިން ސްނިޕެޓްތައް <code>. އެޗްޓީއެމްއެލް އެންގްލް ބްރެކެޓްތަކުން ސަލާމަތްވުން ޔަގީން ކުރައްވާށެވެ.
<section>އިންލައިންގެ ގޮތުގައި އޮޅާލަން ޖެހެއެވެ.
For example, <code><section></code> should be wrapped as inline.
ކޯޑް ބްލޮކްތަކެވެ
<pre>ކޯޑްގެ އެތައް ސަފުހާއަކަށް s ބޭނުން ކުރާށެވެ . އަނެއްކާވެސް ރަނގަޅަށް ރެންޑަރ ކުރުމަށްޓަކައި ކޯޑްގައިވާ އެއްވެސް އެންގްލް ބްރެކެޓެއް ފިލައިގެން ދިއުން ޔަގީން ކުރައްވާށެވެ. އެލިމެންޓް ރީސެޓް ކުރެވެނީ އޭގެ <pre>ނައްތާލައި އޭގެ ޔުނިޓްތައް margin-topބޭނުން ކުރުމަށް .remmargin-bottom
<p>Sample text here...</p>
<p>And another line of sample text here...</p>
<pre><code><p>Sample text here...</p>
<p>And another line of sample text here...</p>
</code></pre>
ވެރިއޭބަލްސް އެވެ
ވެރިއޭބަލްތައް ދައްކާލުމަށްޓަކައި <var>ޓެގް ބޭނުން ކުރާށެވެ.
<var>y</var> = <var>m</var><var>x</var> + <var>b</var>
ޔޫޒަރ އިންޕުޓް
<kbd>އާންމުކޮށް ކީބޯޑް މެދުވެރިކޮށް އެންޓަރ ކުރާ އިންޕުޓް ދައްކާލުމަށް ބޭނުންކުރާށެވެ .
ސެޓިންގސް އެޑިޓް ކުރުމަށް ފިއްތާލާށެވެ ctrl + ,
To switch directories, type <kbd>cd</kbd> followed by the name of the directory.<br>
To edit settings, press <kbd><kbd>ctrl</kbd> + <kbd>,</kbd></kbd>
ސާމްޕަލް އައުޓްޕުޓް
ޕްރޮގްރާމަކުން ސާމްޕަލް އައުޓްޕުޓް ދައްކާލުމަށްޓަކައި <samp>ޓެގް ބޭނުން ކުރާށެވެ.
<samp>This text is meant to be treated as sample output from a computer program.</samp>
މޭޒުތަކެވެ
މޭޒުތައް ސްޓައިލް s އަށް ކުޑަކޮށް އެޖެސްޓްކޮށް ، ބޯޑަރުތައް ކޮލަޕްސްކޮށް، މުޅި ތަނުގައި <caption>އެއްގޮތްކަން ކަށަވަރުކޮށްދެއެވެ . text-alignބޯޑަރސް، ޕެޑިންގ، އަދި އެހެނިހެން ކަންކަމަށް އިތުރު ބަދަލުތައް އަންނަނީ .tableކްލާހާއެކުގައެވެ .
| ތާވަލުގެ ސުރުޚީ | ތާވަލުގެ ސުރުޚީ | ތާވަލުގެ ސުރުޚީ | ތާވަލުގެ ސުރުޚީ |
|---|---|---|---|
| ޓޭބަލް ސެލް | ޓޭބަލް ސެލް | ޓޭބަލް ސެލް | ޓޭބަލް ސެލް |
| ޓޭބަލް ސެލް | ޓޭބަލް ސެލް | ޓޭބަލް ސެލް | ޓޭބަލް ސެލް |
| ޓޭބަލް ސެލް | ޓޭބަލް ސެލް | ޓޭބަލް ސެލް | ޓޭބަލް ސެލް |
ފޯމުތައް
ސާދާ ބޭސް ސްޓައިލްތަކަށް އެކި ފޯމް އެލިމެންޓްތައް ރީބޫޓްކޮށްފައިވެ އެވެ. މިއީ އެންމެ ފާހަގަކޮށްލެވޭ ބައެއް ބަދަލުތަކެވެ.
<fieldset>s ގައި ބޯޑަރ، ޕެޑިންގ، ނުވަތަ މާރޖިން އެއް ނެތުމުން ވަކިވަކި އިންޕުޓްތަކަށް ނުވަތަ އިންޕުޓްތަކުގެ ގްރޫޕްތަކަށް ރެޕަރެއްގެ ގޮތުގައި ފަސޭހައިން ބޭނުންކުރެވޭނެއެވެ.<legend>s، ފީލްޑްސެޓް ފަދައިން، ވެސް ސޯރޓްސްގެ ސުރުޚީއެއްގެ ގޮތުގައި ދައްކާލުމަށް ރީސްޓައިލް ކުރެވިފައިވެއެވެ.<label>s އަށް ސެޓްކޮށްފައިވަނީ އެޕްލައިdisplay: inline-blockކުރުމަށް ހުއްދަ ދިނުމަށެވެ.margin<input>s،<select>s،<textarea>s، އަދި<button>s އަށް ގިނައިން އެޑްރެސް ކުރެވެނީ ނޯމަލައިޒް އިން ނަމަވެސް ރީބޫޓް އިން އެމީހުންގެmarginއަދި ސެޓްތައް ނައްތާލައެވެline-height: inherit.<textarea>s އަށް ބަދަލު ގެނެސްފައިވަނީ ހަމައެކަނި ވަރުގަދައަށް ރީސައިޒް ކުރެވޭ ގޮތަށް ހޮރައިޒޮންޓަލް ރީސައިޒިންގ އިން ގިނަ ފަހަރަށް ޕޭޖް ލޭއައުޓް “ބްރޭކް” ކުރާތީއެވެ.<button>s އަދި<input>ބަޓަން އެލިމެންޓްތަކުގައި ހުންނަނީcursor: pointerކޮން އިރަކު:not(:disabled).
މި ބަދަލުތައް، އަދި އެއަށްވުރެ ގިނަ ބަދަލުތައް ތިރީގައި މިވަނީއެވެ.
ތާރީޚު & ކުލަ އިންޕުޓް ސަޕޯޓް
ހަނދާނުގައި ބަހައްޓަންވީ ތާރީޚު އިންޕުޓްތަކަށް ހުރިހާ ބްރައުޒާތަކެއް ކަމަށްވާ ސަފާރީން ފުރިހަމައަށް ސަޕޯޓް ނުކުރާ އެއްޗެކެވެ.
ބަޓަންތަކުގައި ހުންނަ ޕޮއިންޓަރުތައް
role="button"ރީބޫޓްގައި ޑިފޯލްޓް ކަރސަރ އަށް ބަދަލުކުރުމަށް ފޯރުކޮށްދޭ އިތުރުވުމެއް ހިމެނެއެވެ pointer. އެލިމެންޓްތަކަކީ އިންޓަރެކްޓިވް އެއްޗެހިކަން އަންގައިދިނުމަށް އެހީތެރިވުމަށްޓަކައި މި އެޓްރިބިއުޓް އެލިމެންޓްތަކަށް އިތުރުކޮށްލާށެވެ. <button>މި ރޯލަކީ އަމިއްލަ cursorބަދަލެއް ލިބޭ އުފެއްދުންތަކަށް ކޮންމެހެން ބޭނުންތެރި ދައުރެއް ނޫނެވެ .
<span role="button" tabindex="0">Non-button element button</span>
މިސްކް އެލިމެންޓްސް
އެޑްރެސް
އެލިމެންޓް <address>އަޕްޑޭޓް ކުރެވެނީ ބްރައުޒާ ޑިފޯލްޓް font-styleއިން ރީސެޓް italicކުރުމަށެވެ normal. line-heightވެސް މިހާރު ވާރުތަވެ، margin-bottom: 1remއި��ުރުކޮށްފައިވެ އެވެ. <address>s އަކީ އެންމެ ކައިރީގައި ހުންނަ ކާބަފައިން (ނުވަތަ މުޅި މަސައްކަތުގެ ބޮޑީއެއް) ގުޅޭނެ މައުލޫމާތު ހުށަހެޅުމަށްޓަކައެވެ. އިން ލައިންތައް ނިންމާލައިގެން ފޯމެޓިންގ ރައްކާތެރިކުރުން <br>.
1355 މާކެޓް ސެއިންޓް، ސުއިޓް 900
ސެން ފްރެންސިސްކޯ، ސީއޭ 94103
ޕީ: (123) 456-7890 ފުރިހަމަ ނަން
[email protected]
ބްލޮކްކޯޓް ކުރާށެވެ
marginބްލޮކްކޯޓްސްގައި ޑިފޯލްޓް ވާނީ 1em 40px, އެހެންކަމުން އަޅުގަނޑުމެން އެކަން ރީސެޓް 0 0 1remކުރަނީ އެހެން އެލިމެންޓްތަކާ މާ އެއްގޮތްވާ އެއްޗަކަށްޓަކައެވެ.
މަޝްހޫރު ކޯޓޭޝަނެއް، ބްލޮކްކޯޓް އެލިމެންޓެއްގައި ހިމެނޭ ކޯޓެކެވެ.
ސޯސް ޓައިޓަލްގައި މަޝްހޫރު މީހެކެވެ
އިންލައިން އެލިމެންޓްސް
އެ <abbr>އެލިމެންޓަށް ޕެރެގްރާފް ޓެކްސްޓްގެ ތެރެއިން ވަކިން ފާހަގަކޮށްލެވޭ ގޮތަށް އަސާސީ ސްޓައިލިންގ ލިބެއެވެ.
ޚުލާސާ
ސުމާރީގައި ޑިފޯލްޓްކޮށް cursorލިޔެފައިވަނީ text, އެހެންކަމުން އަޅުގަނޑުމެން އެކަން ރީސެޓް ކުރަނީ pointerއެ އެލިމެންޓަށް ކްލިކްކޮށްގެން މުއާމަލާތް ކުރެވޭނެކަން ފޯރުކޮށްދިނުމަށެވެ.
ބައެއް ތަފްޞީލެވެ
ތަފްސީލުތަކާ ބެހޭ އިތުރު މައުލޫމާތު.
އަދިވެސް އިތުރު ތަފްޞީލެވެ
މިއޮތީ ތަފްސީލުތަކާ ބެހޭ އިތުރު ތަފްސީލެވެ.
އެޗްޓީއެމްއެލް5 [hidden]އެޓްރިބިއުޓް
HTML5 އިން އާ ގްލޯބަލް އެޓްރިބިއުޓެއް[hidden]display: none އިތުރުކުރަނީ , މިއީ ޑިފޯލްޓްކޮށް ސްޓައިލް ކުރެވިފައިވާ އެއްޗެކެވެ . PureCSS އިން ޚިޔާލެއް ދަރަންޏަށް ނަގައިގެން , އަޅުގަނޑުމެން މި ޑިފޯލްޓް ރަނގަޅު ކޮށްގެން އޭގެ އެކްސިޑެންޓް އޮވަރރައިޑް ވުމުން [hidden] { display: none !important; }ރައްކާތެރިވުމަށް އެހީތެރިވުމަށް ހެދިން.display
<input type="text" hidden>
ޖީކުއަރީ އިންކޮމްޕެޓިބިލިޓީ
[hidden]$(...).hide()ޖީކުއަރީސް އާއި $(...).show()މެތޯޑްސް އާއި އެއްގޮތް ނުވާ އެއްޗެކެވެ . އެހެންކަމުން، އަޅުގަނޑުމެން މިވަގުތު ޚާއްޞަކޮށް އެންޑޯސް ނުކުރަން [hidden]އެހެން އުކުޅުތަކުގެ މައްޗަށް މެނޭޖް ކުރުމަށް displayއޮފް އެލިމެންޓްސް.
ހަމައެކަނި އެލިމެންޓެއްގެ ވިޒިބިލިޓީ ޓޮގްލް ކުރުމަށްޓަކައި، މާނައަކީ އޭގެ displayބަދަލު ނުކުރެވި އެ އެލިމެންޓުން އަދިވެސް ޑޮކިއުމަންޓްގެ ފްލޯއަށް އަސަރު ފޯރާފާނެތީ، އޭގެ ބަދަލުގައި ކްލާސް ބޭނުން ކުރާށެވެ ..invisible