13- Learn CSS Fundamentals / Specificity

Mar 20, 20200 likes187 views

Learn CSS fundamentals really fast, online and free. FULL COURSE: http://inarocket.com Learn front end development fast, step-by-step and with ready-to-use code. IN THIS MODULE YOU'LL LEARN: - How specificity works for different kind of selectors. - How to create selectors avoiding specificity issues and conflicts. READY-TO-USE CODE: https://inarocket.com/courses/css/css-fundamentals/specificity.php BEST BOOKS TO LEARN CSS: - CSS: The Definitive Guide: Visual Presentation for the Web by O'Reilly Media. https://amzn.to/2VOWHQT - HTML and CSS: Design and Build Websites by John Wiley & Sons. https://amzn.to/2Ir5y3i - CSS: The Missing Manual by O'Reilly Media. https://amzn.to/2ImdyTf - CSS Visual Dictionary by Independently published. https://amzn.to/2xgwHUh

IN A ROCKET
Learn front-end development at rocket speed
CSS CSS FUNDAMENTALS
Speciﬁcity

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
CASCADE SPECIFICITY
+

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
Web page title
index.html
HTML CSS
h1 { color: blue; }
p { color: red; }
input { color: pink; }
h1 { color: green; }
CASCADE
I'm a header

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
Web page title
index.html
HTML CSS
<html>
<head>
<link rel="stylesheet" href="styles.css">
<style>
h1 { color: blue; }
</style>
</head>
<body>
<h1 style="color: green">I'm a header</h1>
</body>
</html>
CASCADE
I'm a header
h1 { color: red; }

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
HTML CSS
Browser
SPECIFICITY
<body>
<header>
<h1>I'm a header</h1>
</header>
</body>
header h1 { color: green; }
h1 { color: blue; }
Web page title
index.html
I'm a header
The h1 selector position is better for cascade,

but header h1 prevails because is more speciﬁc.
READY TO USE CODE

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
ElementClass
Pseudo-class
Attribute
IDInline
(style attribute)
selector
0 000

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
•Soy el primer enlace de una lista.

•Soy el segundo enlace de una lista.

•Soy el tercer enlace de una lista.
My links list
index.html
ul li a

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
CAUTION
•Soy el primer enlace de una lista.

•Soy el segundo enlace de una lista.

•Soy el tercer enlace de una lista.
My links list
index.html
ul li a
.lk-list
#lk-list { }
<a style=""...

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
LET'S PLAY!

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
ElementClass
Pseudo-class
Attribute
IDInline
html body div div h2
0 000
ElementClass
Pseudo-class
Attribute
IDInline
.header-important
0 000

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
ElementClass
Pseudo-class
Attribute
IDInline
#info
0 000
ElementClass
Pseudo-class
Attribute
IDInline
.box .info p
0 000

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
ElementClass
Pseudo-class
Attribute
IDInline
#info
0 010
ElementClass
Pseudo-class
Attribute
IDInline
.box .info p
2 100

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
ElementClass
Pseudo-class
Attribute
IDInline
ul#nav li.active a
0 000
ElementClass
Pseudo-class
Attribute
IDInline
#lk-special
0 000

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
ElementClass
Pseudo-class
Attribute
IDInline
#box ul li a
0 000
ElementClass
Pseudo-class
Attribute
IDInline
li a .lk-important
0 000

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
ElementClass
Pseudo-class
Attribute
IDInline
#box ul li a
0 310
ElementClass
Pseudo-class
Attribute
IDInline
li a .lk-important
1 200

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
SPECIFICITY WARS

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
TOOLS: SPECIFICITY CALCULATOR

CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com
TOOLS: VISUAL STUDIO CODE
Just hover your pointer over a selector

Learn front-end development at rocket speed
inarocket.com
by miguelsanchez.com
YOU CAN CONTINUE THIS COURSE FOR FREE ON
+ READY TO USE CODE
+ QUIZZES
+ FREE UPDATES

We respect your time 
No more blah blah videos. Just straight to
the point slides with relevant information.
Ready to use code 
Real code you can just copy and paste into
your real projects.
Step by step guides 
Clear and concise steps to build real use
solutions. No missed points.
Learn front-end development at rocket speed
inarocket.com

Learn CSS fundamentals really fast, online and free. FULL COURSE: http://inarocket.com Learn front end development fast, step-by-step and with ready-to-use code. IN THIS MODULE YOU'LL LEARN: - Pseudo-elements as a way to refer to content that does not exist in the source document. - How to style the first letter or line of a text. - How to use CSS to generate content before/after an element’s content. READY-TO-USE CODE: https://inarocket.com/courses/css/css-fundamentals/pseudo-elements.php BEST BOOKS TO LEARN CSS: - CSS: The Definitive Guide: Visual Presentation for the Web by O'Reilly Media. https://amzn.to/2VOWHQT - HTML and CSS: Design and Build Websites by John Wiley & Sons. https://amzn.to/2Ir5y3i - CSS: The Missing Manual by O'Reilly Media. https://amzn.to/2ImdyTf - CSS Visual Dictionary by Independently published. https://amzn.to/2xgwHUh

14- Learn CSS Fundamentals / InheritanceIn a Rocket

Learn CSS fundamentals really fast, online and free. FULL COURSE: http://inarocket.com Learn front end development fast, step-by-step and with ready-to-use code. IN THIS MODULE YOU'LL LEARN: - How some properties on a selector are inherited by all the children of that selector. - List of properties that inherit. - How to override inherited values and prevent inheritance in CSS. - How to reset a property to its inherited or initial value. READY-TO-USE CODE: https://inarocket.com/courses/css/css-fundamentals/inheritance.php BEST BOOKS TO LEARN CSS: - CSS: The Definitive Guide: Visual Presentation for the Web by O'Reilly Media. https://amzn.to/2VOWHQT - HTML and CSS: Design and Build Websites by John Wiley & Sons. https://amzn.to/2Ir5y3i - CSS: The Missing Manual by O'Reilly Media. https://amzn.to/2ImdyTf - CSS Visual Dictionary by Independently published. https://amzn.to/2xgwHUh

