CODEWITHSUNDEEP
csscss-selectors
Hammuel
Hammuel

Reputation: 3

CSS Calling and Declaring Classes

Okay, so I am slightly confused with declaring and calling a class in css. when I create a class it uses a "." but when I call it it doesn't, for example.

.smaller-image {
    width: 100px;
}

<a href="#"><img src="someimageurl.com" class="smaller-image" alt="some image 
text."></a>

Upvotes: 0

Views: 1477

Answers (4)

A. Meshu
A. Meshu

Reputation: 4148

The name HTML stands for Hyper Text Markup Language, and it describes the structure of web pages using markup elements that represented by tags. Each tag can hold attribute(s).

The class attribute specifies one or more class names for an HTML element.

CSS stands for Cascading Style Sheets and it describes how HTML elements are to be displayed on screen (or in other media).

In CSS, to select HTML elements with a specific class, we use period (.) character, followed by the name of the class.

Hope this clarify your mind, and enjoy coding!

Edit: in your example you use .com as source. You can't. Read here for images format and support: https://en.m.wikipedia.org/wiki/Comparison_of_web_browsers#Image_format_support

Upvotes: 1

user3764734
user3764734

Reputation: 40

CSS applies style to HTML elements using either their class, id or tag name (e.g. body).

When writing a CSS rule to apply to a class, you prefix the class name with ..

When writing a CSS rule to apply to an id, you prefix the id name with #. Note that an id should only be used by one element on a page, whereas a class can be used as often as you like.

Examples:

div {} /* This is applied to all div elements */

.button {} /* This is applied to all elements with the `button` class */

#header {} /* This is applied to the element with the `header` id */

a.link {} /* This combines both the `a` tag and the `link` class */

Upvotes: 1

lonesomeday
lonesomeday

Reputation: 238115

In HTML, the class names are clearly class names because they are contained in the class attribute. They don't need anything else to make it clear they are class names.

In CSS, a selector can be made up of many things. IDs, element types, attribute names, attribute values -- and others! So you need something to make it clear that what you are using is a class name. The . character means "what comes next is a class name".

Upvotes: 1

Johannes
Johannes

Reputation: 67799

The preceding dot defines it as a class in CSS, as opposed for example to a tag like div (no prefix at all) or a hash for an id (#something). In HTML all that is not needed, since the attributes are class , id or no attribute.

Upvotes: 1

Related Questions