responsive

master
Andy 2020-03-10 20:30:01 +01:00
parent 9158814bde
commit 75727ab741
2 changed files with 20 additions and 0 deletions

18
css/responsive.css 100644
View File

@ -0,0 +1,18 @@
/***
*** Ab hier responsive Angaben
***/
@media (max-width: 620px) {
header{
clip-path: polygon(0 0, 100% 0, 100% 80%, 0 200px);
background: #a82e0f;
}
footer{
clip-path: polygon(0 20%, 100% 0, 100% 100%, 0 200px);
background: #a82e0f;
}
}
@media (max-width: 400px){
.box {
width: 100%;
}
}

View File

@ -10,6 +10,7 @@
<link rel="stylesheet" href="../css/code.css">
<link rel="stylesheet" href="../css/style.css">
<link rel="stylesheet" href="../css/struktur.css">
<link rel="stylesheet" href="../css/responsive.css">
</head>
<body>
@ -31,6 +32,7 @@
<h1>Inhalt strukturieren mit css</h1>
<article>
<h2>Float</h2>
<p>lorem300</p>
<div class="bigbox">
<div class="box floatleft"></div>
<div class="box clearfix"></div>