عدم نمایش تصاویر معرفی شده در سی‌اس‌اس

[sco1385]

دوستان!

من این کد‌ها را برای نمایش یک خط وسط‌چین و یک تصویر راست‌چین در css سایت قرار داده‌ام.



#line_center {
text-align:center;
margin-top: 20px;
margin-bottom: 20px;
margin-left:auto;
margin-right:auto;
content: url("http://taalaar.shandel.info/images/line01.png");

---------------

#audio_image {
padding:30px 5px 10px 0px;
text-align:right;
width:66px;
height:79px;
content: url("http://taalaar.shandel.info/images/podcast1.jpg");





و کدهای html زیر را در پست قرار دادم:



<div id="line_center"><img alt="line" /></div>

-----------------

<div id="audio_image"><img alt="audio" /></div>


در مرورگر کروم مشکلی نیست، و خط و تصویر نمایش داده می‌شود. اما در دیگر مرورگرها مثل فایرفاکس و اینترنت اکسپلورر تصاویر نشان داده نمی‌شود. چرا؟

سایت من وردپرس است.

یک بار هم به جای content از background هم استفاده کردم اما مشکل حل نشد.

به این صفحه نگاه کنید که دو خط و یک تصویر نشان داده نمی‌شود.

لینک به صفحه (http://taalaar.shandel.info/%D9%BE%D8%B1%D8%B3%D8%B4-%D9%88-%D9%BE%D8%A7%D8%B3%D8%AE-%D8%AF%D8%B1-%D8%A8%DB%8C%D9%84%D9%88%DA%A9%D8%B3-2/)

لطفاً راهنمایی کنید.

[SA_Developer]

نباید هم نمایش داده بشه چون Content فقط با after: و before: میاد شاید کروم این رو رعایت نکرده.
با background کار میکنه
background: url("http://taalaar.shandel.info/images/line01.png") no-repeat center center;

[sco1385]

با تشکر از شما

الان تصاویر دیده می‌شوند، اما، کلماتی که من برای عناصر آلترناتیو گذاشتم هم، به همراه تصاویر دیده می‌شود، در حالی که، این کلمات باید زمانی دیده شود که تصویر به دلیلی نشان داده نشود یا برای نابینایان است. مشکل کجاست؟ چون اگر آلترناتیو را مقدار ندهم سایت‌های بررسی کننده کد اشکال میگیرند.

127662
لطفاً راهنمایی کنید / ممنون

[SA_Developer]

Alt که تو همون راه قبلی شما هم کار نمیکنه. برای گذاشتن این ویژگی باید از از مشخصه src المنت img استفاده کنید. همونطور که تو sidebar استفاده کردید:

<img src="http://taalaar.shandel.info/images/line01.png?dd7103" alt="line">
در این روش اگر تصویر لود نشه alt نمایش داده میشه.

[sco1385]

با تشکر

لطفاً به این کد نگاه کنید:



<!-- posting_article_shariati -->
<div id="top_kanoun"><img alt="image" title="topImage" /></div>
<div id="titr">ایمان از دیدگاه شریعتی</div>
<div id="rosh_name">جمله‌های شریعتی</div>
<div id="pen_image"><img alt="image" title="penImage" /></div>
<div id="rosh_name">مذهب، هدف نیست، راه است</div>
<div id="rosh_name">مذهب، راهی است، از لجن، تا روحِ خدا</div>
<div id="jomalat_line1"><img alt="" /></div>
<!-- -------------------------------------- -->


<div id="post_body_box">
<!-- -------------------------------------- -->
<div id="mozou">موضوع : ایمان</div>
<div id="pen_image"><img alt="image" title="pen_Image" /></div>
<div id="faseleh20">.</div>


<!-- -------------------------------------- -->


<div id="number">01</div>
<div id="onvan">اوجِ ایمان</div>



و به این تصویر:

127666

وقتی content را به background تبدیل کردم این مشکلات حتی در کروم که قبلا مشکل نداشت پیش آمد.


عکس بزرگ بالا ارتفاعش را از دست داده است.

عکس قلم خراب شده است.

لاین نشان داده نمی‌شود.

-----

کد سی اس اس این است:



#top_kanoun {
margin-top: 20px;
margin-bottom: 40px;
margin-left:auto;
margin-right:auto;
width: 100%;
height: 33%;
background: url("http://taalaar.shandel.info/images/kanoun4.jpg") no-repeat center center;
}

--------------

#pen_image {
margin-top: 20px;
margin-bottom: 20px;
margin-left:auto;
margin-right:auto;
width: 40px;
height: 40px;
background: url("http://taalaar.shandel.info/images/pen.jpg") no-repeat center center;
}


--------------

#jomalat_line1 {
text-align:center;
margin-top: 30px;
margin-bottom: 70px;
margin-left:auto;
margin-right:auto;
background: url("http://taalaar.shandel.info/images/line01.png") no-repeat center center;
}





خواهش می‌کنم دوستان کمک کنند. سایت من کامل به هم ریخته است.

ممنون

[sco1385]

دوستان عزیز کسی نیست به من کمک کند؟

http://taalaar.shandel.info/?p=8507