zoukankan      html  css  js  c++  java
  • CSS(之五)

    CSS应用及兼容性处理

    菜单制作实例

    空链接: <a href="javascript;">乔丹</a>

    网页背景颜色:

          body

         {

         background-color:#CFC

         }

    ul没有图标

        ul

        {

        list-stype-type:none   

        }

    标签左面顶格

       *    所有

      {

      padding:0px;

      margin:0px;

      font-family:"微软雅黑“;

      }

    超链接没有下划线

       a

      {

       test-decoration:none;

       color:#FFF;      (超链接白色)

      }

      a:hover

      {

      color:#FF0;  (鼠标放上去后颜色是黄色)

      }

     class等于litem子元素a的超链接

       .litem

        {

        height:

             (宽度放在上面,a便签设置padding后,不会撑开。放在a标签中会撑开)

        }

       .litem>a

       {

       background-color:  ;

       height:30px;   (高度不放在父标签,父标签是整个li)

       display:block;  (变为块级元素,是的前面的设置对行内元素生效)

      line-height:30px;  (选择方块高度,是的文字垂直居中)

      border-left:solid 12px #711515;

      padding-left:5px; (文字向后去)

      }

      .uiyem li

      {

      border:solid 1px;    (li下面有下划线)

      }

      .litem>a:hover

      {

      backgroud-color:    ;   (鼠标放上去后北京颜色改变)

      }

    网页布局举例

     {

      margin:0px auto;   (上下为0间距,div左右自动居中)

      }

     {

    float:left;

     }

     {

      clear:both;  (清除浮动的影响)

     }

    例三:标题、图文、列表

    {

     line-height:26px;  (可以增加行间距)

     }

    兼容性问题

    www.cnblogs.com/zhutianxiang/archive/2012/01/19/2320349.html

    不同浏览器对代码的解析不同。主要取决于浏览器内核。

    IE (IETester) Opera Chrome Safari Firefox  (其他一些国产浏览器都是基于IE内核)

    50%兼容性问题由IE6引起。

    html5 支持IE 9以上

    上下margin重合:margin-bottom:30px; margin-top:30px, 实际效果 30px   左右div 可以相加;

    超链接属性: love hate 原则    link  visited  hover acive  (前后顺序)  a:link  a:visited a:hover  a:active

  • 相关阅读:
    English,The Da Vinci Code, Chapter 23
    python,meatobject
    English,The Da Vinci Code, Chapter 22
    English,The Da Vinci Code, Chapter 21
    English,The Da Vinci Code, Chapter 20
    English,The Da Vinci Code, Chapter 19
    python,xml,ELement Tree
    English,The Da Vinci Code, Chapter 18
    English,The Da Vinci Code, Chapter 17
    English,The Da Vinci Code, Chapter 16
  • 原文地址:https://www.cnblogs.com/hjzou/p/4842176.html
Copyright © 2011-2022 走看看