Automatisch Anpassen

Ich hatte mir @media durchgelesen aber verstehe das nicht.

Der hier verwendete Code

<style> a{ display:none; margin-left:45%; font-size:50px; } @media (min-width: 1px) and (max-width: 400px){ div{ background:red; width:100px; height:100px; } } @media (min-width: 401px) and (max-width: 600px){ div{ background:green; width:200px; height:100px; } a{ display:block; } } @media (min-width: 601px) and (max-width: 800px){ div{ background:blue; width:200px; height:200px; } } @media (min-width: 801px) and (max-width: 1100px){ div{ background:yellow; width:300px; height:300px; } } @media (min-width: 1101px) and (max-width: 1300px){ div{ background:orange; width:200px; height:100px; } } @media (min-width: 1301px) and (max-width: 2400px){ div{ background:yellow; width:200px; height:100px; } } </style> <div></div><a>Jetzt kapiert</a>