DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS基礎知識 >> 8.1 CSS圖片大小
8.1 CSS圖片大小
編輯:CSS基礎知識     

一、圖片大小width和height

在之前的課程例子中,我們接觸了width和height這兩個屬性,這兩個屬性分別是用來設置元素的寬度和高度的。

在CSS中,對於圖片的大小,我們也是用width和height來定義。

語法:

 
    width:像素值;
    height:像素值;

說明:

在CSS初學階段,全部都是使用像素作單位,在CSS進階階段我們會深入講解其他CSS單位

舉例:

在線測試
 
<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style type="text/css">
        img{width:60px;height:60px;}
    </style>
</head>
<body>
    <img src="../App_images/lesson/run_cj/cartoongirl.gif" alt=""/>
</body>
</html>

在浏覽器預覽效果如下:

分析:

不管圖片的實際大小是多少,你都可以使用width和height來定義你想要的高度和寬度。大家別傻乎乎的還用PS做好高度和寬度才敢把那張圖片用到頁面上。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved