CODEWITHSUNDEEP
htmlcssbrowseralt
MiddleKay
MiddleKay

Reputation: 319

Reasons why the text in alt attribute will appear

I tried opening an HTML page using text browsers. Yes, the value of the alt attribute of img tag appeared. Then I did not put the alt attribute but instead used CSS:

.headerImg:after, .headerImg::after
        { 
            content:" (the alternative)"; 
        }

I wanted the text to appear in the latest browsers. How? What are the reasons why the image would not show up besides the fact that they are placed in a different path?

Upvotes: 0

Views: 175

Answers (2)

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201538

Text browsers generally do not support CSS. They could implement some parts of CSS, especially regarding text styling, but most CSS things just don’t make much sense in text-only rendering, so they didn’t bother. (To see this, test with some very simple CSS code that is generally well-supported in graphic browsers and would be implementable in text browsers too, such as text-transform: uppercase.

The alt attribute is supposed to specify a textual alternative for an image in situations where the image is not displayed. Such situations often involve browsers that either ignore CSS (e.g., text browsers, aural browsers) or override much of the author’s CSS code (e.g., a graphic browser with very specific settings to help a visual with some specific type of visual impairment). So it does not make much sense to try to use CSS instead of alt.

Upvotes: 1

Kedume
Kedume

Reputation: 335

I don't know if ia understood the question very well. If you want to display de alt value after the image load, you should try this:

.headerImg:after { 
    content: attr(alt) 
}

If you wnat to change the alt value for an image you can use jquery:

$('#image1').attr({
  alt: 'Alternative description',
  title: 'Alternative description'
});

Upvotes: 0

Related Questions