SlideShare a Scribd company logo
1 of 1
Boxes                                                                                                           Paging


                                       css
           margin *                                                                                                          size
         margin-top                                                                                                          marks
       margin-right                                                                                                          page-break-before
      margin-bottom                                                                                                          page-break-after
         margin-left                                                                                                         page-break-inside
                                                                                                                             page
          padding *                                                                                                          orphans
        padding-top                                                                                                          widows
       padding-right
     padding-bottom                                                                                                          Color / Background
                             /* Comment */                                                               Width
                                                                                     Visible Area
        padding-left                                                                                                         color
                             @media type {
                                                                                                                             * background
                                   selector {
            border     *                                                                                                     background-color
                                       property: values;
        border-top     *                                                                                                     background-image
    border-bottom      *                                                                                                     background-repeat
                                   }
      border-right     *                                                                                                     background-attachment
                             }                       (Media type optional)
        border-left    *                                                                                                     background-position

      border-color *                                                                                                         Fonts
    border-top-color                                                                                                         * font
  border-right-color                                                                                                         font-family
                                                Styles apply to:
border-bottom-color                                                                                                          font-style
                            *                   All elements
    border-left-color                                                                                                        font-variant
                            div                 <div>
                                                                                                                             font-weight
                                                                                 Height    Border   Padding         Margin
                            div *               Elements within <div>
      border-style *                                                                                                         font-stretch
   border-top-style         div span                                                                                         font-size
                                                <span> within <div>
  border-right-style                                                                                                         font-size-adjust
                            div, span           <div> and <span>
border-bottom-style
                            div > span          <span> with <div> as
    border-left-style                                                                                                        Text
                                                parent                       px               Pixels                         text-indent
      border-width *        div + span                                                                                       text-align
                                                <span> preceded by           em               1em equal to font size of
   border-top-width                                                                                                          text-decoration
                                                <div> ... </div>                              parent (same as 100%)
  border-right-width                                                                                                         text-shadow
                            .class              Elements of class quot;classquot;    ex               Height of lower case quot;xquot;
border-bottom-width                                                                                                          letter-spacing
                            div.class           <div> of class quot;classquot;       %                Percentage
    border-left-width                                                                                                        word-spacing
                            #itemid                                                                                          text-transform
                                                Element with id quot;itemidquot;     in               Inches
         Positioning                                                                                                         white-space
                            div#itemid          <div> with id quot;itemidquot;       cm               Centimeters
               display
                            a[class]            <a> with class attribute     mm               Millimeters
              position                                                                                                       Tables
                            a[class='x']        <a> when class is quot;xquot;        pt               1pt = 1/72in
                    top                                                                                                      caption-side
                 right      a[class~='x'] <a> when class is a list                                                           table-layout
                                                                             pc               1pc = 12pt
               bottom                                                                                                        border-collapse
                                                of space-seperated values    #789abc          RGB Hex Notation
                    left                                                                                                     border-spacing
                                                and one of those is 'x'      #acf             Equates to quot;#aaccffquot;
                  float                                                                                                      empty-cells
                            a[lang|='en']       <a> when lang begins         rgb(0,25,50)     Value (0 to 255) of each
                 clear                                                                                                       speak-header
              z-index                           with quot;enquot;                                     of red, green, and blue.
            direction                                                                                                        Interface
                                                                                              May also be percentages
         unicode-bidi                                                                                                        cursor
                                                                             0                0 requires no unit
             overflow                                                                                                        * outline
                    clip                                                                                                     outline-width
                                                Styles apply to:
             visibility                                                                                                      outline-style
                                                                                                                             outline-color
                            :first-child        First child of element
        Dimensions                                                           azimuth                   list-style
                            :first-line         First line of element
                width                                                                                                        Aural
                                                                             border-collapse           list-style-image
                            :first-letter       First letter of element
           min-width                                                                                                         volume
                                                                             border-spacing            list-style-position
                            :hover              Element when mouse over
          max-width                                                                                                          speak
                                                                             caption-side              list-style-type
               height                                                                                                        * pause
                            :active             Active element
          min-height                                                                                                         pause-before
                                                                             color                     orphans
                            :focus              Element with focus
         max-height                                                                                                          pause-after
                                                                             cursor                    page
                            :link               Non-active, unvisited
          line-height                                                                                                        * cue
                                                                             direction                 page-break-inside
                                                links without mouse over.
        vertical-align                                                                                                       cue-before
                                                                             empty-cells               quotes                cue-after
                            :visited            Visited links
     Miscellaneous                                                                                                           play-during
                                                                             font                      speak
                            :lang(lang)         Element with text of
                 content                                                                                                     azimuth
                                                                             font-family               speak-header
                                                language quot;langquot;
                  quotes                                                                                                     elevation
                                                                             font-stretch              text-align
         counter-reset                                                                                                       speech-rate
                                                                             font-size                 text-indent
  counter-increment                                                                                                          voice-family
         marker-offset                                                                                                       pitch
                                                                             font-size-adjust          text-transform
             list-style *                                                                                                    pitch-range
                                                                             font-style                volume
                             all                     projection
         list-style-type                                                                                                     stress
                                                                             font-variant              white-space
                             braille                 screen
      list-style-image                                                                                                       richness
                                                                             font-weight               widows
   list-style-position                                                                                                       speak-punctuation
                             embossed                speech
                                                                                                                             speak-numeral
                                                                             letter-spacing            word-spacing
                             handheld                tty
  Shorthand properties
                                                                             line-height                                     Available free from
                             print                   tv
    are marked with *
                                                                                                                             ILoveJackDaniels.com

