docs: add MDN documentation links to CSS properties
Co-authored-by: aider (openrouter/deepseek/deepseek-chat-v3.1) <aider@aider.chat>
This commit is contained in:
parent
86863e1fd9
commit
3ea70349df
@ -1,16 +1,23 @@
|
|||||||
body {
|
body {
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/font-family */
|
||||||
font-family: Helvetica;
|
font-family: Helvetica;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/background-color */
|
||||||
background-color: #EAEAEA;
|
background-color: #EAEAEA;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/margin */
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/padding */
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
header {
|
header {
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/position */
|
||||||
position: relative;
|
position: relative;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/text-align */
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
header img {
|
header img {
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/width */
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -23,12 +30,19 @@ header img {
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
.header-text {
|
.header-text {
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/position */
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/top */
|
||||||
top: 50%;
|
top: 50%;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/left */
|
||||||
left: 50%;
|
left: 50%;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/transform */
|
||||||
transform: translate(-50%, -50%);
|
transform: translate(-50%, -50%);
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/color */
|
||||||
color: white;
|
color: white;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/font-size */
|
||||||
font-size: 48px;
|
font-size: 48px;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight */
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -37,9 +51,13 @@ nav (menu) i footer (stopka) mają ciemnoszare tło (#625B5B), biały tekst i pa
|
|||||||
text-align: center – centruje zawartość.
|
text-align: center – centruje zawartość.
|
||||||
*/
|
*/
|
||||||
nav, footer {
|
nav, footer {
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/background-color */
|
||||||
background-color: #625B5B;
|
background-color: #625B5B;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/color */
|
||||||
color: white;
|
color: white;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/padding */
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/text-align */
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -54,12 +72,19 @@ border-radius: 20px – zaokrąglone rogi
|
|||||||
text-decoration: none – usuwa podkreślenie linków
|
text-decoration: none – usuwa podkreślenie linków
|
||||||
*/
|
*/
|
||||||
nav a {
|
nav a {
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight */
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/background-color */
|
||||||
background-color: #EAEAEA;
|
background-color: #EAEAEA;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/color */
|
||||||
color: #625B5B;
|
color: #625B5B;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/padding */
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/margin */
|
||||||
margin: 50px;
|
margin: 50px;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius */
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration */
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -68,8 +93,11 @@ Tło staje się ciemne, tekst jasny → efekt "przełączania"
|
|||||||
border: 1px solid – dodaje obramowanie */
|
border: 1px solid – dodaje obramowanie */
|
||||||
|
|
||||||
nav a:hover {
|
nav a:hover {
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/background-color */
|
||||||
background-color: #625B5B;
|
background-color: #625B5B;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/color */
|
||||||
color: #EAEAEA;
|
color: #EAEAEA;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/border */
|
||||||
border: 1px solid #EAEAEA;
|
border: 1px solid #EAEAEA;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -77,7 +105,9 @@ nav a:hover {
|
|||||||
list-style-type: circle – kropki jako kółka */
|
list-style-type: circle – kropki jako kółka */
|
||||||
|
|
||||||
ul {
|
ul {
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/margin */
|
||||||
margin-left: 40px;
|
margin-left: 40px;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type */
|
||||||
list-style-type: circle;
|
list-style-type: circle;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -87,19 +117,25 @@ margin-left: 40px – wcięcie od lewej
|
|||||||
text-align: center – tekst w tabeli jest wyśrodkowany */
|
text-align: center – tekst w tabeli jest wyśrodkowany */
|
||||||
|
|
||||||
table {
|
table {
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/border */
|
||||||
border: 1px dashed #625B5B;
|
border: 1px dashed #625B5B;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/width */
|
||||||
width: 60%;
|
width: 60%;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/margin */
|
||||||
margin-left: 40px;
|
margin-left: 40px;
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/text-align */
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Klasa .kontrolki – np. dla przycisków, daje mały margines. */
|
/* Klasa .kontrolki – np. dla przycisków, daje mały margines. */
|
||||||
.kontrolki {
|
.kontrolki {
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/margin */
|
||||||
margin: 5px;
|
margin: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* main – główna treść strony ma wewnętrzny odstęp 20px od brzegów. */
|
/* main – główna treść strony ma wewnętrzny odstęp 20px od brzegów. */
|
||||||
|
|
||||||
main {
|
main {
|
||||||
|
/* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/padding */
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user