အဓိကအကြောင်းအရာသို့ ကျော်သွားပါ။ စာရွက်စာတမ်းလမ်းညွှန်မှုသို့ ကျော်သွားပါ။
in English

ပြန်ဖွင့်ပါ။

ဖိုင်တစ်ခုတည်းရှိ ဒြပ်စင်-သတ်သတ်မှတ်မှတ် CSS အပြောင်းအလဲများစုစည်းမှု ပြန်လည်စတင်ခြင်း၊ ပြေပြစ်သော၊ တသမတ်တည်းနှင့် ရိုးရှင်းသော အခြေခံအခြေခံကို ပံ့ပိုးပေးရန်အတွက် kickstart Bootstrap။

ဤစာမျက်နှာတွင်

ရေးပါတယ်။

HTML ဒြပ်စင်များစွာကို အတန်ငယ်ထင်မြင်ယူဆထားသည့် ပုံစံများဖြင့် ပံ့ပိုးပေးသည့် Normalize ပေါ်တွင် ပြန်လည်စတင်ခြင်းကို တည်ဆောက်ပါသည်။ ထပ်လောင်းပုံစံကို အတန်းများနှင့်သာ ပြုလုပ်ပါသည်။ ဥပမာအားဖြင့်၊ <table>ကျွန်ုပ်တို့သည် ပိုမိုရိုးရှင်းသော အခြေခံလိုင်းအတွက် စတိုင်အချို့ကို ပြန်လည်စတင်ပြီး နောက်ပိုင်းတွင် .table, .table-bordered, နှင့် အခြားအရာများကို ပံ့ပိုးပေးပါသည်။

ဤသည်မှာ Reboot တွင် အစားထိုးရမည့်အရာကို ရွေးချယ်ခြင်းအတွက် ကျွန်ုပ်တို့၏လမ်းညွှန်ချက်များနှင့် အကြောင်းပြချက်များဖြစ်သည်-

  • အရွယ်တင်နိုင်သော အစိတ်အပိုင်းအကွာအဝေးအတွက် rems အစား s ကိုအသုံးပြုရန် အချို့သောဘရောက်ဆာ၏ မူရင်းတန်ဖိုးများကို အပ်ဒိတ်လုပ် ပါ။em
  • ရှောင် margin-topပါ။ ဒေါင်လိုက် အနားသတ်များသည် ပြိုကျနိုင်ပြီး မမျှော်လင့်ထားသော ရလဒ်များကို ထုတ်ပေးနိုင်သည်။ ပို၍အရေးကြီးသည်မှာ၊ ဦးတည်ချက်တစ်ခုတည်း marginသည် ပိုမိုရိုးရှင်းသော စိတ်ပိုင်းဆိုင်ရာပုံစံဖြစ်သည်။
  • စက်အရွယ်အစားများတစ်လျှောက် ပိုမိုလွယ်ကူစွာ ချဲ့ထွင်ရန်အတွက်၊ ပိတ်ဆို့သည့်အရာများကို rems အတွက် အသုံးပြုသင့်သည် margin။
  • ဖြစ်နိုင်သည့်အခါတိုင်း fontအသုံးပြု၍ -related properties ၏ ကြေငြာချက်များကို အနည်းဆုံးဖြစ်အောင်ထားပါ။inherit

CSS ကိန်းရှင်များ

v5.1.1 တွင် ထည့်သွင်းထားသည်။

v5.1.1 ဖြင့်၊ ကျွန်ုပ်တို့သည် ကျွန်ုပ်တို့၏ @importCSS အစုအဝေးများ (အပါအဝင် bootstrap.css, bootstrap-reboot.css, နှင့် bootstrap-grid.cssပါဝင်ရန် ) အားလုံးကို စံပြုသတ်မှတ်ထားပါသည်။ ၎င်းသည် အစုအစည်းတွင် CSS ကိုမည်မျှအသုံးပြုသည်ဖြစ်စေ အဆင့် CSS variable များကို _root.scssပေါင်းထည့် သည်။ နောက်ဆုံးတွင် Bootstrap 5 သည် ဆက်လက်ရှိနေမည်ဖြစ်သည်။ :rootအချိန်ကြာလာသည်နှင့်အမျှ ထပ်ထည့်ထားသော CSS variable များကိုကြည့်ပါ။

စာမျက်နှာ ပုံသေများ

