responsive
parent
9158814bde
commit
75727ab741
|
@ -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%;
|
||||
}
|
||||
}
|
|
@ -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>
|
||||
|
|
Loading…
Reference in New Issue