mirror of
https://github.com/twbs/bootstrap.git
synced 2025-02-17 14:54:30 +01:00
Set cursor:pointer
for <summary>
This commit is contained in:
parent
1a4a94bfd9
commit
a5232abefc
@ -333,6 +333,22 @@ The `<abbr>` element receives basic styling to make it stand out amongst paragra
|
||||
Nulla <abbr title="attribute">attr</abbr> vitae elit libero, a pharetra augue.
|
||||
</div>
|
||||
|
||||
### Summary
|
||||
|
||||
The default `cursor` on summary is `text`, so we reset that to `pointer` to convey that the element can be interacted with by clicking on it.
|
||||
|
||||
<div class="bd-example">
|
||||
<details>
|
||||
<summary>Some details</summary>
|
||||
<p>More info about the details.</p>
|
||||
</details>
|
||||
|
||||
<details open>
|
||||
<summary>Even more details</summary>
|
||||
<p>Here are even more details about the details.</p>
|
||||
</details>
|
||||
</div>
|
||||
|
||||
## HTML5 `[hidden]` attribute
|
||||
|
||||
HTML5 adds [a new global attribute named `[hidden]`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden), which is styled as `display: none` by default. Borrowing an idea from [PureCSS](https://purecss.io/), we improve upon this default by making `[hidden] { display: none !important; }` to help prevent its `display` from getting accidentally overridden. While `[hidden]` isn't natively supported by IE10, the explicit declaration in our CSS gets around that problem.
|
||||
|
@ -491,6 +491,7 @@ output {
|
||||
|
||||
summary {
|
||||
display: list-item; // Add the correct display in all browsers
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
template {
|
||||
|
Loading…
x
Reference in New Issue
Block a user