9- Learn CSS Fundamentals / Pseudo-classesIn a Rocket

This document provides information about CSS pseudo-classes. It defines several types of pseudo-classes including dynamic, structural, and others. Dynamic pseudo-classes like :hover and :active select elements when a user interacts with them. Structural pseudo-classes select elements based on their position in a document tree, such as :first-child to select the first child element. The document provides examples of how to use different pseudo-class selectors in CSS code to style elements.

Joomla Technical SEOWebshop and websites by: Webcreatives

CSS FrameworksMike Crabb

CSS frameworks provide standardized code to aid in website development. This document discusses two types of frameworks - frontend frameworks that affect the user interface, and backend frameworks that affect website logic and operation. It focuses on Flexbox and Unsemantic, two popular CSS frontend frameworks. Flexbox uses flex containers and items to lay out page sections in rows or columns. Unsemantic provides predefined grid classes to lay out content without custom CSS. The document provides code examples of using these frameworks to create a three-column layout with colored sections of varying sizes.

Class 2: CSS Selectors, Classes & IdsErika Tarte

Artdm171 Week4 TagsGilbert Guerrero

This document provides an overview of HTML basics for an ARTDM 171 class. It discusses setting up local folders for HTML work, common HTML tags like <html>, <head>, <title>, <body>, and <p>, semantic tags, linking with <a> tags, adding images with <img>, lists with <ul> and <ol>, tables with <table>, <tr>, and <td> tags, and introducing CSS for styling. It provides examples of basic page structure and tags. Homework is to refine last week's work with additional CSS styling rules.

Modular HTML, CSS, & JS WorkshopShay Howe

You've been tasked with developing a new front end feature. HTML, CSS, and JavaScript are nothing new to you, in fact you even know a few tricks to get this feature out the door. It doesn't take you long and the code works like a charm, yet you have a looming suspicion that some of the code might not be up to par. You're likely right, and you're definitely better than that. We often write code without paying attention to the bigger picture, or overall code base. Upon stepping back we notice areas of duplicate code, ripe for refactoring. It's time to build more modular front ends, focusing on the reusability of HTML, CSS, and JavaScript, and to take maintainability to heart.

Styling with CSSMike Crabb

CSS is used to specify the presentation and layout of HTML elements, separating these aspects from the content and structure defined in HTML. CSS rules consist of selectors that choose the elements to style, properties that define what aspects to manipulate, and values that set property levels. Styles can be applied via internal, external, and inline CSS. CSS offers benefits like centralized styling, separation of concerns, and improved performance over only using HTML for styling. Common CSS selectors include element, class, ID and pseudo-class selectors. Values use units like pixels, percentages and colors to set property levels.

Flexible site structure with cake phpandygale

This document describes how a flexible site structure was implemented for the T3 magazine website using CakePHP. Key elements of the structure included: - Storing the site structure and content in the database using a Tree behavior to define parent-child relationships - Different types of "site objects" like pages, content boxes, lists, articles that could be organized and re-used - Associating site objects with template elements to determine how each piece of content should be displayed - Updating caching efficiently whenever content changed to ensure fast publishing of new articles The approach provided a flexible, database-driven structure that could handle different page layouts and allowed non-technical editors to easily manage content.

HTML Bootstrap Workshopvincentleeuwen

This document provides an overview of advanced HTML and CSS concepts including: - Styling HTML objects using CSS by adding classes and defining stylesheets - Creating a basic website with index, about, and contact pages and linking them - Using Bootstrap's grid system, buttons, icons, and navbar components to style pages - Overriding default Bootstrap styling and giving priority to more specific CSS rules - Adding JavaScript functionality like modals and activating scripts for better performance - Deploying the finished website to a hosting platform to make it publicly available

Layout with CSSMike Crabb

Web Design Bootcamp - Day1Aslam Najeebdeen

This document provides a summary of a one day web design bootcamp. The agenda includes an introduction to HTML5, CSS3, CSS frameworks, and SASS & Compass. In the HTML5 section, the document defines new HTML5 elements and features. It also discusses CSS units, selectors, properties, inheritance, specificity, and techniques for resolving conflicts. The CSS frameworks section demonstrates CSS resets and grids. The document concludes with an overview of SASS and Compass.

Intro to WordPress theme developmentThad Allender

Rapid and Responsive - UX to Prototype with BootstrapJosh Jeffryes

The document discusses how to rapidly prototype user interfaces using Bootstrap, a popular front-end framework. It outlines the benefits of prototyping with Bootstrap over traditional wireframing or jumping straight to development. Prototyping with Bootstrap allows building interactive prototypes quickly in hours using responsive design principles. The prototypes can then be used as the basis for the final site design rather than being discarded. The document introduces key concepts like responsive design, prototyping, and frameworks. It also provides an overview of features in Bootstrap like grids, components, and how they can be combined for prototyping.

WordPress theme frameworksEddie Johnston

Even faster web sites presentation 3Felipe Lavín

The document discusses techniques for optimizing frontend performance of websites. It recommends flushing content early, simplifying CSS selectors, avoiding @import rules, and other best practices like minimizing HTTP requests and assets. Performance testing results show the impact of different CSS selectors and optimizations in reducing page load times and reflows, improving user experience and potentially increasing revenue.

An Intro to HTML & CSSShay Howe

Please dont touch-3.6-jsdayFrancesco Fullone

The document discusses various ways that web performance can be improved, including reducing the number of server requests, minimizing file sizes through compression and minification, leveraging caching, optimizing browser rendering through techniques like deferred parsing of JavaScript, and using tools to automate optimizations. It emphasizes that most of the end user response time is spent in the frontend and recommends starting performance improvements there.

Introduction to HTML and CSSMario Hernandez

The document provides an agenda for a workshop on HTML, CSS, and putting them together. It covers HTML topics like semantic tags, comments, and best practices. It then discusses CSS topics such as IDs vs classes, floats, shorthand, and putting HTML and CSS together with project structure and layouts. The workshop aims to give an introduction to HTML, CSS, and how to structure websites using these languages.

Modular HTML & CSS Turbo WorkshopShay Howe