ပိုမိုကောင်းမွန်သော စာမျက်နှာကျယ်သော ပုံသေများကို ပေးဆောင်ရန် အစိတ်အပိုင်းများနှင့် အစိတ်အပိုင်းများကို အပ်ဒိတ်လုပ်ထား သည် <html>။ <body>ပို၍တိကျသည်-

  • ၎င်းသည် box-sizingအပါအဝင် *::beforeနှင့် *::after, to border-box. ၎င်းသည် padding သို့မဟုတ် ဘောင်ကြောင့် ကြေငြာထားသော element ၏ width ကို ဘယ်သောအခါမျှ မကျော်လွန်ကြောင်း သေချာစေသည်။
    • မည်သည့်အခြေခံ ကိုမျှ font-sizeကြေငြာ <html>ခြင်းမရှိသော်လည်း 16px(ဘရောက်ဆာမူရင်း) ဟုယူဆသည်။ font-size: 1remအသုံးပြုသူ <body>စိတ်ကြိုက်ရွေးချယ်မှုများကို လေးစားပြီး ပိုမိုလက်လှမ်းမီသောချဉ်းကပ်မှုကို သေချာစေစဉ်တွင် မီဒီယာမေးမြန်းချက်များမှတစ်ဆင့် တုံ့ပြန်မှုလွယ်ကူသော အမျိုးအစား-စကေးချဲ့ခြင်းအတွက် အသုံးပြုသည်။ $font-size-rootကိန်းရှင် ကို မွမ်းမံခြင်းဖြင့် ဤဘရောက်ဆာမူရင်းကို လွှမ်းမိုးနိုင်သည် ။
  • <body>Global font-family, font-weight, line-height, and တို့ကိုလည်း သတ်မှတ် colorပေးသည် ။ ဖောင့်ကွဲလွဲမှုများကို ကာကွယ်ရန် ၎င်းကို နောက်ပိုင်းတွင် ပုံစံဒြပ်စင်အချို့မှ အမွေဆက်ခံထားသည်။
  • ဘေးကင်းစေရန်အတွက်၊ <body>သတ်မှတ်ကြေငြာချက် background-colorတွင် #fffပါရှိသည်။

မူရင်းဖောင့်အတွဲ

Bootstrap သည် စက်နှင့် OS တိုင်းတွင် အကောင်းဆုံးစာသားပြန်ဆိုရန်အတွက် "ဇာတိဖောင့်အစုစု" သို့မဟုတ် "စနစ်ဖောင့်အစုစု" ကို အသုံးပြုသည်။ ဤစနစ်ဖောင့်များကို ဖန်သားပြင်များပေါ်တွင် ပိုမိုကောင်းမွန်သော rendering၊ ပြောင်းလဲနိုင်သော ဖောင့်ပံ့ပိုးမှု နှင့် အခြားအရာများဖြင့် ယနေ့ခေတ် စက်ပစ္စည်းများဖြင့် အထူးဒီဇိုင်းထုတ်ထားပါသည်။ ဤ Smashing Magazine ဆောင်းပါးတွင် မူရင်းဖောင့်အတွဲ များအကြောင်း ပိုမိုဖတ်ရှုပါ ။

$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;

ဖောင့်အစုအဝေးတွင် အီမိုဂျီဖောင့်များပါ၀င်သောကြောင့် ဘုံသင်္ကေတ/dingbat ယူနီကုဒ်အက္ခရာအများအပြားကို ရောင်စုံရုပ်ပုံများအဖြစ် ပြန်ဆိုမည်ကို သတိပြုပါ။ ၎င်းတို့၏အသွင်အပြင်သည် ဘရောက်ဆာ/ပလပ်ဖောင်း၏ မူရင်းအီမိုဂျီဖောင့်တွင် အသုံးပြုသည့်ပုံစံပေါ်မူတည်၍ ကွဲပြားမည်ဖြစ်ပြီး ၎င်းတို့သည် မည်သည့် CSS colorစတိုင်များကိုမျှ ထိခိုက်မည်မဟုတ်ပါ။

၎င်းကို Bootstrap တစ်လျှောက်လုံး ကမ္ဘာအနှံ့ အလိုအလျောက် အမွေဆက်ခံ font-familyခြင်းသို့ သက်ရောက်သည် ။ <body>ဂလိုဘယ်ကိုပြောင်းရန် font-family၊ အပ်ဒိတ်လုပ်ပြီး $font-family-baseBootstrap ကို ပြန်လည်စုစည်းပါ။