More Related Content

Similar to Css Cheat Sheet

Similar to Css Cheat Sheet (7)

CSS
CSSCSS
CSS
 
CSS3
CSS3CSS3
CSS3
 
Css3 Cheat Sheet
Css3 Cheat SheetCss3 Cheat Sheet
Css3 Cheat Sheet
 
Css3 cheat-sheet
Css3 cheat-sheetCss3 cheat-sheet
Css3 cheat-sheet
 
Css3
Css3Css3
Css3
 
Шпаргалка оп Css3
Шпаргалка оп Css3Шпаргалка оп Css3
Шпаргалка оп Css3
 
CSS3 דף קוד
CSS3 דף קוד CSS3 דף קוד
CSS3 דף קוד
 

More from 51 lecture

1244600439API2 upload
1244600439API2 upload1244600439API2 upload
1244600439API2 upload51 lecture
 
1242982622API2 upload
1242982622API2 upload1242982622API2 upload
1242982622API2 upload51 lecture
 
1242982374API2 upload
1242982374API2 upload1242982374API2 upload
1242982374API2 upload51 lecture
 
1242626441API2 upload
1242626441API2 upload1242626441API2 upload
1242626441API2 upload51 lecture
 
1242625986my upload
1242625986my upload1242625986my upload
1242625986my upload51 lecture
 
1242361147my upload ${file.name}
1242361147my upload ${file.name}1242361147my upload ${file.name}
1242361147my upload ${file.name}51 lecture
 
this is ruby test
this is ruby testthis is ruby test
this is ruby test51 lecture
 
this is ruby test
this is ruby testthis is ruby test
this is ruby test51 lecture
 
this is ruby test
this is ruby testthis is ruby test
this is ruby test51 lecture
 
this is ruby test
this is ruby testthis is ruby test
this is ruby test51 lecture
 
this is ruby test
this is ruby testthis is ruby test
this is ruby test51 lecture
 
this is test api2
this is test api2this is test api2
this is test api251 lecture
 
My cool new Slideshow!
My cool new Slideshow!My cool new Slideshow!
My cool new Slideshow!51 lecture
 
Stress Management
Stress Management Stress Management
Stress Management 51 lecture
 
Iim A Managment
Iim A ManagmentIim A Managment
Iim A Managment51 lecture
 
Time Management
Time ManagementTime Management
Time Management51 lecture
 
Conversation By Design
Conversation By DesignConversation By Design
Conversation By Design51 lecture
 
dynamics-of-wikipedia-1196670708664566-3
dynamics-of-wikipedia-1196670708664566-3dynamics-of-wikipedia-1196670708664566-3
dynamics-of-wikipedia-1196670708664566-351 lecture
 
Tech_Implementation of Complex ITIM Workflows
Tech_Implementation of Complex ITIM WorkflowsTech_Implementation of Complex ITIM Workflows
Tech_Implementation of Complex ITIM Workflows51 lecture
 

More from 51 lecture (20)

1244600439API2 upload
1244600439API2 upload1244600439API2 upload
1244600439API2 upload
 
1242982622API2 upload
1242982622API2 upload1242982622API2 upload
1242982622API2 upload
 
1242982374API2 upload
1242982374API2 upload1242982374API2 upload
1242982374API2 upload
 
1242626441API2 upload
1242626441API2 upload1242626441API2 upload
1242626441API2 upload
 
1242625986my upload
1242625986my upload1242625986my upload
1242625986my upload
 
1242361147my upload ${file.name}
1242361147my upload ${file.name}1242361147my upload ${file.name}
1242361147my upload ${file.name}
 
this is ruby test
this is ruby testthis is ruby test
this is ruby test
 
this is ruby test
this is ruby testthis is ruby test
this is ruby test
 
this is ruby test
this is ruby testthis is ruby test
this is ruby test
 
this is ruby test
this is ruby testthis is ruby test
this is ruby test
 
this is ruby test
this is ruby testthis is ruby test
this is ruby test
 
this is test api2
this is test api2this is test api2
this is test api2
 
My cool new Slideshow!
My cool new Slideshow!My cool new Slideshow!
My cool new Slideshow!
 
Stress Management
Stress Management Stress Management
Stress Management
 
Iim A Managment
Iim A ManagmentIim A Managment
Iim A Managment
 