All too often writing HTML and CSS is an afterthought. Its the work that happens after design is finalized and the product has been developed. Its a necessary task in the process to building a website. Wrong. HTML and CSS are the backbone to every website, and are equally as important as any design or development. At the end of the workshop and after spending time writing some of code attendees will be able to better organize their code, develop modular styles, and work with CSS specificity.

Intro to CSSRandy Oest II

This document provides an introduction to CSS (Cascading Style Sheets) and covers key concepts such as selectors, the box model, positioning, and responsive design. It explains that CSS is used to style and lay out elements on web pages and works together with HTML. The document outlines important CSS topics like selectors, properties and values, units of measurement, the box model, display types, flow, floats, and positioning. It emphasizes best practices like using relative units and media queries for responsive designs.

Modular HTML & CSS WorkshopShay Howe

This document discusses moving toward more modular and reusable HTML and CSS structures. It outlines problems with current practices like code becoming brittle and files swelling in size. It recommends abstracting structure from presentation using techniques like transparentizing elements, avoiding parent dependency, and favoring semantics. The document provides examples of bad and good practices and emphasizes keeping specificity low and code maintainable. The goal is building flexible and extensible components rather than pages to improve standards and reusability.

Web 102 INtro to CSSHawkman Academy

Even faster web sitesFelipe Lavín

This document discusses techniques for optimizing frontend performance of web pages. It recommends flushing the document early to allow resources to load in parallel, simplifying CSS selectors to reduce the cost of style matching, and avoiding @import rules which can block parallel downloads in some browsers. Specific examples and techniques are provided for each recommendation along with data on their impact on user experience and website revenue.

Prototyping w/HTML5 and CSS3Todd Zaki Warfel

This document discusses progressive prototyping as a design process. It emphasizes that prototyping allows designers to fail in a low-cost environment and iterate on their designs through testing. Different levels of prototyping fidelity are presented, from simple sketches to higher-fidelity visual prototypes. The document recommends starting with simple sketches and adding more details in subsequent rounds of graybox prototyping. It also provides examples of HTML5 and CSS3 techniques that can be used to create interactive prototypes, including new HTML5 input types, CSS3 selectors, and properties for styling buttons. Overall, the document promotes prototyping as a better way to validate designs through an iterative process of testing and refining ideas.

Introduction to HTML and CSSdanpaquette

The document is an introduction to HTML and CSS that provides a tutorial on the basic syntax and structure of each language. It begins by explaining how to create simple HTML files and add basic HTML tags like headings, paragraphs, and lists. It then introduces linking an external CSS stylesheet and using CSS selectors to style HTML elements by changing properties like colors, backgrounds, padding and more. The document provides examples of additional CSS concepts like classes, inheritance, the box model, specificity and more. It concludes by recommending additional resources for references, validators, code editors and tutorials.

ARTDM 171, Week 5: CSSGilbert Guerrero

This document provides an overview of CSS tags and concepts covered in an ARTDM 171 class. It discusses common CSS tags like <a>, <img>, <ul>, <ol>, and <table> and how to structure them. It also covers CSS concepts like selectors, pseudo-classes, embedded/linked/inline stylesheets, relative vs absolute font sizing, and CSS properties like color, font-family and font-size. The document concludes by reminding students that group projects are due next week and homework is due on September 22nd to cover formatting images for the web.

css v1 guruGuruPada Das

CSS (Cascading Style Sheets) contains rules for presenting HTML content. It separates presentation from HTML markup. CSS allows for multiple browsers to display web pages similarly and simplifies web page design modifications. CSS rules have weights that determine which take precedence when multiple rules apply. CSS selectors target elements using tags, classes, IDs and other attributes to style them. Common CSS properties control color, font, size, spacing and positioning.

12- Learn CSS Fundamentals / Mix & groupIn a Rocket

Learn CSS fundamentals really fast, online and free. FULL COURSE: http://inarocket.com Learn front end development fast, step-by-step and with ready-to-use code. IN THIS MODULE YOU'LL LEARN: - How to mix selectors (eg. Combine classes and IDs). - How to group selectors as a best practice to get a much optimized CSS. READY-TO-USE CODE: http://localhost/courses/css/css-fundamentals/mix-group.php BEST BOOKS TO LEARN CSS: - CSS: The Definitive Guide: Visual Presentation for the Web by O'Reilly Media. https://amzn.to/2VOWHQT - HTML and CSS: Design and Build Websites by John Wiley & Sons. https://amzn.to/2Ir5y3i - CSS: The Missing Manual by O'Reilly Media. https://amzn.to/2ImdyTf - CSS Visual Dictionary by Independently published. https://amzn.to/2xgwHUh

More Related Content

What's hot (20)

Styling with CSSMike Crabb

Flexible site structure with cake phpandygale

HTML Bootstrap Workshopvincentleeuwen

Layout with CSSMike Crabb

Web Design Bootcamp - Day1Aslam Najeebdeen

Intro to WordPress theme developmentThad Allender

Rapid and Responsive - UX to Prototype with BootstrapJosh Jeffryes

WordPress theme frameworksEddie Johnston

Even faster web sites presentation 3Felipe Lavín

An Intro to HTML & CSSShay Howe

Please dont touch-3.6-jsdayFrancesco Fullone

Introduction to HTML and CSSMario Hernandez

Modular HTML & CSS Turbo WorkshopShay Howe

Intro to CSSRandy Oest II

Modular HTML & CSS WorkshopShay Howe

Web 102 INtro to CSSHawkman Academy

Even faster web sitesFelipe Lavín

Prototyping w/HTML5 and CSS3Todd Zaki Warfel

Introduction to HTML and CSSdanpaquette

ARTDM 171, Week 5: CSSGilbert Guerrero

Styling with CSSMike Crabb

Flexible site structure with cake phpandygale

HTML Bootstrap Workshopvincentleeuwen

Layout with CSSMike Crabb

Web Design Bootcamp - Day1Aslam Najeebdeen

Intro to WordPress theme developmentThad Allender

Rapid and Responsive - UX to Prototype with BootstrapJosh Jeffryes

