Html isn’t about ‘results’ or presentation its about structure.
In the first example it is clear from the mark up that the word school was deleted and the word college inserted.
In the second example the only certain thing is that the word school was deleted but we do not know with what it has been replaced (although we can obviously guess but that’s not the point). It’s usually used when published text has later been changed to show that the text and therefore the meaning may have changed also.
When you add the correct semantics to a document it allows tools/screen readers/ authors to extract more pertinent data from them.
I suppose you could use that markup to allow a user to display a pre-edit version, if you applied css to hide the <ins> and show the <del>, that way you would not need to have the two separate versions.
Hello, could you explain pseudo elements, I checked on w3schools but i still dont understand .Why we should use them instead of common elements. Purpose?
Pseudo elements is just a way to define different styles for different link states.
Each link can have many states: regular, hovered, clicked (active), focused.
This is how you make your link green in regular state (when it’s just displayed):
a {
color: green;
}
But what if you do want that link to become red when user puts mouse cursor over it?
Here is where pseudo-element comes to help:
a:hover { /* this rule applies when <a> is hovered by mouse */
color: red;
}