،ﺪﯿﻨﮐ ﺺﺨﺸﻣ ﺍﺭ ﮏﺒﺳ ﺪﻫﺩ ﯽﻣ ﻥﺎﮑﻣﺍ ﺎﻤﺷ ﻪﺑ CSS ﻪﯿﺷﺎﺣ ﯼﺎﻫ ﯽﮔﮋﯾﻭ
.ﻡﺭﺍﺩ ﺯﺮﻣ ﻑﺮﻃ ﺮﻫ ﺯﺍ ﻦﻣ
.ﻡﺭﺍﺩ ﺰﻣﺮﻗ ﻦﯿﯾﺎﭘ ﻪﯿﺷﺎﺣ ﮏﯾ ﻦﻣ
.ﻡﺭﺍﺩ ﺩﺮﮔ ﯼﺎﻫ ﻪﯿﺷﺎﺣ ﻦﻣ
.ﺩﻮﺷ ﻩﺩﺍﺩ ﺶﯾﺎﻤﻧ ﯼﺍ ﻪﯿﺷﺎﺣ ﻉﻮﻧ ﻪﭼ ﻪﮐ ﺪﻨﮐ ﯽﻣ ﺺﺨﺸﻣ
:ﺖﺳﺍ ﺯﺎﺠﻣ ﺮﯾﺯ ﺮﯾﺩﺎﻘﻣ
dottedﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﻪﺘﺴﮑﺷ ﺯﺮﻣ ﮏﯾ -
solidﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﺪﻣﺎﺟ ﺯﺮﻣ ﮏﯾ -
doubleﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﻪﻧﺎﮔﻭﺩ ﺯﺮﻣ -
grooveﺩﺭﺍﺩ ﻪﯿﺷﺎﺣ ﮓﻧﺭ ﺭﺍﺪﻘﻣ ﻪﺑ ﯽﮕﺘﺴﺑ ﺮﺛﺍ .ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﯼﺪﻌﺑ ﻪﺳ ﺭﺍﺩﺭﺎﯿﺷ ﻪﯿﺷﺎﺣ -
ridgeﺩﺭﺍﺩ ﻪﯿﺷﺎﺣ ﮓﻧﺭ ﺭﺍﺪﻘﻣ ﻪﺑ ﯽﮕﺘﺴﺑ ﺮﺛﺍ .ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﯼﺪﻌﺑ ﻪﺳ ﺭﺍﺩ ﺝﺭ ﻪﯿﺷﺎﺣ ﮏﯾ -
insetﺩﺭﺍﺩ ﻪﯿﺷﺎﺣ ﮓﻧﺭ ﺭﺍﺪﻘﻣ ﻪﺑ ﯽﮕﺘﺴﺑ ﺮﺛﺍ .ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﯼﺪﻌﺑ ﻪﺳ ﯽﻠﺧﺍﺩ ﻪﯿﺷﺎﺣ ﮏﯾ -
outsetﺩﺭﺍﺩ ﻪﯿﺷﺎﺣ ﮓﻧﺭ ﺭﺍﺪﻘﻣ ﻪﺑ ﯽﮕﺘﺴﺑ ﺮﺛﺍ .ﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﯼﺪﻌﺑ ﻪﺳ ﯽﯾﺍﺪﺘﺑﺍ ﺯﺮﻣ ﮏﯾ -
noneﺪﻨﮐ ﯽﻤﻧ ﻒﯾﺮﻌﺗ ﺍﺭ ﯼﺯﺮﻣ ﭻﯿﻫ -
hiddenﺪﻨﮐ ﯽﻣ ﻒﯾﺮﻌﺗ ﺍﺭ ﻥﺎﻬﻨﭘ ﺯﺮﻣ ﮏﯾ -
ﯼﺍﺮﺑ) ﺭﺍﺪﻘﻣ ﺭﺎﻬﭼ ﺎﺗ ﮏﯾ ﺯﺍ ﺪﻧﺍﻮﺗ ﯽﻣ
:ﻪﯿﺷﺎﺣ ﻒﻠﺘﺨﻣ ﯼﺎﻫ ﮏﺒﺳ ﺶﯾﺎﻤﻧ
p.dotted {border-style: dotted;}
p.dashed
{border-style: dashed;}
p.solid {border-style: solid;}
p.double
{border-style: double;}
p.groove {border-style: groove;}
p.ridge
{border-style: ridge;}
p.inset {border-style: inset;}
p.outset
{border-style: outset;}
p.none {border-style: none;}
p.hidden {border-style: hidden;}
p.mix {border-style: dotted dashed solid double;}:ﻪﺠﯿﺘﻧ
A dotted border.
A dashed border.
A solid border.
A double border.
A groove border. The effect depends on the border-color value.
A ridge border. The effect depends on the border-color value.
An inset border. The effect depends on the border-color value.
An outset border. The effect depends on the border-color value.
No border.
A mixed border.
→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ
<!DOCTYPE html>
<html>
<head>
<style>
p.dotted {border-style: dotted;}
p.dashed {border-style: dashed;}
p.solid {border-style: solid;}
p.double {border-style: double;}
p.groove {border-style: groove;}
p.ridge {border-style: ridge;}
p.inset {border-style: inset;}
p.outset {border-style: outset;}
p.none {border-style: none;}
p.hidden {border-style: hidden;}
p.mix {border-style: dotted dashed solid double;}
</style>
</head>
<body>
<h2>The border-style Property</h2>
<p>This property specifies what kind of border to display:</p>
<p class="dotted">A dotted border.</p>
<p class="dashed">A dashed border.</p>
<p class="solid">A solid border.</p>
<p class="double">A double border.</p>
<p class="groove">A groove border.</p>
<p class="ridge">A ridge border.</p>
<p class="inset">An inset border.</p>
<p class="outset">An outset border.</p>
<p class="none">No border.</p>
<p class="hidden">A hidden border.</p>
<p class="mix">A mixed border.</p>
</body>
</html>
ﻪﺟﻮﺗ: ﻪﯿﺷﺎﺣ ﯼﺎﻫ ﯽﮔﮋﯾﻭ ﺮﯾﺎﺳ ﺯﺍ ﮏﯾ ﭻﯿﻫ CSS (ﺖﺧﻮﻣﺁ ﺪﯿﻫﺍﻮﺧ ﺎﻬﻧﺁ ﺩﺭﻮﻣ ﺭﺩ ﺮﺘﺸ