layout mit uhr und datum
Wie kann man den die Schriftgröße vom Uhr js ändern und gibt es sowas auch mit Datum?
Der hier verwendete Code
<html lang="en">
<head>
<meta charset="utf-8">
<title>Homepage</title>
<style>
html, body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
background:red;
}
#wrapper {
display: flex;
flex-direction: column;
height: 100%;
min-height: 100%;
}
header {
background-color: deepskyblue;
margin-bottom:6px;
}
#navigation{
display:flex;
flex-direction:column;
display:flex;
}
.navv{
display:flex;
}
.nav2{
flex:1;
background-color: darkgray;
margin-bottom:6px;
}
.nav1{
flex:1;
margin-right:6px;
background-color: darkgray;
margin-bottom:6px;
}
.nav3{
flex:1;
background-color: darkgray;
margin-bottom:6px;
}
#mehrspaltig {
display: flex;
flex:5;
}
#links{
display:flex;
flex-direction:column;
flex: 5;
}
article.article1 {
background-color: orange;
margin-right:6px;
flex:5;
}
article.article2 {
background-color: orange;
margin-top:6px;
margin-right:6px;
flex:5;
}
#rechts{
display:flex;
flex-direction:column;
flex:1;
}
aside.aside1{
background-color: gray;
flex: 5;
}
aside.aside2{
margin-top:6px;
background-color: gray;
flex: 1;
}
footer {
display:flex;
margin-top:6px;
}
#foot_left{
background:green;
flex:5;
margin-right:6px;
}
#foot_right{
background:green;
flex:5;
}
</style>
</head>
<body>
<script src="Hier kommt der pfad oder link zum javascript rein"></script>
<div id="wrapper">
<header>Kopfzeile</header>
<div id="navigation">
<div class="navv">
<div class="nav1">Navigation</div>
<div class="nav2">Navigation2</div></div>
<div class="navv">
<div class="nav1">Navigation</div>
<div class="nav2">Navigation2</div></div>
<div class="navv">
<div class="nav3">Navigation</div>
</div>
</div>
<div id="mehrspaltig">
<div id="links">
<article class="article1">Inhalt1</article>
<article class="article2">Inhalt2</article>
</div>
<div id="rechts">
<aside class="aside1">Zusatz1</aside>
<aside class="aside2">Zusatz2</aside>
</div>
</div>
<footer>
<div id="foot_left">links</div>
<div id="foot_right">
<div class="clock"></div>
</div>
</footer>
</div>
<script>
function clock() {
var time = new Date(),
hours = time.getHours(),
minutes = time.getMinutes(),
seconds = time.getSeconds();
document.querySelectorAll('.clock')[0].innerHTML = harold(hours) + ":" + harold(minutes) + ":" + harold(seconds);
function harold(standIn) {
if (standIn < 10) {
standIn = '0' + standIn
}
return standIn;
}
}
setInterval(clock, 1000);
</script>
</body>
</html>