រំលងទៅខ្លឹមសារ

ប៊ូតុងជំនួយ

សម្រាប់ជម្រើស 'មិនធ្វើឥឡូវទេ' ដែលត្រូវឈរក្បែរប៊ូតុងសំខាន់។

ប៊ូតុង និងសកម្មភាព

មើលជាមុនផ្ទាល់

ប្រភព

<button type="button" class="dc-sbtn">취소</button>
.dc-sbtn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--dc-2);
  min-height: 44px; padding: 0 var(--dc-5);
  border: 1px solid var(--dc-line-field); border-radius: var(--dc-r-sm);
  background: var(--dc-surface); color: var(--dc-text);
  font-family: var(--dc-font); font-size: 15px; font-weight: 600; line-height: 1;
  white-space: nowrap;
  transition: background var(--dc-fast), border-color var(--dc-fast);
}
.dc-sbtn:hover,
.dc-sbtn.is-hover { background: var(--dc-sunken); border-color: var(--dc-text-sub); }
.dc-sbtn[disabled] {
  background: var(--dc-sunken); color: var(--dc-text-mute);
  border-color: var(--dc-line); cursor: not-allowed;
}
.dc-sbtn--quiet { background: transparent; border-color: transparent; color: var(--dc-brand-text); }
.dc-sbtn--quiet:hover { background: var(--dc-brand-soft); border-color: transparent; }
.dc-sbtn__icon { width: 18px; height: 18px; flex: none; }

របៀបប្រើ

  • ប្រើសម្រាប់សកម្មភាពថយក្រោយ៖ បោះបង់ ធ្វើពេលក្រោយ ត្រឡប់
  • ពេលឈរជាមួយប៊ូតុងសំខាន់ ត្រូវឱ្យភ្នែកមើលឃើញប៊ូតុងសំខាន់មុន
  • មួយជួរកុំលើសពីពីរ — ទម្ងន់ស្មើគ្នាធ្វើឱ្យពិបាកជ្រើស

ចំណុចត្រូវប្រុងប្រយ័ត្ន

  • ស៊ុមត្រូវប្រើ --dc-line-field; បន្ទាត់តុបតែង --dc-line មិនមើលទៅដូចចុចបានទេ
  • ទម្រង់ស្ងាត់ប្រើបានតែពេលមានប៊ូតុងផ្សេងនៅជុំវិញ; ឈរតែម្នាក់គេមិនដឹងថាជាប៊ូតុង

បន្ទាប់