Một số template web đẹp


Đây là một số template mà mình sưu tập được.

web template

Một mẫu web trong bộ sưu tập

DOWNLOAD

HTML and JavaScript for visual learners


HTML and JavaScript for visual learners

0970747926.01._SCLZZZZZZZ_

Download tại đây

Bài 10: CSS padding


Trước đó : Bài 9

CSS padding sẽ định nghĩa khoảng trống giữa mép của các phần tử tới các phần tử con hoặc nội dung bên trong. Chúng ta không thể gán giá trị âm cho thuộc tính này. Cũng giống như margin thuộc tính padding cũng tương ứng với 4 phía của phần tử.

Tương ứng với 4 phía của phần tử chúng ta có 4 thuộc tính padding tương ứng đó là:

  1. padding-top:
  2. padding-right:
  3. padding-bottom:
  4. padding-left:

Các giá trị có thể gán cho các thuộc tính này là : % hoặc length

Để viết cho gọn chúng ta cũng có thể viết thuộc tính padding dưới dạng shorthand.

div.padding {
  padding: 5px 3px 2px 8px;
}
Posted in CSS

Bài 9: Thuộc tính đường bao ngoài (Outline)


Trước đó : Bài 8

Thuộc tính Outline sẽ vẽ một đường bao ngoài toàn bộ một phần tử HTML, đối với phần tử có đường viền (border) thì đường bao này sẽ bao trọn đường viền của phần tử đó. Cũng tương tự như đường viền bạn có thể đặt cho nó các thuộc tính về màu săc, độ lớn và kiểu.

Có một điều cần chú ý là các thuộc tính của đường bao này có thể không được hỗ trợ trên IE

01Đặt thuộc màu cho đường bao

Nếu muốn đặt màu cho đường bao chúng ta có thể sử dụng thuộc tính outline-color:

p {
  outline-color: #CC0000;
}

02Đặt độ rộng cho đường bao.

Tương tự như đường viền, để đặt độ rộng cho đường bao chúng ta đặt giá trị độ lớn cho thuộc tính outline-width:

p {
  outline-width: 2px;
}

03Chọn kiểu đường bao

Để chọn kiểu cho đường bao chúng ta sẽ đặt lần lượt các giá trị cho thuộc tính outline-style:

p {
  outline-style: dotted;
}
STT outline-style
1 none
2 hidden
3 dotted
4 dashed
5 solid
6 double
7 groove
8 ridge
9 inset
10 outset

Để cho gọn chúng ta cũng có thể viết các giá trị của thuộc tính Outline dưới dạng shorthand như sau:

div.outline {
  outline: 1px solid #000;
}

Bài tiếp theo : Bài 10

Posted in CSS

Bài 8: Các thuộc tính của margin


Trước đó : Bài 7

Thuộc tính margin sẽ định nghĩa khoảng trắng bao quanh một phần tử HTML. Nó có thể dùng giá trị âm để lồng nội dung vào với nhau. Tương ứng với 4 phía của một phần tử chúng ta có 4 thuộc tính tương ứng. Mặt khác để viết cho gọn chúng ta cũng có thể dùng cách viết giản lược để định nghĩa các giá trị cho thuộc tính margin.

Đối với các trình duyệt Netcape và IE thì giá trị mặc định của thuộc tính margin là 8px. Nhưng Opera thì không hỗ trợ như vậy. Để cho thống nhất chúng ta có thể đặt margin mặc định cho toàn bộ các phần tử.

Các giá trị mà thuộc tính margin có thể nhận được đó là: auto, length, %. Chúng ta đặt giá trị nào là tùy thích cộng với việc tương ứng tỉ lệ với các phần tử khác.

Tương ứng với 4 phía ta có 4 thuộc tính:

  1. margin-top:
  2. margin-right:
  3. margin-bottom:
  4. margin-left:

Để cho gọn chúng ta cũng có thể việt thuộc tính margin dưới dạng shorthand

div.margin {
  margin: 10px 4px 5px 9px; /* top  |  right  |  bottom  |  left*/
}

Bài tiếp theo : Bài 9

Posted in CSS