귀하의 웹 페이지가 좋아 보인다 및 기기의 종류에 상관없이 쉽게 사용할 수 있어야합니다.
반응 형 웹 디자인은 무엇인가?
반응 형 웹 디자인은 웹 페이지가 모든 기기에 잘 보이게 (desktops, tablets, and phones) .
반응 형 웹 디자인, 크기를 조정 숨기기, 축소, 확대, 또는 어떤 화면에서 잘 보이도록 컨텐츠를 이동하는 CSS를 사용하여 HTML에 관한 것입니다 :
자신의 응답 디자인 만들기
반응 형 디자인을 만들 수있는 한 가지 방법은, 스스로를 만드는 것입니다 :
예
<!DOCTYPE html>
<html lang="en-us">
<head>
<style>
.city {
float: left;
margin: 5px;
padding: 15px;
width: 300px;
height: 300px;
border: 1px solid black;
}
</style>
</head>
<body>
<h1>Responsive Web Design Demo</h1>
<div class="city">
<h2>London</h2>
<p>London is the capital city of England.</p>
<p>It is the most populous city in the United Kingdom,
with a metropolitan area of over 13 million inhabitants.</p>
</div>
<div class="city">
<h2>Paris</h2>
<p>Paris is the capital of France.</p>
<p>The Paris area is one of the largest population centers in Europe,
with more than 12 million inhabitants.</p>
</div>
<div class="city">
<h2>Tokyo</h2>
<p>Tokyo is the capital of Japan.</p>
<p>It is the center of the Greater Tokyo Area,
and the most populous metropolitan area in the world.</p>
</div>
</body>
</html>
»그것을 자신을 시도 W3.CSS 사용
반응 형 디자인을 만들 수있는 또 다른 방법은 같은 대답하는 스타일 시트를 사용하는 것입니다 W3.CSS
W3.CSS는 쉽게 어떤 크기 예뻐요 사이트를 개발 할 수 있습니다; 데스크톱, 노트북, 태블릿, 전화 :
W3.CSS 데모
이 응답 페이지 크기를 조정!
런던
런던은 영국의 수도 도시입니다.
그것은 만 13 이상 주민의 수도권으로, 영국에서 가장 인구가 많은 도시입니다.
파리
파리는 프랑스의 수도입니다.
파리 지역은 12 개 이상의 백만명의 주민과 함께 유럽에서 가장 큰 인구 밀집 지역 중 하나입니다.
도쿄
도쿄는 일본의 수도이다.
그것은 수도권의 중심, 세계에서 가장 인구가 많은 대도시 지역입니다.
예
<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://www.w3ii.com/lib/w3.css">
<body>
<div class="w3-container w3-orange">
<h1>W3.CSS Demo</h1>
<p>Resize this responsive page!</p>
</div>
<div class="w3-row-padding">
<div class="w3-third">
<h2>London</h2>
<p>London is the capital city of England.</p>
<p>It is the most populous city in the United Kingdom,
with a metropolitan area of over 13 million inhabitants.</p>
</div>
<div class="w3-third">
<h2>Paris</h2>
<p>Paris is the capital of France.</p>
<p>The Paris area is one of the largest population centers in Europe,
with more than 12 million inhabitants.</p>
</div>
<div class="w3-third">
<h2>Tokyo</h2>
<p>Tokyo is the capital of Japan.</p>
<p>It is the center of the Greater Tokyo Area,
and the most populous metropolitan area in the world.</p>
</div>
</div>
</body>
</html>
»그것을 자신을 시도 W3.CSS에 대한 자세한 내용은, 우리의 읽을 W3.CSS 자습서 .