WordPress theme frameworksEddie Johnston

Even faster web sites presentation 3Felipe Lavín

An Intro to HTML & CSSShay Howe

Please dont touch-3.6-jsdayFrancesco Fullone

Introduction to HTML and CSSMario Hernandez

Modular HTML & CSS Turbo WorkshopShay Howe

Intro to CSSRandy Oest II

Modular HTML & CSS WorkshopShay Howe

Web 102 INtro to CSSHawkman Academy

Even faster web sitesFelipe Lavín

Prototyping w/HTML5 and CSS3Todd Zaki Warfel

Introduction to HTML and CSSdanpaquette

ARTDM 171, Week 5: CSSGilbert Guerrero

Similar to 13- Learn CSS Fundamentals / Specificity (20)

css v1 guruGuruPada Das

12- Learn CSS Fundamentals / Mix & groupIn a Rocket

Learn CSS fundamentals really fast, online and free. FULL COURSE: http://inarocket.com Learn front end development fast, step-by-step and with ready-to-use code. IN THIS MODULE YOU'LL LEARN: - How to mix selectors (eg. Combine classes and IDs). - How to group selectors as a best practice to get a much optimized CSS. READY-TO-USE CODE: http://localhost/courses/css/css-fundamentals/mix-group.php BEST BOOKS TO LEARN CSS: - CSS: The Definitive Guide: Visual Presentation for the Web by O'Reilly Media. https://amzn.to/2VOWHQT - HTML and CSS: Design and Build Websites by John Wiley & Sons. https://amzn.to/2Ir5y3i - CSS: The Missing Manual by O'Reilly Media. https://amzn.to/2ImdyTf - CSS Visual Dictionary by Independently published. https://amzn.to/2xgwHUh

Cssmyrajendra

1. The document provides an overview of CSS (Cascading Style Sheets) and how it can be used to style web pages by applying styles to HTML elements. 2. Styles can be applied inline, via embedded style blocks, or through external style sheets. External style sheets allow controlling styles across entire websites. 3. CSS properties like font, color, size, and other attributes can be set for elements using selectors like element names, classes, IDs to format text. Additional properties control layout aspects like margins, padding, borders.

Css 101Rhyan Mahazudin

How Cascading Style Sheets (CSS) WorksAmit Tyagi

CSS (Cascading Style Sheets) allows separation of document content from page layout/presentation. CSS was introduced to make web page design and modification easier. CSS properties control elements like text formatting, page layout, and color/images. CSS rules cascade from broad to specific with author styles overriding browser defaults. Common selectors target elements by ID, class, tag name or relationship.

Cascading style-sheet-Nimrakhan89

Girl Develop It Cincinnati: Intro to HTML/CSS Class 2Erin M. Kidwell

FFW Gabrovo PMG - CSSToni Kolev

CSS is used to style and lay out web pages. It separates the presentation of HTML elements from the content. CSS rules consist of selectors that point to HTML elements and declarations that apply styles like colors, fonts, sizes etc. CSS rules cascade from broad to specific. More specific selectors override broader ones. CSS can be applied via external stylesheets, internal stylesheets or inline styles. Pseudo-classes can style elements in special states like hover. Media queries allow responsive designs for different screen sizes.

An Introduction to Cascading Style Sheets (CSS3)Ardee Aram

Cascading Style Sheets (CSS) allow separation of document structure (HTML) from presentation (CSS). CSS controls how HTML elements are displayed on screen, paper, or other media. CSS works by applying styles, such as font, color, and size, to HTML elements. The cascade determines which styles are applied based on specificity and source order. CSS properties modify text, color, background, borders, boxes, positioning, and other attributes of HTML elements.

Lab#1 - Front End DevelopmentWalid Ashraf

Tim Berners-Lee imagined the World Wide Web as a space for interconnecting documents through hyperlinks. He created HTML to provide the structure and formatting for documents, CSS for presentation, and JavaScript for interactivity. These three languages work together to display content on the web. HTML uses tags to mark up content like paragraphs, headings, and images. CSS controls how content is styled and presented using selectors, rules and property-value pairs. It can be linked via external stylesheets, embedded in HTML, or used inline. JavaScript adds interactive behaviors to webpages.

Make Css easy(part:2) : easy tips for css(part:2)shabab shihan

Basic cssGopinath Ambothi

11- Learn CSS Fundamentals / CombinatorsIn a Rocket

Learn CSS fundamentals really fast, online and free. FULL COURSE: http://inarocket.com Learn front end development fast, step-by-step and with ready-to-use code. IN THIS MODULE YOU'LL LEARN: - Different combinator selectors that can be used in CSS. - How to use descendant, child and siblings combinators. READY-TO-USE CODE: https://inarocket.com/courses/css/css-fundamentals/combinators.php BEST BOOKS TO LEARN CSS: - CSS: The Definitive Guide: Visual Presentation for the Web by O'Reilly Media. https://amzn.to/2VOWHQT - HTML and CSS: Design and Build Websites by John Wiley & Sons. https://amzn.to/2Ir5y3i - CSS: The Missing Manual by O'Reilly Media. https://amzn.to/2ImdyTf - CSS Visual Dictionary by Independently published. https://amzn.to/2xgwHUh

CSSMd. Sirajus Salayhin

This document provides an overview of Cascading Style Sheets (CSS) including what CSS is, how it works, the different sources of styles, CSS selectors, properties, positioning, and inheritance. CSS allows separation of document content from page layout and styles, making web page design and maintenance easier. Styles defined in CSS rules cascade from broad to specific and can come from author styles, user stylesheets, or browser defaults.

Cascading style sheetMichael Jhon

CSS is used to style and lay out web pages. There are three types of CSS: external, internal, and inline stylesheets. External stylesheets define styles in CSS files and can be used across many web pages, internal stylesheets are defined within the <style> tags in an HTML page, and inline styles are defined within HTML elements using the style attribute. CSS selectors allow targeting specific elements using IDs, classes, types, and other attributes to style them. Common CSS properties include colors, backgrounds, borders, padding, margins, and styling of links and lists.

