zoukankan      html  css  js  c++  java
  • 4.24css

    一、今日学习内容

     

    CSS 尺寸 (Dimension)

     

    所有CSS 尺寸 (Dimension)属性

    属性描述
    height 设置元素的高度。
    line-height 设置行高。
    max-height 设置元素的最大高度。
    max-width 设置元素的最大宽度。
    min-height 设置元素的最小高度。
    min-width 设置元素的最小宽度。
    width 设置元素的宽度。

    设置元素高度

    复制代码
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8"> 
    <title>1</title> 
    <style>
    img.normal
    {
        height:auto;
    }
    img.big
    {
        height:120px;
    }
    p.ex
    {
        height:100px;
        100px;
    }
    </style>
    </head>
    
    <body>
    <img class="normal" src="logocss.gif" width="95" height="84" /><br>
    <img class="big" src="logocss.gif" width="95" height="84" />
    <p class="ex">这个段落的高和宽是 100px.</p>
    <p>这是段落中的一些文本。这是段落中的一些文本。
    这是段落中的一些文本。这是段落中的一些文本。
    这是段落中的一些文本。这是段落中的一些文本.</p>
    </body>
    </html>
    复制代码

     使用百分比设置图像高度

    复制代码
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8"> 
    <title>1</title> 
    <style>
    html {height:100%;}
    body {height:100%;}
    img.normal {height:auto;}
    img.big {height:50%;}
    img.small {height:10%;}
    </style>
    </head>
    
    <body>
    <img class="normal" src="logocss.gif" width="95" height="84" /><br>
    <img class="big" src="logocss.gif" width="95" height="84" /><br>
    <img class="small" src="logocss.gif" width="95" height="84" />
    </body>
    </html>
    复制代码

    二、遇到的问题

     暂无

    三、明日计划

    暂无

  • 相关阅读:
    2016第17周四
    2016第17周三
    2016第17周二
    OSGI框架学习
    2016年第16周日
    2016第16周六
    如何培养技术洞见力
    2016第15周四
    深入浅出ClassLoader
    Linux智能小开关rfkill
  • 原文地址:https://www.cnblogs.com/zyljal/p/14910123.html
Copyright © 2011-2022 走看看