1 / 12

CSS Selectors Tutorial For Beginners | Selectors In CSS | CSS Tutorial For Beginners | Simplilearn

In this CSS Selectors presentation, we will discuss what CSS Selectors are and the different types of selectors. Selectors are extremely helpful in styling the web pages using CSS. <br><br>ost Graduate Program in Full Stack Web Development:<br>A Global Online Coding Bootcamp With Caltech CTME<br>Accelerate your career as a software developer through this Post Graduate Program in Full Stack Web Development course in collaboration with Caltech CTME. In just a few months, you'll learn modern coding techniques with bootcamp-level intensity and gain all you need to be a full-stack technologist. This Post Graduate Program will help you master both front-end and back-end Java technologies, starting with the basics and progressing to the advanced aspects of Full Stack Web Development. In this web development certification course, you will learn Angular, Spring Boot, Hibernate, JSPs, and MVC to help you launch your career as a full stack developer.<br><br>Key Features:<br>u2705 Caltech CTME Post Graduate Certification<br>u2705 Masterclasses from Caltech CTME faculty<br>u2705 Online Convocation by Caltech CTME Program Director<br>u2705 Get noticed by the top hiring companies<br>u2705 Receive 25 CEUs from Caltech CTME<br>u2705 Access to Caltech CTME Circle Membership<br>u2705 Physical Certificate from Caltech CTME (on request)<br>u2705 250 Hours of Applied Learning<br>u2705 30 in-demand tools and skills<br>u2705 Capstone Project in 4 domains<br>u2705 20 lesson-end and five phase-end projects<br>u2705 Build your own portfolio on GitHub<br><br>ud83dudc49Learn more at: https://www.simplilearn.com/pgp-full-stack-web-development-certification-training-course<br>

Simplilearn
Download Presentation

CSS Selectors Tutorial For Beginners | Selectors In CSS | CSS Tutorial For Beginners | Simplilearn

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. What’s in it for you? • What is CSS Selectors • Types of CSS Selectors? • Examples • Hands-on demo

  2. CSS Selectors CSS selectors let you select individual elements in HTML. They are part of the CSS rule set CSS selectors select HTML elements according to its id, class, type, attribute etc.

  3. Click here to watch the video

  4. Types of CSS Selectors • There are several different types of selectors in CSS • CSS Class Selector • CSS ID Selector • CSS Universal Selector • CSS Group Selector • CSS Element Selector

  5. CSS Element Selector The element selector selects the HTML element by name Example p {  text-align: center;  color: blue;} All <p> elements on the page will be center-aligned, with a blue text color

  6. CSS ID Selector • The id selector selects the HTML element with specific id attribute • It is written with the hash character (#), followed by the id of the element • Example • #para1 {  text-align: center;  color: blue;} The rule will be applied to the HTML element with id = ‘para1’

  7. CSS Class Selector • The class selector selects the HTML element with a specific class attribute • To select elements with a specific class, write a period character (.), followed by the class name • Example • .class1 {  text-align: center;  color: blue;} The rule will be applied to the HTML element with class = ‘class1’

  8. CSS Universal Selector • The universal selector (*) selects all the HTML elements on the page • Example • * {  text-align: center;  color: blue;} The rule will be applied to all the HTML element on the page

  9. CSS Group Selector • The group selector is used to select all the elements with the same style definition • Commas are used to separate each selector in grouping • Example • h1,h2,p {  text-align: center;  color: blue;} It is better to group the selectors, to minimize the code

  10. Hands-On Demo

  11. Join us to learn more! simplilearn.com UNITED STATES Simplilearn Solutions Pvt. Limited 201 Spear Street, Suite 1100 San Francisco, CA 94105 Phone: (415) 741-3319 INDIA Simplilearn Solutions Pvt. Limited #53/1C, 24th Main, 2nd Sector HSR Layout, Bangalore 560102 Phone: +91 8069999471 UNITED STATES Simplilearn Solutions Pvt. Limited 801 Corporate Center Drive, Suite 138 Raleigh, NC 27607 Phone: (919) 205-5565

More Related