.ﺪﻨﻫﺩ ﯽﻣ ﻪﺋﺍﺭﺍ ﺍﺭ ﺍﺮﮕﺸﻨﮐﺍﻭ ﯽﺣﺍﺮﻃ ﻪﮐ ﺪﻧﺭﺍﺩ ﺩﻮﺟﻭ ﯼﺩﺎﯾﺯ ﻥﺎﮕﯾﺍﺭ CSS ﯼﺎﻫ ﮎﺭﻮﻤﯾﺮﻓ
https://www.w3schools.com/w3css/default.asp :ﺖﺳﺍ W3.CSS ﺪﻨﻧﺎﻣ ﺍﺮﮔ ﺶﻨﮐﺍﻭ ﻪﻣﺎﻧ ﻩ
W3.CSS ﺪﻨﮐ ﯽﻣ ﻥﺎﺳﺁ ﺍﺭ ﺪﻨﺳﺭ ﯽﻣ ﺮﻈﻧ ﻪﺑ ﺎﺒﯾﺯ ﯼﺍ ﻩﺯﺍﺪﻧﺍ ﺮﻫ ﺭﺩ ﻪﮐ ﺍﺭ ﯽﯾﺎﻫ ﺖﯾﺎﺳ ﻪﻌﺳﻮ
Resize the page to see the responsiveness!
London is the capital city of England.
It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.
Paris is the capital of France.
The Paris area is one of the largest population centers in Europe, with more than 12 million inhabitants.
Tokyo is the capital of Japan.
It is the center of the Greater Tokyo Area, and the most populous metropolitan area in the world.
<!DOCTYPE html>
<html>
<meta name="viewport"
content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="https://www.w3schools.com/w3css/4/w3.css">
<body>
<div
class="w3-container w3-blue">
<h1>W3Schools 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>→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ
<!DOCTYPE html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<body>
<div class="w3-container w3-blue">
<h1>W3Schools 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 ﺩﺭﻮﻣ ﺭﺩ ﺮﺘﺸﯿﺑ ﺕﺎﻋﻼﻃﺍ ﺐﺴﮐ ﯼﺍﺮﺑ
ﺪﻨﮐ ﯽﻣ ﻩﺩﺎﻔﺘﺳﺍ CSS ﻭ HTML ﺯﺍ ﺖﺧﺎﺳ ﯼﺍﺮﺑ .ﺖﺳﺍ ﭖﺮﺘﺳﺍ ﺕﻮﺑ ﺮﮕﯾﺩ ﺏﻮﺒﺤﻣ ﮎﺭﻮﻤﯾﺮﻓ
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap 5 Example</title>
<meta charset="utf-8">
<meta
name="viewport" content="width=device-width, initial-scale=1">
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"
rel="stylesheet">
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div class="container-fluid p-5 bg-primary text-white
text-center">
<h1>My First Bootstrap Page</h1>
<p>Resize
this responsive page to see the effect!</p>
</div>
<div class="container mt-5">
<div class="row">
<div class="col-sm-4">
<h3>Column 1</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
</div>
<div class="col-sm-4">
<h3>Column 2</h3>
<p>Lorem ipsum dolor sit
amet, consectetur adipisicing elit...</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
</div>
<div class="col-sm-4">
<h3>Column 3</h3>
<p>Lorem ipsum dolor sit
amet, consectetur adipisicing elit...</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
</div>
</div>
</div>
</body>
</html>→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap 5 Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div class="container-fluid p-5 bg-primary text-white text-center">
<h1>My First Bootstrap Page</h1>
<p>Resize this responsive page to see the effect!</p>
</div>
<div class="container mt-5">
<div class="row">
<div class="col-sm-4">
<h3>Column 1</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
</div>
<div class="col-sm-4">
<h3>Column 2</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
</div>
<div class="col-sm-4">
<h3>Column 3</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
</div>
</div>
</div>
</body>
</html>
.ﺪﯾﻭﺮﺑ ﺎﻣ ﭖﺮﺘﺳﺍ ﺕﻮﺑ ﺵﺯﻮﻣﺁ ﻪﺑ ،ﭖﺮﺘﺳﺍ ﺕﻮﺑ ﺩﺭﻮﻣ ﺭﺩ ﺮﺘﺸﯿﺑ ﺕﺎﻋﻼﻃﺍ ﺐﺴﮐ ﯼﺍﺮﺑ