1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
|
<!DOCTYPE html>
<!--# include file="nast.shtml" -->
<html lang=sl>
<head>
<meta charset=UTF-8 />
<meta name=author content="3. a, GimB" />
<meta name=description content="OIV naloga 3. a razreda Gimnazije Bežigrad" />
<meta name=viewport content=width=device-width,initial-scale=1,shrink-to-fit=no />
<title>
<!--# echo var="naslov" -->
</title>
<style>
.kontejner {
margin: 2mm;
border-radius: 2mm;
border-top-left-radius: 0mm;
padding: 2mm;
filter: drop-shadow(2px 4px 6px green);
}
body {
background: teal;
display: flex;
flex-direction: column;
justify-content: space-between;
height: 100vh;
margin: 0;
font-family: sans-serif;
}
nav {
background: aqua;
padding: 2mm;
}
h1, h2, h3, h4, h5, h6 {
margin-top: 2mm;
margin-bottom: 2mm;
}
nav h1 {
color: maroon;
margin-left: 2mm;
}
nav p {
background: rgba(100, 100, 100, 0.1);
padding: 1mm;
margin: 0.5mm;
display: flex; /* https://css-tricks.com/snippets/css/a-guide-to-flexbox/ */
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
align-items: stretch;
align-content: normal;
row-gap: 1mm; /* minimum gaps between elements not on the edges */
column-gap: 1mm;
}
.desno {
text-align: right;
order: 99; /* kot element v flexboxu */
flex-grow: 1; /* kolikšen delež naj dobi element ob večanju v flexboxu */
flex-shrink: 1;
align-self: auto; /* individualno nastavljanje align-items vrednosti */
}
nav .sep::after {
content: " | ";
}
article {
color: white;
background: navy;
padding-left: 4mm !important;
padding-right: 4mm !important;
}
footer {
background: maroon;
color: white;
bottom: 0px;
text-align: center;
}
@media screen and (min-width: 1000px) {
body {
margin-left: 10%;
margin-right: 10%;
}
}
</style>
</head>
<body>
<div> <!-- no space-around -->
<nav class=kontejner>
<h1>
Znanost v 20. stoletju
</h1>
<p class=kontejner>
<span>
3. a, GimB, 2021/22
</span>
<span class=desno>
<a href=#avtorji>
Avtorji</a>
<span class=sep></span>
<a href=#kazalo>
Kazalo
</a>
</span>
</p>
</nav>
<article class=kontejner>
<h2>
Kaj pa zgodovina?
</h2>
<p>
Ko zgodovinarji slišijo napake, se pojasni turobni svet antropoloških ved pokrajinske kulturne dediščine. Nikdar prej se ni talo prečudovito vedro pelo ob rosnih jutrih in večerih v soju zarje. Ako se je že spogledal par in uvidel nepopisno lepoto življenja, je kajkmalu sonce pobrisalo vsakršne usodne tegobe bioloških procesov.
</p>
<p>
Rad je poskakoval zajček po zeleni poljani v mesečini in opazoval srnice, ki so prečkale cesto. Njegova peresa so bila polna lepila, zato je moral za trenutek postati in si odpočiti. Nakar naenkrat zagleda urnega plazilca, ki ubira pot po temačnem skalovju trzinskega gozda. S preprostim pritiskom tipke na tipkovnici jo je trajno izbrisal, obenem pa s seboj vzel še vse ostale nič kaj pomembne javorjeve liste, lično zložene v škatlici za nohte.
</p>
<p>
Razrahljala je pas na čevlju, kajti zabolelo jo je v mezincu. Ni se upirala šepetom vetra, ki so ji ponujali zavetje pred marmornatimi stopnicami malomeščanskega stanovanja, temveč se je obrnila je zaklicala <i>SMRT FAŠIZMU</i>. Odgovoril ni nihče, le avtomatski trotonski pisk telefonske centrale, ki je oznanjal začetek ure telovadbe. Pišemo namreč izpit, ki bo pogojeval preostanek našega življenja. Če nam ne uspe, imamo na voljo le še ducat poizkusov, preden se težavnost nivoja začasno zniža.
</p>
</article>
</div>
<footer class=kontejner>
3. a razred Gimnazije Bežigrad, 2021. Distribucija je neomejena.
</footer>
</body>
</html>
|
