ﺽﺮﻋ ﺮﺜﮐﺍﺪﺣ ﻭ ﺽﺮﻋ - CSS ﯼﺪﻨﺑ ﺡﺮﻃ

فهرست مطالب

    نمایش فهرست مطالب

.ﺭﺎﮐﺩﻮﺧ :ﻪﯿﺷﺎﺣ ﻭ ﺽﺮﻋ ﺮﺜﮐﺍﺪﺣ ،ﺽﺮﻋ ﺯﺍ ﻩﺩﺎﻔﺘﺳﺍ ﺎﺑ

ﺪﻨﮐ ﯽﻣ ﻝﺎﻐﺷﺍ ﺍﺭ ﺩﻮﺟﻮﻣ ﺽﺮﻋ ﻡﺎﻤﺗ ﻪﺸﯿﻤﻫ ﮎﻮﻠﺑ ﺢﻄﺳ ﺭﺩ ﺮﺼﻨﻋ ﮏﯾ ؛ﺪﺷ ﺮﮐﺫ ﻞﺒﻗ ﻞﺼﻓ ﺭﺩ ﻪﮐ

.ﺪﻨﮐ ﯽﻣ ﯼﺮﯿﮔﻮﻠﺟ ﻥﺁ ﻥﺪﺷ ﻩﺪﯿﺸﮐ ﺯﺍ ﮎﻮﻠﺑ ﺢﻄﺳ ﺭﺩ ﺮﺼﻨﻋ ﮏﯾ ﺽﺮﻋ<"code class="w3

This <div> element has a width of 500px, and margin set to auto.

ﻪﺟﻮﺗ: ﻞﮑﺸﻣ <div> ﯽﻣ ﺥﺭ ﯽﻧﺎﻣﺯ

ﺩﻮﺒﻬﺑ ﺚﻋﺎﺑ ،ﻂﯾﺍﺮﺷ ﻦﯾﺍ ﺭﺩ ،ﺽﻮﻋ ﺭﺩ max-width ﺯﺍ

This <div> element has a max-width of 500px, and margin set to auto.

ﻪﺘﮑﻧ: ﻦﯿﺑ ﺕﻭﺎﻔﺗ ﺎﺗ ﺪﯿﻫﺩ ﺮﯿﯿﻐﺗ ﻞﺴﮑﯿﭘ 500 ﺯﺍ ﺮﺘﻤﮐ ﺽﺮﻋ ﻪﺑ ﺍﺭ ﺮﮔﺭ

:ﺖﺳﺍ ﻩﺪﺷ ﻩﺩﺭﻭﺁ ﻻﺎﺑ div ﻭﺩ ﺯﺍ ﻪﻧﻮﻤﻧ ﮏﯾ ﺎﺠﻨﯾﺍ ﺭﺩ

ﻝﺎﺜﻣ

div.ex1 {
  width: 500px;
  margin: 
auto;
  border: 3px solid #73AD21;
}

div.ex2 {
  max-width: 500px;
  
margin: auto;
  border: 3px solid #73AD21;
}

→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ

<!DOCTYPE html>
<html>
<head>
<style>
div.ex1 {
  width: 500px;
  margin: auto;
  border: 3px solid #73AD21;
}

div.ex2 {
  max-width: 500px;
  margin: auto;
  border: 3px solid #73AD21;
}
</style>
</head>
<body>

<h2>CSS Max-width</h2>

<div class="ex1">This div element has width: 500px;</div>
<br>

<div class="ex2">This div element has max-width: 500px;</div>

<p><strong>Tip:</strong> Drag the browser window to smaller than 500px wide, to see the difference between 
the two divs!</p>

</body>
</html>