CSS ကိန်းရှင်များ

Bootstrap 5 သည် ဆက်လက်ရင့်ကျက်လာသည်နှင့်အမျှ Sass ကို အမြဲတမ်းပြန်လည်ပေါင်းစည်းရန်မလိုအပ်ဘဲ အချိန်နှင့်တစ်ပြေးညီ စိတ်ကြိုက်ပြုပြင်မှုများကို ပံ့ပိုးပေးရန်အတွက် CSS variables များ ဖြင့် စတိုင်များ ပိုများလာမည်ဖြစ်သည်။ ကျွန်ုပ်တို့၏ချဉ်းကပ်ပုံမှာ ကျွန်ုပ်တို့၏အရင်းအမြစ် Sass ကိန်းရှင်များကိုယူကာ ၎င်းတို့အား CSS ကိန်းရှင်များအဖြစ်သို့ ပြောင်းလဲရန်ဖြစ်သည်။ ထိုနည်းအားဖြင့် သင်သည် CSS variable များကိုအသုံးမပြုသော်လည်း၊ သင့်တွင် Sass ၏ ပါဝါအားလုံးရှိနေသေးသည်။ ၎င်းသည် ဆက်လက်လုပ်ဆောင်ဆဲဖြစ်ပြီး အပြည့်အဝအကောင်အထည်ဖော်ရန် အချိန်ယူရမည်ဖြစ်သည်။

ဥပမာအားဖြင့်၊ :rootဘုံ <body>စတိုင်များအတွက် ဤ CSS variable များကို သုံးသပ်ကြည့်ပါ-

  @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};

လက်တွေ့တွင်၊ အဆိုပါ variable များကို Reboot တွင်အသုံးပြုသည်-

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-topmargin-bottom: .5remmargin-bottom: 1rem

ခေါင်းစီး ဥပမာ
<h1></h1> h1။ Bootstrap ခေါင်းစဉ်
<h2></h2> h2။ Bootstrap ခေါင်းစဉ်
<h3></h3> h3။ Bootstrap ခေါင်းစဉ်
<h4></h4> h4။ Bootstrap ခေါင်းစဉ်
<h5></h5> h5။ Bootstrap ခေါင်းစဉ်
<h6></h6> h6။ Bootstrap ခေါင်းစဉ်

စာရင်းများ

စာရင်းအားလုံး— <ul>, <ol>, နှင့် <dl>— တို့ကို margin-topဖယ်ရှားထားပြီး margin-bottom: 1rem၊ Nested စာရင်းများတွင် မရှိပါ margin-bottom။ padding-leftOn <ul>နှင့် <ol>Element များကိုလည်း ပြန်လည်သတ်မှတ်ထား ပါသည်။

  • စာရင်းအားလုံးတွင် ၎င်းတို့၏ ထိပ်တန်းအနားသတ်များကို ဖယ်ရှားထားသည်။
  • ပြီးတော့ သူတို့ရဲ့ အောက်ခြေအနားသတ်တွေကို ပုံမှန်ပြန်ဖြစ်သွားတယ်။
  • Nested စာရင်းများတွင် အောက်ခြေအနားသတ်မရှိပါ။
    • ဤနည်းဖြင့် ၎င်းတို့သည် ပို၍ပင် အသွင်အပြင်ရှိသည်။
    • အထူးသဖြင့် နောက်ထပ်စာရင်းဝင်သည့်အရာများနောက်တွင်
  • ဘယ်ဘက်အကွက်ကိုလည်း ပြန်လည်သတ်မှတ်ထားပါသည်။
  1. ဤသည်မှာ မှာယူထားသောစာရင်းတစ်ခုဖြစ်သည်။
  2. စာရင်းအချို့နှင့်အတူ
  3. ၎င်းတွင် တူညီသော အသွင်အပြင်ရှိသည်။
  4. ယခင်စာရင်းမသွင်းရသေးသောစာရင်းအတိုင်း

ပိုမိုရိုးရှင်းသောပုံစံ၊ ရှင်းရှင်းလင်းလင်း အထက်တန်းအဆင့်နှင့် ပိုမိုကောင်းမွန်သောအကွာအဝေးအတွက်၊ ဖော်ပြချက်စာရင်းများကို အပ်ဒိတ်လုပ်ထားသည် margin။ <dd>s ကို reset margin-leftလုပ်ပြီး 0add ပါ margin-bottom: .5rem။ <dt>၎ ။ _