css-presentation.pptprathur68

Cascading Style Sheets (CSS) allow for more control over the look and style of web pages by providing a central location to define how HTML and XML tags are interpreted. CSS rules consist of selectors that specify elements to style and declarations that define properties and values to apply. CSS styles can be defined internally, inline, or externally in style sheets and rules are applied following the cascade order.

Css week11 2020 2021 for g10 by eng.osama ghandourOsama Ghandour Geris

The document outlines an agenda and lesson plan for teaching CSS. The agenda includes warm up revision, a teacher presentation on CSS, a video on CSS selectors, practical work in pairs to create a web page using CSS, a question and answer session, reflection, and assigning homework. The lesson plan covers CSS terminology, adding style using cascading style sheets, internal and external styles, CSS syntax, selectors like type, class, and ID, properties for boxes, fonts and text, and linking stylesheets. Resources for further practice are provided. The homework assignment asks students to create a web page using HTML and CSS based on a rubric.

Introduction to Cascading Style SheetsTushar Joshi

Unit 2-CSS & Bootstrap.pptTusharTikia

The document provides an introduction to CSS including an overview of what CSS is, why it is used, and its basic syntax and structure. CSS (Cascading Style Sheets) is a stylesheet language used to describe the presentation of structured documents written in HTML or XML. It allows separation of document content from document presentation and formatting. CSS saves development time, makes pages load faster, and allows easier page maintenance.

CSSVladimir Zhidal

css v1 guruGuruPada Das

12- Learn CSS Fundamentals / Mix & groupIn a Rocket

Cssmyrajendra

Css 101Rhyan Mahazudin

How Cascading Style Sheets (CSS) WorksAmit Tyagi

Cascading style-sheet-Nimrakhan89

Girl Develop It Cincinnati: Intro to HTML/CSS Class 2Erin M. Kidwell

FFW Gabrovo PMG - CSSToni Kolev

An Introduction to Cascading Style Sheets (CSS3)Ardee Aram

Lab#1 - Front End DevelopmentWalid Ashraf

Make Css easy(part:2) : easy tips for css(part:2)shabab shihan

Basic cssGopinath Ambothi

11- Learn CSS Fundamentals / CombinatorsIn a Rocket

CSSMd. Sirajus Salayhin

Cascading style sheetMichael Jhon

css-presentation.pptprathur68

Css week11 2020 2021 for g10 by eng.osama ghandourOsama Ghandour Geris

Introduction to Cascading Style SheetsTushar Joshi

Unit 2-CSS & Bootstrap.pptTusharTikia

CSSVladimir Zhidal

More from In a Rocket (11)

3- Learn Flexbox & CSS Grid / Container & itemsIn a Rocket

Learn CSS fundamentals really fast, online and free. FULL COURSE: http://inarocket.com Learn front end development fast, step-by-step and with ready-to-use code. IN THIS MODULE YOU'LL LEARN: - Any HTML element can be a flex container. Child elements of that container are considered flex items. - A flex container can be displayed as a block (display: flex) or inline (display: inline-flex). - By default, flex items width and height are defined by their content. READY-TO-USE CODE: http://inarocket.com/courses/css/css-flexbox-cssgrid/flexbox-container-items.php BEST BOOKS TO LEARN FLEXBOX & CSS GRID: - The New CSS Layout by A Book Apart. https://amzn.to/2ThK0f7 - Flexbox in CSS by O'Reilly Media. https://amzn.to/2Zfekeg - Grid Layout in CSS: Interface Layout for the Web by O'Reilly Media. https://amzn.to/36fmIMf - CSS Grid Layout: 5 Practical Projects by SitePoint. https://amzn.to/3bFWYd3

2- Learn Flexbox & CSS Grid / ContextIn a Rocket

Learn CSS fundamentals really fast, online and free. FULL COURSE: http://inarocket.com Learn front end development fast, step-by-step and with ready-to-use code. IN THIS MODULE YOU'LL LEARN: - We no longer talk about CSS 3 or 4. CSS has now more than 80 specifications that evolve independently. - Where to find all CSS specifications. - How to check maturity of specifications by status code. - Where to follow CSS current work. - Where to find Flexbox and CSS Grid specifications. - How to check Flexbox and CSS Grid browser support. READY-TO-USE CODE: http://inarocket.com/courses/css/css-flexbox-cssgrid/context.php BEST BOOKS TO LEARN FLEXBOX & CSS GRID: - The New CSS Layout by A Book Apart. https://amzn.to/2ThK0f7 - Flexbox in CSS by O'Reilly Media. https://amzn.to/2Zfekeg - Grid Layout in CSS: Interface Layout for the Web by O'Reilly Media. https://amzn.to/36fmIMf - CSS Grid Layout: 5 Practical Projects by SitePoint. https://amzn.to/3bFWYd3

1- Learn Flexbox & CSS Grid / Environment setupIn a Rocket

The document discusses setting up a development environment for learning CSS Flexbox and Grid layouts. It recommends using Visual Studio Code as the text editor and Google Chrome as the browser, which both have tools for inspecting Flexbox and Grid layouts. It provides instructions for installing all required software on Windows using Chocolatey or on MacOS using Homebrew, including downloading Chrome, Firefox, and VS Code.

17- Learn CSS Fundamentals / UnitsIn a Rocket

This document discusses different units used in CSS including absolute and relative units. Absolute units like pixels and points set fixed sizes, while relative units scale with parent elements. Examples show how percentages, ems, rems, viewport units like vw and vh, and font-based units like vmin and vmax scale elements relative to different contexts. The document recommends choosing relative units when elements need to scale with viewport changes. It also promotes understanding units to build flexible and responsive designs.

16- Learn CSS Fundamentals / BackgroundIn a Rocket

