CSS Report 4 - Div & Span; Class, ID & Child Selectors

The following section below first discusses how the div and span elements can be implemented and how they are related. After this, classes, id, and child selectors and their usages in CSS are discussed. This current webpage features examples of div, span, and class selectors. This webpage provides examples of ID and child selectors in addition to the other topics.

Div & Span

The <div> and <span> elements are similar in function but on different levels of editing level. <div> is by default a block object and can be used to wrap content within its box, a style page can make further use of this "wrapping" by either unifying the content a developer puts into those boxes, or by further differentiating them through classes, IDs, or children. <span> is defined as being similar because like <div>, a developer can wrap content within the element tag in the style sheet as needed. The main difference is that <span> operates at an inline level, while <div> is a block level element.

Class, ID, & Child Selectors

Class, ID, and child selectors are all different ways to differentiate different sections of a style sheet. A class is created by adding adding the 'class' attribute to an HTML element, and including this class in the style sheet with a period beforehand. Similarly, IDs are created by adding the 'id' attribute to an HTML element, and then adding that id into the style sheet with a hashtag beforehand. Child selectors use the > symbol in the style sheet and can be used to specify child elements within a parent element to be edited.

Sources linked below:

[1] [2] [3] [4] [5] [6]