Introduction to CSS. A general presentation of what CSS styles are, their interest, and their use.
Associate HTML and CSS. The different techniques for associating CSS styles with an HTML page.
CSS syntax. The basic syntax of CSS is ultimately very simple, as soon as we have acquired the meaning of words like property, selector, directive...
CSS selectors. The flexibility of CSS styles is largely due to the diversity of selectors which make it easy to target one or more elements in the document.
Inheritance in CSS. Description of the inheritance mechanism in CSS, so important that it is included in the name CSS = Cascading Styles Sheet.
Priority rules. The priority rules define which rule must be used when several contradict each other.
Layout techniques.
Box-model. The basic rules which define the positioning and dimensions of the elements on the page, in the case of classic positioning of the latter (static).
Responsive design. Responsive layout: some basic notions for designing layouts that adapt to the increasingly diverse dimensions of terminals, from the giant TV screen, to the connected watch.
Media-queries. A very powerful CSS tool to facilitate the creation of layouts that adapt to the possibilities of the device.
Container-queries. Container-Queries make it easier to format components, adapting styles to the dimensions of the container.
Containment. The containment technique makes it possible to optimize calculations when rendering complex pages.
Grids. Layouts with a grid, much more flexible than the old HTML tables.
Column layout. Widely used in printing, multi-column layouts are also easy to define in CSS.
Scrolling with snaps. Scroll Snaps to adjust scrolling based on element content.
Cascading layers. Cascade layers allow finer and more flexible management of priorities than the usual cascade mechanism.
Regions (named streams). Layouts by region, or by named flows are similar to the traditional layout: the content successively fills the reserves positioned on the page.
Writing methods depending on the languages.
Writing modes. Writing modes or how to adapt to the particularities of different languages (meaning and direction of writing).
Bidirectional writing. Techniques allowing texts written in different directions to be mixed in the same element. For example, include an Arabic word in a Latin language text.
Fonts.
Web fonts. Increasingly rich, fonts not only include glyphs from languages around the world, but offer more and more possibilities.
Color management.
Color gradients. The different types of gradients (linear, circular or radial) and examples of use.
Color spaces. CSS now offers the possibility of working in a color space more extensive than the classic sRGB.
The animations.
Animations in CSS. Techniques for animating dimensions, color, etc. elements of the page.
Scroll-driven animations. Scroll-driven animations allow you to change the characteristics of an element (dimensions, color, etc.) from a scroll bar.
View transitions. A technique for animating changes on the page.
The transformations.
Transformations. An extremely powerful CSS tool to move or distort the shape of an element (text or image).
Miscellaneous concepts.
Ruby annotations. Ruby annotations are small texts written above or next to the main text. They are mainly used in languages using sinograms, to provide precision, for example on pronunciation. Example: 北
Javascript and CSS. Some Javascript code examples for interacting with CSS styles.
SVG paths. The path tag in SVG or the path() function in CSS allow you to define a complex path comprising both rectilinear parts and curves.
.