[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"detail-sidebar-cat-1-en-105":3,"doc-seo-573456-105":53,"doc-detail-573456-en":126},{"code":4,"msg":5,"data":6},0,"success",[7,14,19,24,29,34,39,44,49],{"id":8,"doc_module":9,"doc_module_name":10,"category_name":11,"show_sort_weight":12,"slug":13},11,1,"Template","Presentations",90,"presentations",{"id":15,"doc_module":9,"doc_module_name":10,"category_name":16,"show_sort_weight":17,"slug":18},12,"Resumes",80,"resumes",{"id":20,"doc_module":9,"doc_module_name":10,"category_name":21,"show_sort_weight":22,"slug":23},14,"Invoices",70,"invoices",{"id":25,"doc_module":9,"doc_module_name":10,"category_name":26,"show_sort_weight":27,"slug":28},15,"Posters",60,"posters",{"id":30,"doc_module":9,"doc_module_name":10,"category_name":31,"show_sort_weight":32,"slug":33},16,"Social Media",50,"social-media",{"id":35,"doc_module":9,"doc_module_name":10,"category_name":36,"show_sort_weight":37,"slug":38},17,"Forms",40,"forms",{"id":40,"doc_module":9,"doc_module_name":10,"category_name":41,"show_sort_weight":42,"slug":43},18,"Letters",30,"letters",{"id":45,"doc_module":9,"doc_module_name":10,"category_name":46,"show_sort_weight":47,"slug":48},21,"Paper Templates",5,"papers-templates",{"id":50,"doc_module":9,"doc_module_name":10,"category_name":51,"show_sort_weight":4,"slug":52},158,"General","general-158",{"code":4,"msg":54,"data":55},"ok",{"site_id":56,"language":57,"slug":58,"title":59,"keywords":60,"description":61,"schema_data":62,"social_meta":119,"head_meta":121,"extra_data":123,"updated_unix":125},105,"en","css-cheat-sheet-html-cheat-sheetcom-css","CSS Cheat Sheet - HTML Cheat Sheet.com / CSS","","A compact CSS cheat sheet compiling selector syntax, pseudo-classes, attribute selectors, and core styling rules for writing HTML-linked presentation. It summarizes selector patterns for elements, classes, IDs, and relationships, then lists frequently used pseudo-classes and pseudo-elements. The sheet also provides CSS basics such as external, internal, and inline styling, clearfix usage, and the box model properties. It further catalogs flex alignment properties, animation controls, and common background and border property options.",{"@graph":63,"@context":118},[64,80,101],{"@type":65,"itemListElement":66},"BreadcrumbList",[67,71,74,77],{"item":68,"name":69,"@type":70,"position":9},"https://docshare.wps.com","Home","ListItem",{"item":72,"name":10,"@type":70,"position":73},"https://docshare.wps.com/template/",2,{"item":75,"name":11,"@type":70,"position":76},"https://docshare.wps.com/template/presentations/",3,{"item":78,"name":59,"@type":70,"position":79},"https://docshare.wps.com/template/css-cheat-sheet-html-cheat-sheetcom-css/573456/",4,{"url":78,"name":59,"@type":81,"image":82,"author":87,"headline":59,"publisher":90,"fileFormat":93,"inLanguage":57,"description":61,"dateModified":94,"datePublished":95,"encodingFormat":93,"isAccessibleForFree":96,"interactionStatistic":97},"DigitalDocument",{"url":83,"@type":84,"width":85,"height":86},"https://docshare.wps.com/thumbnails/css-cheat-sheet-html-cheat-sheetcom-css/573456.png","ImageObject",442,249,{"name":88,"@type":89},"noah","Person",{"url":68,"name":91,"@type":92},"DocShare","Organization","application/pdf","2026-10-18","2026-10-14",true,{"@type":98,"interactionType":99,"userInteractionCount":76},"InteractionCounter",{"@type":100},"ViewAction",{"@type":102,"mainEntity":103},"FAQPage",[104,110,114],{"name":105,"@type":106,"acceptedAnswer":107},"What are the main selector types covered in this CSS cheat sheet?","Question",{"text":108,"@type":109},"It covers basic element selectors, class and ID selectors, combinators (descendant, child, adjacent, sibling), and attribute selectors, including common patterns like starts-with, contains, and exact matches.","Answer",{"name":111,"@type":106,"acceptedAnswer":112},"Which pseudo-classes and pseudo-elements are listed?",{"text":113,"@type":109},"The sheet includes pseudo-classes such as :hover, :active, :visited, input state selectors (checked/disabled/enabled/focus/valid/invalid/required/read-only), structural selectors (first-child/last-child/nth-child), and :root and :target. It also lists pseudo-elements like ::before and ::after, plus ::first-letter and ::first-line.",{"name":115,"@type":106,"acceptedAnswer":116},"What CSS basics and layout utilities are included?",{"text":117,"@type":109},"It summarizes how to include CSS using link, style blocks, or inline styles, provides a clearfix pattern, reviews the box model (margin/border/padding/content), and lists key animation and background/border properties for styling elements.","https://schema.org",{"og:url":78,"og:type":120,"og:title":59,"og:site_name":91,"og:description":61},"article",{"robots":122,"canonical":78},"index,follow",{"doc_id":124,"site_id":56},573456,1792023035,{"code":4,"msg":5,"data":127},{"doc_id":124,"user_id":128,"nickname":88,"user_avatar":129,"doc_module":9,"category_id":8,"category_name":11,"doc_title":59,"doc_description":61,"doc_content":130,"file_id":131,"file_url":132,"file_type":133,"file_size":134,"view_count":76,"is_deleted":4,"is_public":9,"is_downloadable":9,"audit_status":9,"page_count":47,"language":135,"language_code":57,"site_id":56,"html_lang":57,"table_of_contents":136,"faqs":137,"seo_title":138,"seo_description":61,"update_tm":139,"read_time":73},1099529839121,"https://ap-avatar.wpscdn.com/davatar_994ba38a5ba835b3df7d355c54d3ed8d","[HTML Cheat Sheet.com / CSS](HTML Cheat Sheet.com / CSS)  \nSel ectors  \n\n| *\u003Cbr>div div,p\u003Cbr>div p\u003Cbr>div > p\u003Cbr>div + p\u003Cbr>div ~ p\u003Cbr>.classname\u003Cbr>\\#idname\u003Cbr>div.classname\u003Cbr>div\\#idname \\#idname * | all elements\u003Cbr>all div tags\u003Cbr>all divs and paragraphs paragraphs inside divs\u003Cbr>all p tags, one level deep in div p tags immediately after div p tags preceded by div all elements with class element with ID\u003Cbr>divs with certain classname\u003Cbr>div with certain ID\u003Cbr>all elements inside \\#idname |\n| --- | --- |\n| Pseudo classes\u003Cbr>a:link link in normal state\u003Cbr>a:active link in clicked state\u003Cbr>a:hover link with mouse over it\u003Cbr>a:visited visited link\u003Cbr>p::after{content:\"yo\";} add content after pp::before add content before p\u003Cbr>input:checked checked inputs\u003Cbr>input:disabled disabled inputs\u003Cbr>input:enabled enabled inputs\u003Cbr>input:focus input has focus\u003Cbr>input:in-range value in range\u003Cbr>input:out-of-range input value out of range\u003Cbr>input:valid input with valid value\u003Cbr>input:invalid input with invalid value\u003Cbr>input:optional no required attribute\u003Cbr>input:required input with requred attribute input:read-only with readonly attribute\u003Cbr>input:read-write no readonly attrib.\u003Cbr>div:empty element with no children\u003Cbr>p::first-letter first letter in pp::first-line first line in p\u003Cbr>p:first-of-type first of some type p:last-of-type last of some type\u003Cbr>p:lang(en) p with en language attribute\u003Cbr>:not(span) element that's not a span\u003Cbr>p:first-child first child of its parent p:last-child last child of its parent\u003Cbr>p:nth-child(2) second child of its parent p:nth-child(3n+1) nth-child (an + b) formula p:nth-last-child(2) second child from behind p:nth-of-type(2) second p ofits parent p:nth-last-of-type(2) ...from behind\u003Cbr>p:only-of-type unique of its parent p:only-child only child of its parent\u003Cbr>:root documents root element\u003Cbr>::selection portion selected by user\u003Cbr>:target highlight active anchor |  |\n| Attribute selectors\u003Cbr>a[target]\u003Cbr>a[target=\"_blank\"][title~=\"chair\"][class^=\"chair\"]\u003Cbr>[class|=\"chair\"]\u003Cbr>[class*=\"chair\"] | links with a target attribute links which open in new tab title element containing a word class starts with chair\u003Cbr>class starts with the chair word class contains chair |\n\nBasi cs  \n\n| Syntax\u003Cbr>selector{\u003Cbr>property : value ;\u003Cbr>property2 : value2 ;\u003Cbr>} |  |\n| --- | --- |\n| Include external css file\u003Cbr>\u003Clink rel= \"stylesheet\" type= \"text/css\" href=\"/style |  |\n| Internal styles\u003Cbr>\u003Cstyle type= \"text/css\" >\u003Cbr>div { color : \\#444 ;}\u003Cbr>\u003C/style> |  |\n| Inline styles\u003Cbr>\u003Ctag style=\"property: value\" > \u003C/tag> |  |\n| Clearfix\u003Cbr>.clearfix :after { clear : both ;\u003Cbr>content : \" \" ;\u003Cbr>display : block ;\u003Cbr>font-size : 0 ;\u003Cbr>height : 0 ;\u003Cbr>visibility : hidden ;}\u003Cbr>.clearfix { display : inline-block ; }\u003Cbr>* html .clearfix { height : 1% ; }\u003Cbr>.clearfix { display : block ; } |  |\n| Box model\u003Cbr>Properti es | margin\u003Cbr>border\u003Cbr>padding\u003Cbr>content |\n\nalign-content behavior of the flex-wrap property align-items  \nalignment for items inside the container  \nalign-self all animation  \nanimation-delay animation-direction  \nalignment for the selected item changes all properties  \nbinds an animation to an element delays animation start  \nreverse animation or in alternate cycles  \nanimation-duration animation duration in seconds or ms animation-fill-mode style when the animation is not playianimation-iteration-count number of an animation replay animation-name name for the @keyframes animation animation-play-state the animation is running or paused animation-timing-function speed curve of an animation backface-visibility  \n[class$=\"chair\"] class ends with chair input[type=\"button\"] specified input type  \nCol or Picker  \nBackground   \nImage URL: [https://htmlcheatsheet.com/images/logo-cs](https://htmlcheatsheet.com/images/logo-cs)  \nnone  \nRepeat: no repeat repeat-x repeat-y Attachment: scroll fixed local  \nColor: D0E4F5   \nPreview  \n0  \n0  \n1  \nGradi ent  \n1C6EA4  \n2388CB  \n144E75  \nis element visible when not facing th","cbCaimsI2SBsQk9C","https://ap.wps.com/l/cbCaimsI2SBsQk9C","pdf",309940,"English","# Selectors\n## Basic selectors\n## Pseudo classes and pseudo elements\n## Attribute selectors\n# CSS Basics\n## External, internal, inline styles\n## Clearfix\n## Box model\n# Layout and Effects\n## Flex alignment properties\n## Animations\n## Background properties\n## Border properties","[{\"question\":\"What are the main selector types covered in this CSS cheat sheet?\",\"answer\":\"It covers basic element selectors, class and ID selectors, combinators (descendant, child, adjacent, sibling), and attribute selectors, including common patterns like starts-with, contains, and exact matches.\"},{\"question\":\"Which pseudo-classes and pseudo-elements are listed?\",\"answer\":\"The sheet includes pseudo-classes such as :hover, :active, :visited, input state selectors (checked/disabled/enabled/focus/valid/invalid/required/read-only), structural selectors (first-child/last-child/nth-child), and :root and :target. It also lists pseudo-elements like ::before and ::after, plus ::first-letter and ::first-line.\"},{\"question\":\"What CSS basics and layout utilities are included?\",\"answer\":\"It summarizes how to include CSS using link, style blocks, or inline styles, provides a clearfix pattern, reviews the box model (margin/border/padding/content), and lists key animation and background/border properties for styling elements.\"}]","CSS Cheat Sheet - HTML Cheat Sheet.com / CSS | PDF",1791940070]