Learn CSS fundamentals really fast, online and free. FULL COURSE: http://inarocket.com Learn front end development fast, step-by-step and with ready-to-use code. IN THIS MODULE YOU'LL LEARN: - How to set a background using CSS. - How to apply different background options: background-color, background-position, background-image, background-repeat and background-attachment. - How to create linear and radial gradients. - Tools: examine background and accessibility information, CSS gradients gallery, etc. READY-TO-USE CODE: https://inarocket.com/courses/css/css-fundamentals/background.php REFERENCES: - The background CSS property by MDN. https://developer.mozilla.org/en-US/docs/Web/CSS/background - Chrome Developer Tools: Contrast ratio in the Color Picker. https://developers.google.com/web/updates/2018/01/devtools#contrast - Enhanced recommended contrast ratio (AAA) by W3C. https://www.w3.org/TR/WCAG21/#contrast-enhanced - Minimum recommended contrast ratio (AA) by W3C. https://www.w3.org/TR/WCAG21/#contrast-minimum - Gradient Magic: 28 collections and over 1558 unique CSS gradients. https://www.gradientmagic.com/ - WebGradients: free collection of 180 linear gradients. https://webgradients.com/ BEST BOOKS TO LEARN CSS: - CSS: The Definitive Guide: Visual Presentation for the Web by O'Reilly Media. https://amzn.to/2VOWHQT - HTML and CSS: Design and Build Websites by John Wiley & Sons. https://amzn.to/2Ir5y3i - CSS: The Missing Manual by O'Reilly Media. https://amzn.to/2ImdyTf - CSS Visual Dictionary by Independently published. https://amzn.to/2xgwHUh

15- Learn CSS Fundamentals / ColorIn a Rocket

Learn CSS fundamentals really fast, online and free. FULL COURSE: http://inarocket.com Learn front end development fast, step-by-step and with ready-to-use code. IN THIS MODULE YOU'LL LEARN: - How to use the color property to set the foreground color of an element's text content, and its decorations. - Methods to apply colors in CSS: named colors, HEX, RGB/RGBA and HSL/HSLA. - Color tools: CSS Peeper, color converter, material design palette, etc. READY-TO-USE CODE: https://inarocket.com/courses/css/css-fundamentals/color.php REFERENCES: - The color CSS property by MDN. https://developer.mozilla.org/en-US/docs/Web/CSS/color - Game: What the Hex? http://yizzle.com/whatthehex/ - CSS Peeper: Inspect styles in a simple and well-organized way. https://csspeeper.com/ - RapidTables Color Conversion. https://www.rapidtables.com/convert/color/index.html - Impalette: Scan images for dominant pantone colors. https://www.impalette.com/ - Material Design Palette. https://www.materialpalette.com/ - Brands in colours: Brands colour reference. https://loriskumo.github.io/Brands-In-Colours/ - BrandColors: Collection of official brand color codes. https://brandcolors.net/ BEST BOOKS TO LEARN CSS: - CSS: The Definitive Guide: Visual Presentation for the Web by O'Reilly Media. https://amzn.to/2VOWHQT - HTML and CSS: Design and Build Websites by John Wiley & Sons. https://amzn.to/2Ir5y3i - CSS: The Missing Manual by O'Reilly Media. https://amzn.to/2ImdyTf - CSS Visual Dictionary by Independently published. https://amzn.to/2xgwHUh

8- Learn CSS Fundamentals / Attribute selectorsIn a Rocket

Learn CSS fundamentals really fast, online and free. FULL COURSE: http://inarocket.com Learn front end development fast, step-by-step and with ready-to-use code. IN THIS MODULE YOU'LL LEARN: - How to use attribute presence and value selectors. - How to apply substring matching attribute selectors. READY-TO-USE CODE: http://inarocket.com/courses/css/css-fundamentals/selectors-attribute.php BEST BOOKS TO LEARN CSS: - CSS: The Definitive Guide: Visual Presentation for the Web by O'Reilly Media. https://amzn.to/2VOWHQT - HTML and CSS: Design and Build Websites by John Wiley & Sons. https://amzn.to/2Ir5y3i - CSS: The Missing Manual by O'Reilly Media. https://amzn.to/2ImdyTf - CSS Visual Dictionary by Independently published. https://amzn.to/2xgwHUh

2- Learn HTML Fundamentals / Text FormattingIn a Rocket

Learn HTML5 fundamentals really fast, online and free. FULL COURSE: http://inarocket.com Learn front end development fast, step-by-step and with ready-to-use code. IN THIS MODULE YOU'LL LEARN: - How to structure your content with headers. - How to organize your ideas with paragraphs. - How to force spaces and preformat text. - How to format quotes with blockquote. - How to tag relevant content with mark. - How to create ordered, unordered and description lists. - How to show/hide additional content with details. - How to document your code with comments. - How to display reserved and invisible characters with HTML entities.

1- Learn HTML Fundamentals / Start in 5 MinutesIn a Rocket

Learn SUIT: CSS Naming ConventionIn a Rocket

Learn BEM: CSS Naming ConventionIn a Rocket

3- Learn Flexbox & CSS Grid / Container & itemsIn a Rocket

2- Learn Flexbox & CSS Grid / ContextIn a Rocket

1- Learn Flexbox & CSS Grid / Environment setupIn a Rocket

17- Learn CSS Fundamentals / UnitsIn a Rocket

16- Learn CSS Fundamentals / BackgroundIn a Rocket

15- Learn CSS Fundamentals / ColorIn a Rocket

8- Learn CSS Fundamentals / Attribute selectorsIn a Rocket

2- Learn HTML Fundamentals / Text FormattingIn a Rocket

1- Learn HTML Fundamentals / Start in 5 MinutesIn a Rocket

Learn SUIT: CSS Naming ConventionIn a Rocket

Learn BEM: CSS Naming ConventionIn a Rocket

Recently uploaded (17)

Networking_Essentials_version_3.0_-_Module_7.pptxelestirmen

How to Make Money as a Cam Model – Tips, Tools & Real TalkCam Sites Expert

Want to turn your charm, confidence, and camera into a real source of income? This presentation reveals everything you need to know about making money as a cam model — whether you're just starting out or looking to boost your earnings. From choosing the right platform, building your fanbase, and setting up your cam space, to marketing yourself and creating passive income with clips, this guide covers it all. I’ll also share real-world insights from my experience on CamsRating.com. No BS — just proven tips, smart tools, and sexy strategies to get paid doing what you love.