ဖော်ပြချက်စာရင်းများ
ဖော်ပြချက်စာရင်းသည် ဝေါဟာရများကို သတ်မှတ်ရန်အတွက် ပြီးပြည့်စုံသည်။
ဖိုးသူတော်
အသုံးအနှုန်းအတွက် အဓိပ္ပာယ်ဖွင့်ဆိုချက်။
တူညီသောအသုံးအနှုန်းအတွက် ဒုတိယအဓိပ္ပါယ်။
နောက်တစ်မျိုး
ဤအခြားအသုံးအနှုန်းအတွက် အဓိပ္ပာယ်ဖွင့်ဆိုချက်။

လိုင်းကုဒ်

ကုဒ်အတိုအထွာများကို အတွင်းလိုင်းအတိုအထွာများဖြင့် ခြုံပါ <code>။ HTML ထောင့်ကွက်များကို ရှောင်ရန် သေချာပါစေ။

ဥပမာအားဖြင့် <section>inline အဖြစ်ထုပ်ပိုးသင့်သည်။ 
For example, <code>&lt;section&gt;</code> should be wrapped as inline.

ကုတ်တုံး

<pre>ကုဒ်စာကြောင်းများစွာအတွက် s ကိုသုံး ပါ။ တစ်ဖန်၊ မှန်ကန်သော rendering အတွက် ကုဒ်ရှိ မည်သည့်ထောင့်ကွင်းစကွက်မှ လွတ်ကင်းရန် သေချာပါစေ။ ၎င်းကို <pre>ဖယ်ရှားရန်နှင့် ၎င်း၏ အတွက် ယူနစ်များကို margin-topအသုံးပြုရန် အစိတ်အပိုင်းကို ပြန်လည်သတ်မှတ်ထားသည် ။remmargin-bottom

<p>Sample text here...</p>
<p>And another line of sample text here...</p>

<pre><code>&lt;p&gt;Sample text here...&lt;/p&gt;
&lt;p&gt;And another line of sample text here...&lt;/p&gt;
</code></pre>

ကိန်းရှင်များ

ကိန်းရှင်များကိုညွှန်ပြရန်အတွက် <var>tag ကိုသုံးပါ။

y = m x + b 
<var>y</var> = <var>m</var><var>x</var> + <var>b</var>

အသုံးပြုသူ ထည့်သွင်းမှု

<kbd>ပုံမှန်အားဖြင့် ကီးဘုတ်မှတစ်ဆင့် ထည့်သွင်းသည့် ထည့်သွင်းမှုကို ညွှန်ပြရန်အတွက် အသုံးပြုပါ ။

လမ်းညွှန်များကို ပြောင်းရန်၊ လမ်းညွှန် cd၏အမည်ကို နောက်တွင် ရိုက်ထည့်ပါ။
ဆက်တင်များကို တည်းဖြတ်ရန် နှိပ်ပါ။ 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>tag ကို အသုံးပြုပါ။

ဤစာသားကို ကွန်ပြူတာပရိုဂရမ်တစ်ခုမှ နမူနာထွက်ရှိမှုအဖြစ် သတ်မှတ်ရန် ရည်ရွယ်သည်။ 
<samp>This text is meant to be treated as sample output from a computer program.</samp>

စားပွဲများ

ဇယားများကို ပုံစံ <caption>s သို့ အနည်းငယ် ချိန်ညှိထားပြီး၊ ဘောင်များ ပြိုကျကာ တစ်လျှောက်လုံး တသမတ်တည်း ဖြစ်စေရန် သေချာသည် text-align။ ဘောင်များ၊ အကွက်များနှင့် အခြားအရာများအတွက် ထပ်လောင်းပြောင်းလဲမှုများ သည် .tableအတန်း နှင့်အတူ လာပါသည် ။

