portal > css > reset.css

  1. /*!
  2.  * ress.css • v1.2.2
  3.  * MIT License
  4.  * github.com/filipelinhares/ress
  5.  */
  6.  
  7. /* # =================================================================
  8.   # Global selectors
  9.   # ================================================================= */
  10.  
  11. html {
  12. box-sizing: border-box;
  13. overflow-y: scroll; /* All browsers without overlaying scrollbars */
  14. -webkit-text-size-adjust: 100%; /* iOS 8+ */
  15. }
  16.  
  17. *,
  18. :::before,
  19. :::after {
  20. background-repeat: no-repeat; /* Set `background-repeat: no-repeat` to all elements and pseudo elements */
  21. box-sizing: inherit;
  22. }
  23.  
  24. :::before,
  25. :::after {
  26. text-decoration: inherit; /* Inherit text-decoration and vertical align to :::before and :::after pseudo elements */
  27. vertical-align: inherit;
  28. }
  29.  
  30. * {
  31. padding: 0; /* Reset `padding` and `margin` of all elements */
  32. margin: 0;
  33. }
  34.  
  35. /* # =================================================================
  36.   # General elements
  37.   # ================================================================= */
  38.  
  39. /* Add the correct display in iOS 4-7.*/
  40. audio:not([controls]) {
  41. display: none;
  42. height: 0;
  43. }
  44.  
  45. hr {
  46. overflow: visible; /* Show the overflow in Edge and IE */
  47. }
  48.  
  49. /*
  50. * Correct `block` display not defined for any HTML5 element in IE 8/9
  51. * Correct `block` display not defined for `details` or `summary` in IE 10/11
  52. * and Firefox
  53. * Correct `block` display not defined for `main` in IE 11
  54. */
  55. article,
  56. aside,
  57. details,
  58. figcaption,
  59. figure,
  60. footer,
  61. header,
  62. main,
  63. menu,
  64. nav,
  65. section,
  66. summary {
  67. display: block;
  68. }
  69.  
  70. summary {
  71. display: list-item; /* Add the correct display in all browsers */
  72. }
  73.  
  74. small {
  75. font-size: 80%; /* Set font-size to 80% in `small` elements */
  76. }
  77.  
  78. [hidden],
  79. template {
  80. display: none; /* Add the correct display in IE */
  81. }
  82.  
  83. abbr[title] {
  84. border-bottom: 1px dotted; /* Add a bordered underline effect in all browsers */
  85. text-decoration: none; /* Remove text decoration in Firefox 40+ */
  86. }
  87.  
  88. a {
  89. background-color: transparent; /* Remove the gray background on active links in IE 10 */
  90. -webkit-text-decoration-skip: objects; /* Remove gaps in links underline in iOS 8+ and Safari 8+ */
  91. }
  92.  
  93. a:active,
  94. a:hover {
  95. outline-width: 0; /* Remove the outline when hovering in all browsers */
  96. }
  97.  
  98. code,
  99. kbd,
  100. pre,
  101. samp {
  102. font-family: monospace, monospace; /* Specify the font family of code elements */
  103. }
  104.  
  105. b,
  106. strong {
  107. font-weight: bolder; /* Correct style set to `bold` in Edge 12+, Safari 6.2+, and Chrome 18+ */
  108. }
  109.  
  110. dfn {
  111. font-style: italic; /* Address styling not present in Safari and Chrome */
  112. }
  113.  
  114. /* Address styling not present in IE 8/9 */
  115. mark {
  116. background-color: #ff0;
  117. color: #000;
  118. }
  119.  
  120. /* https://gist.github.com/unruthless/413930 */
  121. sub,
  122. sup {
  123. font-size: 75%;
  124. line-height: 0;
  125. position: relative;
  126. vertical-align: baseline;
  127. }
  128.  
  129. sub {
  130. bottom: -0.25em;
  131. }
  132.  
  133. sup {
  134. top: -0.5em;
  135. }
  136.  
  137. /* # =================================================================
  138.   # Forms
  139.   # ================================================================= */
  140.  
  141. input {
  142. border-radius: 0;
  143. }
  144.  
  145. /* Apply cursor pointer to button elements */
  146. button,
  147. [type="button"],
  148. [type="reset"],
  149. [type="submit"],
  150. [role="button"] {
  151. cursor: pointer;
  152. }
  153.  
  154. /* Replace pointer cursor in disabled elements */
  155. [disabled] {
  156. cursor: default;
  157. }
  158.  
  159. [type="number"] {
  160. width: auto; /* Firefox 36+ */
  161. }
  162.  
  163. [type="search"] {
  164. -webkit-appearance: textfield; /* Safari 8+ */
  165. }
  166.  
  167. [type="search"]::-webkit-search-cancel-button,
  168. [type="search"]::-webkit-search-decoration {
  169. -webkit-appearance: none; /* Safari 8 */
  170. }
  171.  
  172. textarea {
  173. overflow: auto; /* Internet Explorer 11+ */
  174. resize: vertical; /* Specify textarea resizability */
  175. }
  176.  
  177. button,
  178. input,
  179. optgroup,
  180. select,
  181. textarea {
  182. font: inherit; /* Specify font inheritance of form elements */
  183. }
  184.  
  185. optgroup {
  186. font-weight: bold; /* Restore the font weight unset by the previous rule. */
  187. }
  188.  
  189. button {
  190. overflow: visible; /* Address `overflow` set to `hidden` in IE 8/9/10/11 */
  191. }
  192.  
  193. /* Remove inner padding and border in Firefox 4+ */
  194. button::-moz-focus-inner,
  195. [type="button"]::-moz-focus-inner,
  196. [type="reset"]::-moz-focus-inner,
  197. [type="submit"]::-moz-focus-inner {
  198. border-style: 0;
  199. padding: 0;
  200. }
  201.  
  202. /* Replace focus style removed in the border reset above */
  203. button:-moz-focusring,
  204. [type="button"]::-moz-focus-inner,
  205. [type="reset"]::-moz-focus-inner,
  206. [type="submit"]::-moz-focus-inner {
  207. outline: 1px dotted ButtonText;
  208. }
  209.  
  210. button,
  211. html [type="button"], /* Prevent a WebKit bug where (2) destroys native `audio` and `video`controls in Android 4 */
  212. [type="reset"],
  213. [type="submit"] {
  214. -webkit-appearance: button; /* Correct the inability to style clickable types in iOS */
  215. }
  216.  
  217. button,
  218. select {
  219. text-transform: none; /* Firefox 40+, Internet Explorer 11- */
  220. }
  221.  
  222. /* Remove the default button styling in all browsers */
  223. button,
  224. input,
  225. select,
  226. textarea {
  227. background-color: transparent;
  228. border-style: none;
  229. color: inherit;
  230. }
  231.  
  232. /* Style select like a standard input */
  233. select {
  234. -moz-appearance: none; /* Firefox 36+ */
  235. -webkit-appearance: none; /* Chrome 41+ */
  236. }
  237.  
  238. select::-ms-expand {
  239. display: none; /* Internet Explorer 11+ */
  240. }
  241.  
  242. select::-ms-value {
  243. color: currentColor; /* Internet Explorer 11+ */
  244. }
  245.  
  246. legend {
  247. border: 0; /* Correct `color` not being inherited in IE 8/9/10/11 */
  248. color: inherit; /* Correct the color inheritance from `fieldset` elements in IE */
  249. display: table; /* Correct the text wrapping in Edge and IE */
  250. max-width: 100%; /* Correct the text wrapping in Edge and IE */
  251. white-space: normal; /* Correct the text wrapping in Edge and IE */
  252. }
  253.  
  254. ::-webkit-file-upload-button {
  255. -webkit-appearance: button; /* Correct the inability to style clickable types in iOS and Safari */
  256. font: inherit; /* Change font properties to `inherit` in Chrome and Safari */
  257. }
  258.  
  259. [type="search"] {
  260. -webkit-appearance: textfield; /* Correct the odd appearance in Chrome and Safari */
  261. outline-offset: -2px; /* Correct the outline style in Safari */
  262. }
  263.  
  264. /* # =================================================================
  265.   # Specify media element style
  266.   # ================================================================= */
  267.  
  268. img {
  269. border-style: none; /* Remove border when inside `a` element in IE 8/9/10 */
  270. }
  271.  
  272. /* Add the correct vertical alignment in Chrome, Firefox, and Opera */
  273. progress {
  274. vertical-align: baseline;
  275. }
  276.  
  277. svg:not(:root) {
  278. overflow: hidden; /* Internet Explorer 11- */
  279. }
  280.  
  281. audio,
  282. canvas,
  283. progress,
  284. video {
  285. display: inline-block; /* Internet Explorer 11+, Windows Phone 8.1+ */
  286. }
  287.  
  288. /* # =================================================================
  289.   # Accessibility
  290.   # ================================================================= */
  291.  
  292. /* Hide content from screens but not screenreaders */
  293. @media screen {
  294. [hidden~="screen"] {
  295. display: inherit;
  296. }
  297. [hidden~="screen"]:not(:active):not(:focus):not(:target) {
  298. position: absolute !important;
  299. clip: rect(0 0 0 0) !important;
  300. }
  301. }
  302.  
  303. /* Specify the progress cursor of updating elements */
  304. [aria-busy="true"] {
  305. cursor: progress;
  306. }
  307.  
  308. /* Specify the pointer cursor of trigger elements */
  309. [aria-controls] {
  310. cursor: pointer;
  311. }
  312.  
  313. /* Specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements */
  314. [aria-disabled] {
  315. cursor: default;
  316. }
  317.  
  318. /* # =================================================================
  319.   # Selection
  320.   # ================================================================= */
  321.  
  322. /* Specify text selection background color and omit drop shadow */
  323.  
  324. ::-moz-selection {
  325. background-color: #b3d4fc; /* Required when declaring ::selection */
  326. color: #000;
  327. text-shadow: none;
  328. }
  329.  
  330. ::selection {
  331. background-color: #b3d4fc; /* Required when declaring ::selection */
  332. color: #000;
  333. text-shadow: none;
  334. }
  335.  

タグ:

+ タグ編集
  • タグ:
最終更新:2022年03月24日 18:45