OSI_Security_Architecture Computer Science.pptxfaizanaseem873

AI REPLACING HUMANS /FATHER OF AI/BIRTH OF AIskdav34

5 Reasons cheap WordPress hosting is costing you more | Reversed OutReversed Out Creative

basic to advance network security conceptsamansinght675

ARTIFICIAL INTELLIGENCE.pptx2565567765676areebaimtiazpmas

Frontier Unlimited Internet Setup Step-by-Step Guide.pdfInternet Bundle Now

all Practical Project LAST summary note.docxseidjemal94

原版西班牙马拉加大学毕业证(UMA毕业证书)如何办理Taqyea

文凭(UMA毕业证书)马拉加大学毕业证成绩单制作案例【q微1954292140】马拉加大学offer/学位证、留信官方学历认证（永久存档真实可查）采用学校原版纸张、特殊工艺完全按照原版一比一制作【q微1954292140】Buy Universidad de Málaga Diploma购买美国毕业证，购买英国毕业证，购买澳洲毕业证，购买加拿大毕业证，以及德国毕业证，购买法国毕业证（q微1954292140）购买荷兰毕业证、购买瑞士毕业证、购买日本毕业证、购买韩国毕业证、购买新西兰毕业证、购买新加坡毕业证、购买西班牙毕业证、购买马来西亚毕业证等。包括了本科毕业证，硕士毕业证。【办理马拉加大学成绩单Buy Universidad de Málaga Transcripts】购买日韩成绩单、英国大学成绩单、美国大学成绩单、澳洲大学成绩单、加拿大大学成绩单（q微1954292140）新加坡大学成绩单、新西兰大学成绩单、爱尔兰成绩单、西班牙成绩单、德国成绩单。成绩单的意义主要体现在证明学习能力、评估学术背景、展示综合素质、提高录取率，以及是作为留信认证申请材料的一部分。马拉加大学成绩单能够体现您的的学习能力，包括马拉加大学课程成绩、专业能力、研究能力。（q微1954292140）具体来说，成绩报告单通常包含学生的学习技能与习惯、各科成绩以及老师评语等部分，因此，成绩单不仅是学生学术能力的证明，也是评估学生是否适合某个教育项目的重要依据！ Buy Universidad de Málaga Diploma《正式成绩单论文没过》有文凭却得不到认证。又该怎么办？？？西班牙毕业证购买，西班牙文凭购买，【q微1954292140】西班牙文凭购买，西班牙文凭定制，西班牙文凭补办。专业在线定制西班牙大学文凭，定做西班牙本科文凭，【q微1954292140】复制西班牙Universidad de Málaga completion letter。在线快速补办西班牙本科毕业证、硕士文凭证书，购买西班牙学位证、马拉加大学Offer，西班牙大学文凭在线购买。特殊原因导致无法毕业，也可以联系我们帮您办理相关材料：１：在马拉加大学挂科了，不想读了，成绩不理想怎么办？ 2：打算回国了，找工作的时候，需要提供认证《UMA成绩单购买办理马拉加大学毕业证书范本》购买日韩毕业证、英国大学毕业证、美国大学毕业证、澳洲大学毕业证、加拿大大学毕业证（q微1954292140）新加坡大学毕业证、新西兰大学毕业证、爱尔兰毕业证、西班牙毕业证、德国毕业证，回国证明，留信网认证，留信认证办理，学历认证。从而完成就业。马拉加大学毕业证办理，马拉加大学文凭办理，马拉加大学成绩单办理和真实留信认证、留服认证、马拉加大学学历认证。学院文凭定制，马拉加大学原版文凭补办，成绩单详解细节，扫描件文凭定做，100%文凭复刻。主营项目： 1、真实教育部国外学历学位认证《西班牙毕业文凭证书快速办理马拉加大学学位证和毕业证的区别》【q微1954292140】《论文没过马拉加大学正式成绩单》，教育部存档，教育部留服网站100%可查. 2、办理UMA毕业证，改成绩单《UMA毕业证明办理马拉加大学学历认证失败怎么办》【Q/WeChat：1954292140】Buy Universidad de Málaga Certificates《正式成绩单论文没过》，马拉加大学Offer、在读证明、学生卡、信封、证明信等全套材料，从防伪到印刷，从水印到钢印烫金，高精仿度跟学校原版100%相同. 3、真实使馆认证（即留学人员回国证明），使馆存档可通过大使馆查询确认. 4、留信网认证，国家专业人才认证中心颁发入库证书，留信网存档可查. 西班牙马拉加大学毕业证(UMA毕业证书）UMA文凭【q微1954292140】高仿真还原西班牙文凭证书和外壳，定制西班牙马拉加大学成绩单和信封。学历认证失败怎么办UMA毕业证【q微1954292140】毕业证工艺详解马拉加大学offer/学位证文凭一模一样、留信官方学历认证（永久存档真实可查）采用学校原版纸张、特殊工艺完全按照原版一比一制作。帮你解决马拉加大学学历学位认证难题。帮您解决在西班牙马拉加大学未毕业难题（Universidad de Málaga）文凭购买、毕业证购买、大学文凭购买、大学毕业证购买、买文凭、日韩文凭、英国大学文凭、美国大学文凭、澳洲大学文凭、加拿大大学文凭（q微1954292140）新加坡大学文凭、新西兰大学文凭、爱尔兰文凭、西班牙文凭、德国文凭、教育部认证，买毕业证，毕业证购买，买大学文凭，【q微1954292140】学位证1:1完美还原海外各大学毕业材料上的工艺：水印，阴影底纹，钢印LOGO烫金烫银，LOGO烫金烫银复合重叠。文字图案浮雕、激光镭射、紫外荧光、温感、复印防伪等防伪工艺。《马拉加大学2025年新版毕业证书西班牙毕业证书办理UMA录取通知书》

Presentation About The Buttons | Selma SALTIKSELMA SALTIK

HPC_Course_Presentation_No_Images included.pptxnaziaahmadnm

Transport Conjjjjjjjjjjjjjjjjjjjjjjjsulting by Slidesgo.pptxssuser80a7e81

Cloud VPS Provider in India: The Best Hosting Solution for Your BusinessDanaJohnson510230

Essential Tech Stack for Effective Shopify Dropshipping Integration.pdfCartCoders

10 Latest Technologies and Their Benefits to End.pptxEphraimOOghodero

Networking concepts from zero to hero that covers the security aspectsamansinght675

Networking_Essentials_version_3.0_-_Module_7.pptxelestirmen

How to Make Money as a Cam Model – Tips, Tools & Real TalkCam Sites Expert

OSI_Security_Architecture Computer Science.pptxfaizanaseem873

AI REPLACING HUMANS /FATHER OF AI/BIRTH OF AIskdav34

5 Reasons cheap WordPress hosting is costing you more | Reversed OutReversed Out Creative

basic to advance network security conceptsamansinght675

ARTIFICIAL INTELLIGENCE.pptx2565567765676areebaimtiazpmas

Frontier Unlimited Internet Setup Step-by-Step Guide.pdfInternet Bundle Now

all Practical Project LAST summary note.docxseidjemal94

原版西班牙马拉加大学毕业证(UMA毕业证书)如何办理Taqyea

Presentation About The Buttons | Selma SALTIKSELMA SALTIK

HPC_Course_Presentation_No_Images included.pptxnaziaahmadnm

Transport Conjjjjjjjjjjjjjjjjjjjjjjjsulting by Slidesgo.pptxssuser80a7e81

Cloud VPS Provider in India: The Best Hosting Solution for Your BusinessDanaJohnson510230

Essential Tech Stack for Effective Shopify Dropshipping Integration.pdfCartCoders

10 Latest Technologies and Their Benefits to End.pptxEphraimOOghodero

Networking concepts from zero to hero that covers the security aspectsamansinght675

13- Learn CSS Fundamentals / Specificity

1. IN A ROCKET Learn front-end development at rocket speed CSS CSS FUNDAMENTALS Speciﬁcity

2. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com CASCADE SPECIFICITY +

3. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com Web page title index.html HTML CSS h1 { color: blue; } p { color: red; } input { color: pink; } h1 { color: green; } CASCADE I'm a header

4. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com Web page title index.html HTML CSS <html> <head> <link rel="stylesheet" href="styles.css"> <style> h1 { color: blue; } </style> </head> <body> <h1 style="color: green">I'm a header</h1> </body> </html> CASCADE I'm a header h1 { color: red; }

5. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com CASCADE SPECIFICITY +

6. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com HTML CSS Browser SPECIFICITY <body> <header> <h1>I'm a header</h1> </header> </body> header h1 { color: green; } h1 { color: blue; } Web page title index.html I'm a header The h1 selector position is better for cascade, but header h1 prevails because is more speciﬁc. READY TO USE CODE

7. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline (style attribute) selector 0 000

8. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com •Soy el primer enlace de una lista. •Soy el segundo enlace de una lista. •Soy el tercer enlace de una lista. My links list index.html ul li a

9. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline (style attribute) ul li a 0 000

10. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline (style attribute) ul li a 0 300

11. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com •Soy el primer enlace de una lista. •Soy el segundo enlace de una lista. •Soy el tercer enlace de una lista. My links list index.html ul li a .lk-list

12. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline (style attribute) .lk-list 0 000

13. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline (style attribute) .lk-list 1 000

14. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com •Soy el primer enlace de una lista. •Soy el segundo enlace de una lista. •Soy el tercer enlace de una lista. My links list index.html ul li a .lk-list #lk-list

15. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline (style attribute) #lk-list 0 000

16. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline (style attribute) #lk-list 0 010

17. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com CAUTION •Soy el primer enlace de una lista. •Soy el segundo enlace de una lista. •Soy el tercer enlace de una lista. My links list index.html ul li a .lk-list #lk-list { } <a style=""...

18. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline (style attribute) <a style=""... 0 000

19. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline (style attribute) <a style=""... 0 001

20. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com LET'S PLAY!

21. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline html body div div h2 0 000 ElementClass Pseudo-class Attribute IDInline .header-important 0 000

22. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline html body div div h2 0 500 ElementClass Pseudo-class Attribute IDInline .header-important 1 000

23. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline #info 0 000 ElementClass Pseudo-class Attribute IDInline .box .info p 0 000

24. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline #info 0 010 ElementClass Pseudo-class Attribute IDInline .box .info p 2 100

25. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline ul#nav li.active a 0 000 ElementClass Pseudo-class Attribute IDInline #lk-special 0 000

26. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline ul#nav li.active a 1 310 ElementClass Pseudo-class Attribute IDInline #lk-special 0 010

27. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline #box ul li a 0 000 ElementClass Pseudo-class Attribute IDInline li a .lk-important 0 000

28. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com ElementClass Pseudo-class Attribute IDInline #box ul li a 0 310 ElementClass Pseudo-class Attribute IDInline li a .lk-important 1 200

29. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com SPECIFICITY WARS

30. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com TOOLS: SPECIFICITY CALCULATOR

31. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com TOOLS: VISUAL STUDIO CODE Just hover your pointer over a selector

32. CSS FUNDAMENTALS: Build a strong foundation by solving real cases inarocket.com CASCADE SPECIFICITY +

33. Learn front-end development at rocket speed inarocket.com by miguelsanchez.com YOU CAN CONTINUE THIS COURSE FOR FREE ON + READY TO USE CODE + QUIZZES + FREE UPDATES

34. We respect your time  No more blah blah videos. Just straight to the point slides with relevant information. Ready to use code  Real code you can just copy and paste into your real projects. Step by step guides  Clear and concise steps to build real use solutions. No missed points. Learn front-end development at rocket speed inarocket.com

35. IN A ROCKET Learn front-end development at rocket speed CSS CSS FUNDAMENTALS Speciﬁcity

13- Learn CSS Fundamentals / Specificity

Recommended

More Related Content

What's hot (20)

Similar to 13- Learn CSS Fundamentals / Specificity (20)

More from In a Rocket (11)

Recently uploaded (17)

13- Learn CSS Fundamentals / Specificity