API tools faq
paste
Venciity

[CSS] presentation ДОМАШНО - 2 задача CSS

Venciity
Feb 7th, 2014
156
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 9.82 KB | None | 0 0
raw download clone embed print report
  1. .clearfix, body header div#header-container, body header nav, body header nav ul, body header nav ul li ul.sub-nav-list, body section, body aside {
  2.     zoom: 1;
  3. }
  4.  
  5.     .clearfix:after, body header div#header-container:after, body header nav:after, body header nav ul:after, body header nav ul li ul.sub-nav-list:after, body section:after, body aside:after, .clearfix:before, body header div#header-container:before, body header nav:before, body header nav ul:before, body header nav ul li ul.sub-nav-list:before, body section:before, body aside:before {
  6.         content: "\0020";
  7.         display: block;
  8.         height: 0;
  9.         overflow: hidden;
  10.     }
  11.  
  12.     .clearfix:after, body header div#header-container:after, body header nav:after, body header nav ul:after, body header nav ul li ul.sub-nav-list:after, body section:after, body aside:after {
  13.         clear: both;
  14.     }
  15.  
  16. body, header, section, footer, article, h1, h2, h3, h4, h5, h6, input, button, label, p, fieldset, nav, ul, li, a, span, strong, em {
  17.     margin: 0;
  18.     padding: 0;
  19.     border: 0;
  20. }
  21.  
  22. div, h1, h3, h4, h5, h6, header, footer, body, section, nav, article, aside {
  23.     display: block;
  24. }
  25.  
  26. p {
  27.     color:white;
  28. }
  29.  
  30. body {
  31.     font: 14px normal Arial;
  32.     color:white;
  33.     background: #cb94ef; /* Old browsers */
  34.     /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  35.     background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSI5JSIgc3RvcC1jb2xvcj0iI2NiOTRlZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjI3JSIgc3RvcC1jb2xvcj0iIzlmMWFmMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM5YTE5ZWEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  36.     background: -moz-linear-gradient(top,  #cb94ef 9%, #9f1af2 27%, #9a19ea 100%); /* FF3.6+ */
  37.     background: -webkit-gradient(linear, left top, left bottom, color-stop(9%,#cb94ef), color-stop(27%,#9f1af2), color-stop(100%,#9a19ea)); /* Chrome,Safari4+ */
  38.     background: -webkit-linear-gradient(top,  #cb94ef 9%,#9f1af2 27%,#9a19ea 100%); /* Chrome10+,Safari5.1+ */
  39.     background: -o-linear-gradient(top,  #cb94ef 9%,#9f1af2 27%,#9a19ea 100%); /* Opera 11.10+ */
  40.     background: -ms-linear-gradient(top,  #cb94ef 9%,#9f1af2 27%,#9a19ea 100%); /* IE10+ */
  41.     background: linear-gradient(to bottom,  #cb94ef 9%,#9f1af2 27%,#9a19ea 100%); /* W3C */
  42.     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cb94ef', endColorstr='#9a19ea',GradientType=0 ); /* IE6-8 */
  43.  
  44. }
  45.  
  46.     body header {
  47.         padding-top: 25px;
  48.         padding-bottom: 5px;
  49.         padding-right: 15px;
  50.         padding-left: 15px;
  51.     }
  52.  
  53.         body header div#header-container div#logo-container {
  54.             float: left;
  55.             position: relative;
  56.         }
  57.  
  58.         body header div#header-container div#reg-form-container {
  59.             float: right;
  60.             position: relative;
  61.             right: 5%;
  62.             top: 50%;
  63.         }
  64.  
  65.             body header div#header-container div#reg-form-container div {
  66.                 text-align: right;
  67.             }
  68.  
  69.                 body header div#header-container div#reg-form-container div label {
  70.                     width: 50px;
  71.                     margin: 5px;
  72.                 }
  73.  
  74.                 body header div#header-container div#reg-form-container div input {
  75.                     width: 130px;
  76.                     border: 1px solid #603382;
  77.                     border-radius: 10px;
  78.                     padding: 2px 5px;
  79.                     margin: 5px;
  80.                 }
  81.  
  82.             body header div#header-container div#reg-form-container button {
  83.                 margin-left: auto;
  84.                 margin-right: auto;
  85.                 font-weight: bold;
  86.                 border: 1px solid #603382;
  87.                 border-style: outset;
  88.                 border-radius: 10px;
  89.                 padding: 5px 8px;
  90.             }
  91.  
  92.                 body header div#header-container div#reg-form-container button:hover {
  93.                     background-color: #8949b9;
  94.                     border-style: inset;
  95.                 }
  96.  
  97.         body header nav {
  98.             display: inline-block;
  99.             width: 75%;
  100.             margin: 20px 20px 20px 20px;
  101.             padding: 12px;
  102.             border: 2px solid #000;
  103.         }
  104.  
  105.             body header nav ul.nav-list {
  106.                 list-style-type: none;
  107.             }
  108.  
  109.             body header nav ul li {
  110.                 float: left;
  111.                 margin: 0;
  112.             }
  113.  
  114.                 body header nav ul li a {
  115.                     text-decoration: none;
  116.                     padding: 0 10px 0 10px;
  117.                     color: white;
  118.                     font: 1.4em normal Arial;
  119.                 }
  120.  
  121.                     body header nav ul li a.selected {
  122.                         font-weight: bold;
  123.                     }
  124.  
  125.                 body header nav ul li:hover > a {
  126.                     text-decoration: underline;
  127.                     color: #a8a8a8;
  128.                 }
  129.  
  130.                     body header nav ul li:hover > a + ul {
  131.                         display: block;
  132.                     }
  133.  
  134.                 body header nav ul li ul.sub-nav-list {
  135.                     position: absolute;
  136.                     display: none;
  137.                     background-color: rgba(179, 94, 243, 0.9);
  138.                     border-radius: 5px;
  139.                 }
  140.  
  141.                 body header nav ul li ul li {
  142.                     float: none;
  143.                     margin: 0 15px;
  144.                     padding: 10px 0;
  145.                     border-bottom: 1px solid black;
  146.                 }
  147.  
  148.                     body header nav ul li ul li:last-of-type {
  149.                         border-bottom: none;
  150.                     }
  151.  
  152.                     body header nav ul li ul li > a {
  153.                         font-size: 1.2em;
  154.                         color: #fff;
  155.                     }
  156.  
  157.     body section {
  158.         width: 75%;
  159.         float: left;
  160.         color: black;
  161.     }
  162.  
  163.         body section article {
  164.             margin: 20px;
  165.             padding: 20px;
  166.             border: 1px solid black;
  167.         }
  168.  
  169.             body section article header {
  170.                 background: none;
  171.                 padding: 5px;
  172.             }
  173.  
  174.                 body section article header h1 {
  175.                     font-size: 1.4em;
  176.                     padding: 0;
  177.                 }
  178.  
  179.             body section article footer {
  180.                 padding: 5px;
  181.             }
  182.  
  183.                 body section article footer p {
  184.                     font-size: 16px;
  185.                     text-align: right;
  186.                     font-weight: normal;
  187.                 }
  188.  
  189.                     body section article footer p time {
  190.                         font-family: Consolas, 'Lucida Console', 'DejaVu Sans Mono', monospace;
  191.                     }
  192.  
  193.                     body section article footer p a {
  194.                         color:#eb32d7;
  195.                         text-decoration: none;
  196.                     }
  197.  
  198.                         body section article footer p a:hover {
  199.                             text-decoration: underline;
  200.                         }
  201.  
  202.  
  203.     body aside {
  204.         float: left;
  205.         width: 20%;
  206.         margin: 20px;
  207.     }
  208.  
  209.         body aside > ul {
  210.             list-style-type: none;
  211.         }
  212.  
  213.             body aside > ul > li {
  214.                 margin: 15px 0;
  215.                 padding: 15px;
  216.                 border: 1px solid black;
  217.                 border-radius: 5px;
  218.             }
  219.  
  220.                 body aside > ul > li h2 {
  221.                     font-size: 1.1em;
  222.                     font-weight: bold;
  223.                 }
  224.  
  225.                 body aside > ul > li p {
  226.                     margin-top: 10px;
  227.                     margin-right: 5px;
  228.                     margin-bottom: 10px;
  229.                     margin-left: 5px;
  230.                     font-size: 14px;
  231.                 }
  232.  
  233.                     body aside > ul > li p a {
  234.                         color: #c600ff;
  235.                         text-decoration: none;
  236.                     }
  237.  
  238.                     body aside > ul > li p strong {
  239.                         color: #cb94ef;
  240.                         font-weight: bold;
  241.                         font-style: normal;
  242.                     }
  243.  
  244.                     body aside > ul > li p em {
  245.                         color: #c600f9;
  246.                         font-weight: normal;
  247.                         font-style: italic;
  248.                     }
  249.  
  250.                 body aside > ul > li ul {
  251.                     list-style-type: none;
  252.                     margin-top: 10px;
  253.                     margin-right: 0;
  254.                     margin-bottom: 10px;
  255.                     margin-left: 0px;
  256.                 }
  257.  
  258.                     body aside > ul > li ul li {
  259.                         margin-top: 5px;
  260.                         margin-left: 10px;
  261.                         margin-bottom: 0px;
  262.                         margin-right: 0px;
  263.                         background: url(../IMAGES/li-dot.png) no-repeat;
  264.                         background-position: 0 50%;
  265.                         padding-left: 25px;
  266.                     }
  267.  
  268.     body footer {
  269.         clear: both;
  270.         padding-top: 15px;
  271.         padding-bottom: 25px;
  272.         padding-right: 0px;
  273.         padding-left: 0px;
  274.     }
  275.  
  276.         body footer p {
  277.             font-size: 1.2em;
  278.             font-weight: bold;
  279.         }
  280.  
  281. .Telerik {
  282.     text-align:center;
  283. }
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!