ဤသည်မှာ နမူနာဇယားတစ်ခုဖြစ်ပြီး ၎င်းသည် အကြောင်းအရာများကိုဖော်ပြရန် ၎င်း၏စာတန်းဖြစ်သည်။
ဇယားခေါင်းစဉ် ဇယားခေါင်းစဉ် ဇယားခေါင်းစဉ် ဇယားခေါင်းစဉ်
ဇယားဆဲလ် ဇယားဆဲလ် ဇယားဆဲလ် ဇယားဆဲလ်
ဇယားဆဲလ် ဇယားဆဲလ် ဇယားဆဲလ် ဇယားဆဲလ်
ဇယားဆဲလ် ဇယားဆဲလ် ဇယားဆဲလ် ဇယားဆဲလ်

ပုံစံများ

ရိုးရှင်းသော အခြေခံစတိုင်များအတွက် အမျိုးမျိုးသော ဖောင်ဒြပ်စင်များကို ပြန်လည်စတင်ထားသည်။ ဤသည်မှာ အထင်ရှားဆုံးသော ပြောင်းလဲမှုအချို့ဖြစ်သည်-

  • <fieldset>s တွင် ဘောင်များ၊ အကွက်များ သို့မဟုတ် အနားသတ်များ မပါရှိသောကြောင့် ၎င်းတို့အား တစ်ဦးချင်းထည့်သွင်းမှုများ သို့မဟုတ် သွင်းအားစုများ၏ အုပ်စုများအတွက် ထုပ်ပိုးမှုအဖြစ် အလွယ်တကူအသုံးပြုနိုင်ပါသည်။
  • <legend>s၊ ကွက်လပ်များကဲ့သို့ပင်၊ ခေါင်းစဉ်အမျိုးအစားတစ်ခုအဖြစ် ပြသရန်လည်း ပုံစံပြောင်းထားပါသည်။
  • <label>s ကို အသုံးပြုရန် display: inline-blockခွင့်ပြုရန် သတ်မှတ်ထားသည် margin။
  • <input>s၊ <select>s၊ <textarea>s နှင့် <button>s ကို အများအားဖြင့် Normalize မှ ကိုင်တွယ်ဖြေရှင်းသော်လည်း Reboot သည် ၎င်းတို့၏ marginနှင့် sets များကိုလည်း ဖယ်ရှားသည် line-height: inherit။
  • <textarea>s ကို မကြာခဏ "breaks" စာမျက်နှာ အပြင်အဆင်ကို အလျားလိုက် အရွယ်အစားပြောင်းလဲခြင်းအဖြစ် ဒေါင်လိုက် အရွယ်အစားသာ ပြောင်းလဲနိုင်သော ဒေါင်လိုက်ဖြစ်အောင် ပြင်ဆင်ထားပါသည်။
  • <button>s နှင့် <input>ခလုတ် အစိတ်အပိုင်းများ သည် မည် cursor: pointerသည့်အချိန်တွင် :not(:disabled)ရှိသည် ။

ဤပြောင်းလဲမှုများနှင့် အခြားအရာများကို အောက်တွင် သရုပ်ပြထားပါသည်။

ဥပမာ ဒဏ္ဍာရီ

၁၀၀

ရက်စွဲနှင့် အရောင်ထည့်သွင်းမှု ပံ့ပိုးမှု

Safari အမည်ရ ဘရောက်ဆာအားလုံးမှ ရက်စွဲထည့်သွင်းမှုများကို အပြည့်အဝ မပံ့ပိုး နိုင်သည်ကို သတိပြုပါ။

ခလုတ်များပေါ်ညွှန်ပြချက်များ

Reboot တွင် role="button"မူရင်း cursor ကို ပြောင်းလဲရန် အတွက် မြှင့်တင်မှုတစ်ခု ပါဝင်သည် pointer။ ဒြပ်စင်များသည် အပြန်အလှန်အကျိုးသက်ရောက်မှုရှိသည်ကိုထောက်ပြရန် ဤအရည်အချင်းကို ဒြပ်စင်များသို့ထည့်ပါ။ ၎င်းတို့၏ကိုယ်ပိုင် ပြောင်းလဲမှု <button>ကိုရရှိသည့် အစိတ်အပိုင်းများ အတွက် ဤအခန်းကဏ္ဍသည် မလိုအပ်ပါ ။cursor

ခလုတ်မဟုတ်သောဒြပ်စင်ခလုတ် 
<span role="button" tabindex="0">Non-button element button</span>

ထွေဒွ

လိပ်စာ

