<html>
<head>
<style>
.leftDiv{
width: 60%;
float: left;
background: #00ffff;
border: solid 1px #ff0000;
}
.rightDiv {
width: 35%;
float: right;
background: #ffff00;
border: solid 1px #00ff00;
}
@media screen and (max-width: 900px) {
.leftDiv {
width: 65%;
}
.rightDiv {
width: 30%;
}
}
@media screen and (max-width: 700px) {
.leftDiv {
width: auto;
float: none;
}
.rightDiv {
width: auto;
float: none;
}
}
@media screen and (max-width: 480px) {
.leftDiv {
display: none;
}
}
</style>
</head>
<body>
<div>
Sayfayı yeniden boyutlandırın.
</div>
<div class="leftDiv">
HTML<br/>
CSS<br/>
JavaScript<br/>
HTML 5<br/>
CSS 3<br/>
</div>
<div class="rightDiv">
JQuery<br/>
Bootstrap<br/>
AngularJS<br/>
</div>
</body>
</html>
Dosyayı İndir