Trang chủ Liên hệ Sơ đồ  
 
Trang chủ 1001 Mẫu Web Thiết kế Web Lập trình Quản trị Web Web & Hosting Hình nền Blog Icon & Logo
 
 
     
       Mẫu web mới nhất
Xem | ID: 5076
Xem | ID: 1003235
HƯỚNG DẪN
Phần mềm :
Trình độ : Beginer
Đánh giá : /

Crop ảnh bằng CSS và HTML
(Thứ Sáu, 29/01/2010-3:23 PM)

Chúng ta có ví dụ sau:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>untitled</title>

<style type="text/css" media="screen">
div.crop {
  height: 300px;
  width: 350px;
  overflow: hidden;
}
div.crop img {
  margin: -300px -200px 0 0;
}
</style>

</head>

<body>

<div class="crop">
<img src="/paper-sculpture-large.jpg" class="crop" alt="Paper Sculpture Large">
</div>

</body>
</html>

Chúng ta sẽ quy định kích thước của khung Crop trong đoạn mã CSS sau:

div.crop {
height: 300px;
width: 350px;
overflow: hidden;
}

và lấy một vùng ảnh nào đó

div.crop img {
margin: -300px -200px 0 0;
}
Theo cssyeah.com
   "Tìm hiểu Vũ trụ mênh mông huyền bí"     www.bachkhoatrithuc.vn
 In bài này  Gửi bài viết
    Các bài trước
    Các bài sau
      Bài quan tâm nhiều nhất  

    Download phần mềm 
    được ưa dùng  nhất