ဘ ရောက်ဆာ ကို မူရင်းအတိုင်း <address>ပြန်လည်သတ်မှတ်ရန် အစိတ်အပိုင်းကို အပ်ဒိတ်လုပ်ထား သည် ။ အခုလည်း အမွေဆက်ခံ ပြီး ထပ်ဖြည့်ထားပါတယ်။ s သည် အနီးဆုံးဘိုးဘေး (သို့မဟုတ် အလုပ်တစ်ခုလုံး) အတွက် ဆက်သွယ်ရန်အချက်အလက်များကို တင်ပြရန်ဖြစ်သည်။ စာကြောင်းများဖြင့် အဆုံးသတ်ခြင်းဖြင့် ဖော်မတ်ချခြင်းကို ထိန်းသိမ်းပါ ။font-styleitalicnormalline-heightmargin-bottom: 1rem<address><br>

Twitter, Inc.
1355 Market St, Suite 900
San Francisco, CA 94103
P: (123) 456-7890
အမည်အပြည့်အစုံ
[email protected]

Blockquote

marginblockquotes ၏ ပုံသေ မှာ 1em 40px၊ ထို့ကြောင့် 0 0 1remအခြားအရာများနှင့် ပိုမိုကိုက်ညီသည့်အရာအတွက် ၎င်းကို ကျွန်ုပ်တို့ ပြန်လည်သတ်မှတ်သည်။

blockquote element တွင်ပါရှိသော နာမည်ကြီးကိုးကား။

Source Title တွင် နာမည်ကြီးသူ

Inline ဒြပ်စင်များ

<abbr>စာပိုဒ်များကြားတွင် ၎င်းကို ထင်ရှားစေရန်အတွက် ဒြပ်စင်သည် အခြေခံပုံစံကို ရရှိသည် ။

HTML အတိုကောက် အစိတ်အပိုင်း ။

အကျဉ်းချုပ်

အနှစ်ချုပ်၏ ပုံသေ cursorမှာ ဖြစ်သည် text၊ ထို့ကြောင့် ၎င်းကို pointerနှိပ်ခြင်းဖြင့် ဒြပ်စင်နှင့် အပြန်အလှန် တုံ့ပြန်နိုင်သည်ကို ဖော်ပြရန်အတွက် ၎င်းကို ပြန်လည်သတ်မှတ်သည်။

အချို့အသေးစိတ်

အသေးစိတ်အချက်အလက်များနှင့် ပတ်သက်၍ ပိုမိုသိရှိရန်။

ပိုတောင်အသေးစိတ်

ဤတွင်အသေးစိတ်အချက်များအကြောင်းအသေးစိတ်။

HTML5 [hidden]ရည်ညွှန်းချက်

HTML5 သည် မူရင်းအတိုင်း ပုံစံချထားသည့် ကမ္ဘာလုံးဆိုင်ရာ ရည်ညွှန်းချက်အသစ်ကို ထည့်သွင်းထားသည်။ [hidden]PureCSSdisplay: none ထံမှ အကြံဥာဏ်တစ်ခု ချေး ယူခြင်းဖြင့် ၎င်းကို မတော်တဆ လွှမ်းမိုးခြင်းမှ ကာကွယ်ရန် ကူညီ ခြင်းဖြင့် ကျွန်ုပ်တို့သည် ဤမူလပုံစံအတိုင်း တိုးတက်ကောင်းမွန် လာပါသည်။[hidden] { display: none !important; }display

<input type="text" hidden>
jQuery နှင့် မကိုက်ညီပါ။

[hidden]$(...).hide()jQuery နှင့် $(...).show()နည်းလမ်းများ နှင့် ကိုက်ညီမှုမရှိပါ ။ ထို့ကြောင့်၊ ကျွန်ုပ်တို့သည် ဒြပ်စင်များကို [hidden]စီမံခန့်ခွဲရန် အခြားနည်းပညာများကို လောလောဆယ်တွင် အထူးသဖြင့် ထောက်ခံခြင်းမရှိပါ။display

ဒြပ်စင်တစ်ခု၏ မြင်နိုင်စွမ်းကို ပြောင်းရုံမျှသာဖြစ်ပြီး၊ ၎င်းသည် displayမပြုပြင်မွမ်းမံထားပြီး ဒြပ်စင်သည် စာရွက်စာတမ်း၏စီးဆင်းမှုကို သက်ရောက်မှုရှိနေဆဲဖြစ်သောကြောင့်၊ ၎င်း .invisibleအစား အတန်း အစားကို အသုံးပြုပါ။