FF 라면 반응형 웹 디자인 보기 (Ctrl + Shift + m)..
[cc lang=”css”]
.container::before
{
position: absolute;
top: 0;
right: 0;
padding: .5em;
color: #fff;
font-size: 200%;
}
@media only screen and (min-width: 400px) and (max-width: 500px)
{
.container::before
{
content: “400-500”;
background: red;
}
}
@media only screen and (min-width: 500px) and (max-width: 600px)
{
.container::before
{
content: “500-600”;
background: green;
}
}
@media only screen and (min-width: 600px) and (max-width: 700px)
{
.container::before
{
content: “600-700”;
background: blue;
}
}
@media only screen and (min-width: 700px) and (max-width: 800px)
{
.container::before
{
content: “700-800”;
background: purple;
}
}
@media only screen and (min-width: 800px)
{
.container::before
{
content: “>800”;
background: black;
}
}
[/cc]