What difference between elements?

MDN Learn
1

Hi! What difference between:
<img src="image.jpg">
and
<img src="image.jpg" />

Same situation with
and other elements without closing tags.
I google it and realized that the element with “/” matches XHTML standart. But is it still ok to use such elements without “/”?

Some examples from the course without “/”:
Introduction to HTML
Images in HTML

With “/”:
Vector graphic

image
image489×163 2.85 KB

And second question about CSS:
What difference between:
background: url(image.png)
and
background: url('image.png')

And same situation with examples.

Without “(’ ')”:
How CSS is structured

image
image403×158 3.17 KB

Styling lists
image
image361×186 3.25 KB

With “(’ ')”:
Styling links

image
image570×132 3.38 KB

background

2

Hello @VladimirK

The usage of the slash character in empty elements (also called void elements) is optional.

It’s similar with the url() CSS function. The quotes are optional as long as there aren’t any un-escaped special characters. To make your live easier I recommend to always use quotes to be safe.
From url() - CSS: Cascading Style Sheets | MDN :

A url, which is a relative or absolute address, or pointer, to the web resource to be included, or a data uri, optionally in single or double quotes. Quotes are required if the URL includes parentheses, whitespace, or quotes, unless these characters are escaped, or if the address includes control characters above 0x7e. Double quotes cannot occur inside double quotes and single quotes cannot occur inside single quotes unless escaped. The following are all valid and equivalent:

<css_property>: url("https://example.com/image.png")
<css_property>: url('https://example.com/image.png')
<css_property>: url(https://example.com/image.png)

If you choose to write the URL without quotes, use a backslash ( \ ) before any parentheses, whitespace characters, single quotes ( ' ) and double quotes ( " ) that are part of the URL.

It’s a bit unfortunate that we see both versions on MDN. But that happens when a lot of people over several years edit MDN.

I hope that clears it up.

Cheers!
Michael

2 Likes