[Code] Tạo bố trí thẻ div PunBB và phpBB2

PunBB hoặc phpBB2 diễn đàn về
kiến thức cơ bản của CSS và HTML Khi bạn muốn để có được tối đa của diễn đàn của bạn, bạn cần phải sử dụng PunBB hoặc phpBB2 Tại sao ? PunBB và phpBB2 allowe chúng tôi để chỉnh sửa mẫu. Allowes bạn chỉnh sửa khá nhiều tất cả các phần. Tuy nhiên, để làm cho mọi việc dễ dàng hơn bạn cũng có thể đặt các thẻ div trên tất cả các thẻ Div có thể là một trong các thẻ được sử dụng nhiều nhất trong html. Allowes bạn để cung cấp cho một phần nhất định một nền tảng, sắp xếp mọi thứ và nhiều hơn nữa. Hôm nay tôi sẽ dạy làm thế nào để làm cho một thẻ div cho một bố trí, một nền tảng. Như bạn có thể thấy trong các mẫu của bạn, bạn thấy một điều rất nhiều như

Code:

[font=Courier New]<div class="main">

[/font]

Khi bạn xóa tất cả các thẻ lớp div, bạn sẽ nhận được một diễn đàn với các văn bản chỉ là một số, một màu nền và có thể một số hình ảnh Bạn có thể làm điều này nếu bạn muốn để làm cho bố cục của riêng bạn, như Jalokim và tôi. Nhưng ở đó bạn sẽ cần phải biết làm thế nào để làm cho thẻ div của bạn lớp đầu tiên của tất cả, bạn sẽ cần phải tạo ra nó lần thứ hai của tất cả các bạn sẽ cần phải thêm nó tạo ra nó đi đến trang phong cách CSS của diễn đàn của bạn có thể có một số CSS trong nó đã Đoạn mã CSS chúng tôi là gona thêm trông như thế này . Bạn có thể đặt một số nội dung thêm về nó, nhưng thats không phải nessencary. Đây là mã cơ bản bạn cần.

Code:

[font=Courier New].(Put a name here, doesnt matter what one)  {
  background:(Type in the background color, in hex (#rrbbgg);
  color:(Type in the font color you want);
  width:(Type in the width you want);
  height:(Type in the height you want);
  font-size:(Type in the font size you want);

[/font]


Bây giờ bạn có thể thêm những thứ như

Code:

[font=Courier New]-moz-border-radius:

[/font]

(CSS3 mã này, không chỉ là CSS)
và các công cụ như thế Nhưng im gona đi với một trong những cơ bản bây giờ Vì vậy, bạn điền vào trong Ví dụ:

Code:

[font=Courier New].lol  {
  background:#FF2A00;
  color:#C5C5C5;
  width: 50%;
  height:30px;
  font-size:13px;
}

[/font]

bạn chỉ cần thực hiện bố trí div riêng của bạn?
Có bạn đã làm.
Dễ dàng phải không ? Những gì chúng tôi gona làm bây giờ là thêm nó vào trong HTML của bạn Thats thực sự đơn giản Đây là mã chúng ta cần

Code:

[font=Courier New]<div class="(name of your div tag in the CSS)>(content)</div>

[/font]

Bây giờ hãy vào trang mẫu hoặc html mà bạn muốn nó có.
Giống như ví dụ này trong

Code:

[font=Courier New]<div class="lol">This is a div layout ^^<br />
Olé!</div>

[/font]

Kết quả sẽ là:

một số điều khác mà bạn có thể thêm vào CSS của bạn cho thẻ div :

Code:

[font=Courier New]-moz-border-radius: 10px; (Round corners instead of sharp)
  -webkit-border-radius: 10px; (Round corners instead of sharp)
  border: 2px solid #000; (a border)
  padding: 10px 10px 10px 10px; (padding is the position of your div layout in the website: top-left-bottom-right)
  margin: 50px 70px 10px 10px (margin is the position of your content in the tag it self)
          box-shadow: 10px 10px 5px #888; (Shadow undernead the div tag, to give it a position it also needs padding)
And to make a background with opacity, dont use the normal background thing but use
          background: rgb(255, 0, 0) ; opacity: 0.2;

[/font]

Nguồn: Help.Forumotion.com Bản Dịch