您的位置：首页 > Web前端 > CSS

html css学习笔记-对齐 尺寸 分类

2015-05-16 10:31 197 查看 
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
         *{margin: 0px;padding: 0px;}
        /*.div{*/
          /*width: 70%;*/
          /*height:1000px ;*/
          /*background-color: palegreen;*/
            /*居中*/
          /*margin-left: auto;*/
          /*margin-right: auto;*/
      /*}*/
       /*position对齐*/
         /*.div{*/
             /*width: 70%;*/
             /*height:1000px ;*/
             /*background-color: palegreen;*/
             /*position: absolute;*/
             /*left:0px;*/
         /*}*/
         /*利用float left 对齐*/
         .div{
             width: 70%;
             height:100px ;
             background-color: palegreen;
             float: left;
         }

         p{
             width:100px ;
         }
         /*行高正常*/
        .p1{line-height: normal;max-width: 300px;min-width: 150px;}
        /*行高变成原来的一半*/
        .p2{line-height: 50%;}
        /*行高变成正常情况下的一倍*/
        .p3{line-height: 200%;}
        /*li横向显示，可以用li 来做导航栏*/
        li{
            display: inline;
        }
    </style>
</head>
<body>
 <!--
   对齐方法：
     margin:
     positon:
     float:
   尺寸
     height:
     line-height:设置行高
     max-height:
     max-width
     min-width
     min-height
     width:
   分类：
     clear
     cursor
     display
     float:
     positon:
     visibility:

-->
 <div class="div">

 </div>

  <p class="p1">戏4339小游戏7k77小游戏43399小游戏小游戏传奇霸业
      纵横中文网幻剑书盟小说阅读网我爱评书网红袖添香起点中文网
      天猫女装天猫电器城京东商城天猫美妆当当网1号店
      虾米音乐广场舞酷我音乐动听音乐酷狗音乐豆瓣音乐
  </p>
 <br/><br/><br/>
 <p class="p2">戏4339小游戏7k77小游戏43399小游戏小游戏传奇霸业
     纵横中文网幻剑书盟小说阅读网我爱评书网红袖添香起点中文网
     天猫女装天猫电器城京东商城天猫美妆当当网1号店
     虾米音乐广场舞酷我音乐动听音乐酷狗音乐豆瓣音乐
 </p>
 <br/><br/><br/>
 <p class="p3">戏4339小游戏7k77小游戏43399小游戏小游戏传奇霸业
     纵横中文网幻剑书盟小说阅读网我爱评书网红袖添香起点中文网
     天猫女装天猫电器城京东商城天猫美妆当当网1号店
     虾米音乐广场舞酷我音乐动听音乐酷狗音乐豆瓣音乐
 </p>

 <ul>
     <li>abc</li>
     <li>abc</li>
     <li>abc</li>
 </ul>
</body>

</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航