zoukankan      html  css  js  c++  java
  • 设置每个li的margin距离(巧设计)

               当我们在一个div里面包含头、中(ul和li)、尾i的话,如果设置每一个li的margin属性的话,那么虽然每个li都有距离了,但是整体的间距是不和谐的,这里需要设置ul的margin属性,代码如下:

    <div class="contain">
            <div class="head"></div>
            <div class="main">
                <ul>
                    <li>1</li>
                    <li>2</li>
                    <li>3</li>
                </ul>
            </div>
            <div class="foot"></div>
    </div>

    CSS样式:

         .contain
            {
                78px;
                border: 1px solid red;
            }
            .contain .head
            {
                78px;
                height: 12px;
                background-color: Orange;
            }
            .contain .main
            {
                78px;
            }
            .contain .main ul
            {
                margin: 0;
                padding: 0; /*ff*/
                margin-bottom: 10px; /*离下面的距离*/
            }
            .contain .main ul li
            {
                39px;
                height: 35px;
                margin: 0 auto;
                margin-top: 10px; /*离顶部的距离*/
                list-style-type: none;
                border: 1px solid red;
            }
            .contain .foot
            {
                78px;
                height: 12px;
                background-color: Orange;
            }

  • 相关阅读:
    JSP 和Servlet 有有什么关系?
    转发(forward)和重定向(redirect)的区别?
    get和post请求的区别?
    软件的三大类型-单机类型、BS类型、CS类型
    Redis集群搭建
    Tomcat网站上的core和deployer的区别
    spring 事务处理
    mybatis ${}与#{}的区别
    Quartz--Spring 定时任务
    @JsonSerialize @JsonIgnoreProperties @JsonIgnore @JsonFormat
  • 原文地址:https://www.cnblogs.com/dreamhouse/p/2921697.html
Copyright © 2011-2022 走看看