Selectors and Properties
Selectors are patterns that are used to select elements in the DOM. Some examples of Selectors include active,any-link, attribute, autofill, current, checked, focus, first-child and many more. While Properties are CSS properties that style elements through the values. Examples of Properties include accent-color, align-content, animation, background-repeat, background-attachment, border image, color, column-fill etc.
Selector 1
The active selector changes the look of a link while it is being activated or clicked on. With an acitve selector it provides feedback that the element was clicked and is used on anchor links such as (a href="#"). However the active selector can be applied to any element.
Selector 2
The focus selector is a psuedo class in CSS that is used when styling an element that is being targeted by the keyboard or being clicked by the mouse.
Properties 1
The animation property is used to animate several CSS properties for example: color, background-color, width and height. Animations are defined by using the @keyframes at-ruke which then includes an animation property. @keyframes explain what will happen at any given moment during the animation.
Properties 2
Background attachment is a property in CSS that explains how to move a background relative to the viewport. There are different values that are used to move the background which include: scroll, local and fixed. Scroll is the default value and scrolls with the main view but stays in the local view and fixed. Fixed stays put always and local scrolls with the main and local view.
Summary
Selectors and Properties are very important in CSS as CSS Selectors are the paterms that are used to select elements in the DOM and Properties are used to style elements through their values. Including Selectors and Properties makes the sites more user friendly and more accessible.