CSS Reset: Re-sets the default style for HTML tags. (1) Reset the calculation method of the box model * {box-sizing:border-box;} (2) Reset the default font for all elements 14px/1.42857143 "Helvetica Neue" (3) body { margin:0; Color: #333; Background-color: #fff;} (4) H1~h6 {font-size:xxpx; margin-top:20px/10px; margin-botton:10px;} (5) A {color: #xxxxx; Text-decoration:none;}
CSS layout Traps-the margin-top of child elements is out of bounds: if the parent element does not have a top border/margin, the margin-top of the first child element will be out of bounds! Best solution:. parent2:before { content: ' ; display:table;} The best solution for all child elements in the parent element due to the floating effect: Parent:after { content: ' ; display:table; Clear:both;}
Global CSS styles provided by 6.Boostrap--button-related style hints: button-related styles can be used for button/input/a three elements . BTN Set the button's padding, margin, font, Border -------------------------------------------------------------------- . Btn-default Set the color of the button, background, border bootstrap five common colors: . btn-warning the button for the warning color (orange-yellow) . Btn-danger Danger Color ( Red) button. btn-info hint color (light blue) button. btn-success the button of the success Color (green) . btn-primary button with base color (dark blue) Bootstrap four sizes: . Btn-lg Large button (Large) default default size . BTN-SM Small button (small) . Btn-xs Super Small button (extra small)
1. Global CSS style--pictures . img-circle border-radius:50% . img-rounded border-radius:6px; . Img-thumbnail Border padding . img-responsive max-width Display
2. Global CSS style--text. text-warning. text-success. Text-danger. Text-info- ------------------. Text-lowercase text-uppercase. Text-capitalize-------------------. Text-left. Text-center. Te Xt-right right-aligned. Text-justify (both ends) adjusts the alignment---------------------. bg-warning. bg-success. Bg-danger. Bg-info. bg- Primary----------------------. Pull-left float:left; . pull-right Float:right; . clearfix Clear:both;-----------------------. Show Display:block; . hidden Display:none;
table global style. Table width margin-bottom . Table>td . table-bordered border:1px solid #ddd; . table-condensed the cell padding 8px to 5px, the content looks "compact" . table-striped striped table with a light background color added to the odd tr . Table-hover when the mouse hovers over the TR, add a light background color . table-responsive Responsive Table--the screen becomes hourly and a horizontal scrollbar appears--the class cannot be used for <table>, can only be used on its parent element <Div> ! -------------------------------------------------------------- used in TR and TD class-- Webstorm is not prompted by default. The danger background color is light red, and after hovering it turns dark red. The warning background color is yellowish, and after hovering it turns dark yellow. Info background is light blue, and it turns dark blue after hovering. Success The background color is pale green and becomes dark green after hovering. Active background color dimmed and turned dark gray after hover
What are the bootstrap changes to the default style of HTML tags?