Time Management
Time ManagementTime Management
Time Management
 
Conversation By Design
Conversation By DesignConversation By Design
Conversation By Design
 
Web 2.0
Web 2.0Web 2.0
Web 2.0
 
dynamics-of-wikipedia-1196670708664566-3
dynamics-of-wikipedia-1196670708664566-3dynamics-of-wikipedia-1196670708664566-3
dynamics-of-wikipedia-1196670708664566-3
 
Tech_Implementation of Complex ITIM Workflows
Tech_Implementation of Complex ITIM WorkflowsTech_Implementation of Complex ITIM Workflows
Tech_Implementation of Complex ITIM Workflows
 

Recently uploaded

Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...apidays
 
Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Zilliz
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Victor Rentea
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusZilliz
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyKhushali Kathiriya
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamUiPathCommunity
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingEdi Saputra
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businesspanagenda
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfsudhanshuwaghmare1
 
Elevate Developer Efficiency & build GenAI Application with Amazon Q​
Elevate Developer Efficiency & build GenAI Application with Amazon Q​Elevate Developer Efficiency & build GenAI Application with Amazon Q​
Elevate Developer Efficiency & build GenAI Application with Amazon Q​Bhuvaneswari Subramani
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...Zilliz
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistandanishmna97
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDropbox
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Victor Rentea
 
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfRising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfOrbitshub
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FMESafe Software
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoffsammart93
 
Vector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptxVector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptxRemote DBA Services
 

Recently uploaded (20)

Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
Elevate Developer Efficiency & build GenAI Application with Amazon Q​
Elevate Developer Efficiency & build GenAI Application with Amazon Q​Elevate Developer Efficiency & build GenAI Application with Amazon Q​
Elevate Developer Efficiency & build GenAI Application with Amazon Q​
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistan
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfRising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
Vector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptxVector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptx
 

Css Cheat Sheet

  • 1. Boxes Paging css margin * size margin-top marks margin-right page-break-before margin-bottom page-break-after margin-left page-break-inside page padding * orphans padding-top widows padding-right padding-bottom Color / Background /* Comment */ Width Visible Area padding-left color @media type { * background selector { border * background-color property: values; border-top * background-image border-bottom * background-repeat } border-right * background-attachment } (Media type optional) border-left * background-position border-color * Fonts border-top-color * font border-right-color font-family Styles apply to: border-bottom-color font-style * All elements border-left-color font-variant div <div> font-weight Height Border Padding Margin div * Elements within <div> border-style * font-stretch border-top-style div span font-size <span> within <div> border-right-style font-size-adjust div, span <div> and <span> border-bottom-style div > span <span> with <div> as border-left-style Text parent px Pixels text-indent border-width * div + span text-align <span> preceded by em 1em equal to font size of border-top-width text-decoration <div> ... </div> parent (same as 100%) border-right-width text-shadow .class Elements of class quot;classquot; ex Height of lower case quot;xquot; border-bottom-width letter-spacing div.class <div> of class quot;classquot; % Percentage border-left-width word-spacing #itemid text-transform Element with id quot;itemidquot; in Inches Positioning white-space div#itemid <div> with id quot;itemidquot; cm Centimeters display a[class] <a> with class attribute mm Millimeters position Tables a[class='x'] <a> when class is quot;xquot; pt 1pt = 1/72in top caption-side right a[class~='x'] <a> when class is a list table-layout pc 1pc = 12pt bottom border-collapse of space-seperated values #789abc RGB Hex Notation left border-spacing and one of those is 'x' #acf Equates to quot;#aaccffquot; float empty-cells a[lang|='en'] <a> when lang begins rgb(0,25,50) Value (0 to 255) of each clear speak-header z-index with quot;enquot; of red, green, and blue. direction Interface May also be percentages unicode-bidi cursor 0 0 requires no unit overflow * outline clip outline-width Styles apply to: visibility outline-style outline-color :first-child First child of element Dimensions azimuth list-style :first-line First line of element width Aural border-collapse list-style-image :first-letter First letter of element min-width volume border-spacing list-style-position :hover Element when mouse over max-width speak caption-side list-style-type height * pause :active Active element min-height pause-before color orphans :focus Element with focus max-height pause-after cursor page :link Non-active, unvisited line-height * cue direction page-break-inside links without mouse over. vertical-align cue-before empty-cells quotes cue-after :visited Visited links Miscellaneous play-during font speak :lang(lang) Element with text of content azimuth font-family speak-header language quot;langquot; quotes elevation font-stretch text-align counter-reset speech-rate font-size text-indent counter-increment voice-family marker-offset pitch font-size-adjust text-transform list-style * pitch-range font-style volume all projection list-style-type stress font-variant white-space braille screen list-style-image richness font-weight widows list-style-position speak-punctuation embossed speech speak-numeral letter-spacing word-spacing handheld tty Shorthand properties line-height Available free from print tv are marked with * ILoveJackDaniels.com