{"id":677,"date":"2021-04-21T05:30:54","date_gmt":"2021-04-21T05:30:54","guid":{"rendered":"https:\/\/bcisnotes.com\/fourthsemester\/?p=677"},"modified":"2021-04-21T05:30:54","modified_gmt":"2021-04-21T05:30:54","slug":"css-selectors-html-css-bcis-notes","status":"publish","type":"post","link":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/","title":{"rendered":"CSS Selectors || HTML\/CSS || BCIS Notes"},"content":{"rendered":"

CSS Selectors<\/h1>\n

CSS selectors<\/strong> define the elements to which a set of CSS rules apply.<\/p>\n

They<\/strong> are used to select the content you want to style<\/em>. Selectors are the part of CSS ruleset. CSS selectors select HTML elements according to their id, class, type, attribute, etc.<\/p>\n

There are five types of selectors, they are:<\/p>\n

    \n
  1. CSS Universal Selector<\/li>\n
  2. CSS Element Selector<\/li>\n
  3. CSS Class Selector<\/li>\n
  4. CSS ID Selector<\/li>\n
  5. CSS Group Selector<\/li>\n<\/ol>\n
    \n
    1. Universal selector<\/strong><\/dt>\n
    It selects all elements on the pages. Optionally, it may be restricted to a specific namespace or to all namespaces.<\/dt>\n
    Syntax:<\/strong> *<\/code>
    \nExample:<\/strong> *<\/code> will match all the elements of the document.<\/dt>\n
    \"Universal<\/dt>\n
    <\/dd>\n
    2. Element selector<\/strong><\/dt>\n
    <\/dt>\n
    It selects all elements that have the given node name.
    \nSyntax:<\/strong> elementname<\/var><\/code>
    \nExample:<\/strong> input<\/code> will match any <input><\/code><\/a> element.<\/dt>\n
    \"Element<\/dt>\n
    <\/dd>\n
    3. Class selector<\/strong><\/dt>\n
    <\/dt>\n
    It selects all elements that have the given class<\/code> attribute.
    \nSyntax:<\/strong> .classname<\/var><\/code>
    \nExample:<\/strong> .index<\/code> will match any element that has a class of “index”.<\/dt>\n
    \"Class<\/dt>\n
    <\/dd>\n
    4. ID selector<\/strong><\/dt>\n
    <\/dt>\n
    <\/dt>\n
    It selects an element based on the value of its id<\/code> attribute. There should be only one element with a given ID in a document.
    \nSyntax:<\/strong> #idname<\/var><\/code>
    \nExample:<\/strong> #toc<\/code> will match the element that has the ID “toc”.<\/dt>\n
    \"Id<\/dt>\n
    <\/dd>\n
    5. Group selector<\/strong><\/dt>\n
    <\/dt>\n
    The grouping selector is used to select all the elements with the same style definitions. Grouping selector is used to minimizing the code. Commas are used to separate each selector in a grouping.Syntax:<\/strong> elementname, elementname, elementname <\/code>Example:<\/strong> h1, h2, p will match all elements that have the h1, h2, p element name.\u00a0(to any value).<\/dt>\n<\/dl>\n
    \n
    \n
    \"Group<\/dd>\n<\/dl>\n

    If you liked our content CSS Selectors, then you will also like\u00a0Introduction to CSS\u00a0<\/a><\/p>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

    CSS Selectors CSS selectors define the elements to which a set of CSS rules apply. They are used to select the content you want to […]<\/a><\/p>\n<\/div>","protected":false},"author":3,"featured_media":678,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[218,215],"yoast_head":"\nCSS Selectors || HTML\/CSS || BCIS Notes<\/title>\n<meta name=\"description\" content=\"CSS selectors define the elements to which a set of CSS rules apply.They are used to select the content you want to style.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"CSS Selectors || HTML\/CSS || BCIS Notes\" \/>\n<meta property=\"og:description\" content=\"CSS selectors define the elements to which a set of CSS rules apply.They are used to select the content you want to style.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/\" \/>\n<meta property=\"og:site_name\" content=\"BCIS Fourth Semester\" \/>\n<meta property=\"article:published_time\" content=\"2021-04-21T05:30:54+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/04\/bcis-4.png\" \/>\n\t<meta property=\"og:image:width\" content=\"340\" \/>\n\t<meta property=\"og:image:height\" content=\"230\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Her Highness\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Her Highness\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/\"},\"author\":{\"name\":\"Her Highness\",\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/#\/schema\/person\/fcc10e27b06f3f95367e914911b47eb3\"},\"headline\":\"CSS Selectors || HTML\/CSS || BCIS Notes\",\"datePublished\":\"2021-04-21T05:30:54+00:00\",\"dateModified\":\"2021-04-21T05:30:54+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/\"},\"wordCount\":258,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/#organization\"},\"image\":{\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/04\/bcis-4.png\",\"keywords\":[\"CSS Selectors\",\"HTML\/CSS\"],\"articleSection\":[\"IT\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/\",\"url\":\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/\",\"name\":\"CSS Selectors || HTML\/CSS || BCIS Notes\",\"isPartOf\":{\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/04\/bcis-4.png\",\"datePublished\":\"2021-04-21T05:30:54+00:00\",\"dateModified\":\"2021-04-21T05:30:54+00:00\",\"description\":\"CSS selectors define the elements to which a set of CSS rules apply.They are used to select the content you want to style.\",\"breadcrumb\":{\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#primaryimage\",\"url\":\"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/04\/bcis-4.png\",\"contentUrl\":\"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/04\/bcis-4.png\",\"width\":340,\"height\":230,\"caption\":\"CSS Selectors || HTML\/CSS || BCIS Notes\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/bcisnotes.com\/fourthsemester\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"CSS Selectors || HTML\/CSS || BCIS Notes\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/#website\",\"url\":\"https:\/\/bcisnotes.com\/fourthsemester\/\",\"name\":\"BCIS Fourth Semester\",\"description\":\"Notes of Information and Technology\",\"publisher\":{\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/bcisnotes.com\/fourthsemester\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/#organization\",\"name\":\"BCIS Fourth Semester\",\"url\":\"https:\/\/bcisnotes.com\/fourthsemester\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/02\/cropped-4-1.jpg\",\"contentUrl\":\"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/02\/cropped-4-1.jpg\",\"width\":300,\"height\":100,\"caption\":\"BCIS Fourth Semester\"},\"image\":{\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/#\/schema\/person\/fcc10e27b06f3f95367e914911b47eb3\",\"name\":\"Her Highness\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/bcisnotes.com\/fourthsemester\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/9f5c6e84ebb073447dba2985b41b0fdc?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/9f5c6e84ebb073447dba2985b41b0fdc?s=96&d=mm&r=g\",\"caption\":\"Her Highness\"},\"sameAs\":[\"http:\/\/bcisnotes.com\/fourthsemester\"],\"url\":\"https:\/\/bcisnotes.com\/fourthsemester\/author\/jaya\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"CSS Selectors || HTML\/CSS || BCIS Notes","description":"CSS selectors define the elements to which a set of CSS rules apply.They are used to select the content you want to style.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/","og_locale":"en_US","og_type":"article","og_title":"CSS Selectors || HTML\/CSS || BCIS Notes","og_description":"CSS selectors define the elements to which a set of CSS rules apply.They are used to select the content you want to style.","og_url":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/","og_site_name":"BCIS Fourth Semester","article_published_time":"2021-04-21T05:30:54+00:00","og_image":[{"width":340,"height":230,"url":"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/04\/bcis-4.png","type":"image\/png"}],"author":"Her Highness","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Her Highness","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#article","isPartOf":{"@id":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/"},"author":{"name":"Her Highness","@id":"https:\/\/bcisnotes.com\/fourthsemester\/#\/schema\/person\/fcc10e27b06f3f95367e914911b47eb3"},"headline":"CSS Selectors || HTML\/CSS || BCIS Notes","datePublished":"2021-04-21T05:30:54+00:00","dateModified":"2021-04-21T05:30:54+00:00","mainEntityOfPage":{"@id":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/"},"wordCount":258,"commentCount":0,"publisher":{"@id":"https:\/\/bcisnotes.com\/fourthsemester\/#organization"},"image":{"@id":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#primaryimage"},"thumbnailUrl":"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/04\/bcis-4.png","keywords":["CSS Selectors","HTML\/CSS"],"articleSection":["IT"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/","url":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/","name":"CSS Selectors || HTML\/CSS || BCIS Notes","isPartOf":{"@id":"https:\/\/bcisnotes.com\/fourthsemester\/#website"},"primaryImageOfPage":{"@id":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#primaryimage"},"image":{"@id":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#primaryimage"},"thumbnailUrl":"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/04\/bcis-4.png","datePublished":"2021-04-21T05:30:54+00:00","dateModified":"2021-04-21T05:30:54+00:00","description":"CSS selectors define the elements to which a set of CSS rules apply.They are used to select the content you want to style.","breadcrumb":{"@id":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#primaryimage","url":"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/04\/bcis-4.png","contentUrl":"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/04\/bcis-4.png","width":340,"height":230,"caption":"CSS Selectors || HTML\/CSS || BCIS Notes"},{"@type":"BreadcrumbList","@id":"https:\/\/bcisnotes.com\/fourthsemester\/css-selectors-html-css-bcis-notes\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/bcisnotes.com\/fourthsemester\/"},{"@type":"ListItem","position":2,"name":"CSS Selectors || HTML\/CSS || BCIS Notes"}]},{"@type":"WebSite","@id":"https:\/\/bcisnotes.com\/fourthsemester\/#website","url":"https:\/\/bcisnotes.com\/fourthsemester\/","name":"BCIS Fourth Semester","description":"Notes of Information and Technology","publisher":{"@id":"https:\/\/bcisnotes.com\/fourthsemester\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/bcisnotes.com\/fourthsemester\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/bcisnotes.com\/fourthsemester\/#organization","name":"BCIS Fourth Semester","url":"https:\/\/bcisnotes.com\/fourthsemester\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/bcisnotes.com\/fourthsemester\/#\/schema\/logo\/image\/","url":"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/02\/cropped-4-1.jpg","contentUrl":"https:\/\/bcisnotes.com\/fourthsemester\/wp-content\/uploads\/2021\/02\/cropped-4-1.jpg","width":300,"height":100,"caption":"BCIS Fourth Semester"},"image":{"@id":"https:\/\/bcisnotes.com\/fourthsemester\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/bcisnotes.com\/fourthsemester\/#\/schema\/person\/fcc10e27b06f3f95367e914911b47eb3","name":"Her Highness","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/bcisnotes.com\/fourthsemester\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/9f5c6e84ebb073447dba2985b41b0fdc?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/9f5c6e84ebb073447dba2985b41b0fdc?s=96&d=mm&r=g","caption":"Her Highness"},"sameAs":["http:\/\/bcisnotes.com\/fourthsemester"],"url":"https:\/\/bcisnotes.com\/fourthsemester\/author\/jaya\/"}]}},"_links":{"self":[{"href":"https:\/\/bcisnotes.com\/fourthsemester\/wp-json\/wp\/v2\/posts\/677"}],"collection":[{"href":"https:\/\/bcisnotes.com\/fourthsemester\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bcisnotes.com\/fourthsemester\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bcisnotes.com\/fourthsemester\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/bcisnotes.com\/fourthsemester\/wp-json\/wp\/v2\/comments?post=677"}],"version-history":[{"count":1,"href":"https:\/\/bcisnotes.com\/fourthsemester\/wp-json\/wp\/v2\/posts\/677\/revisions"}],"predecessor-version":[{"id":679,"href":"https:\/\/bcisnotes.com\/fourthsemester\/wp-json\/wp\/v2\/posts\/677\/revisions\/679"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/bcisnotes.com\/fourthsemester\/wp-json\/wp\/v2\/media\/678"}],"wp:attachment":[{"href":"https:\/\/bcisnotes.com\/fourthsemester\/wp-json\/wp\/v2\/media?parent=677"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bcisnotes.com\/fourthsemester\/wp-json\/wp\/v2\/categories?post=677"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bcisnotes.com\/fourthsemester\/wp-json\/wp\/v2\/tags?post=677"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}