10/10/2018, 00:02

+++ Quy TrÌnh TẠo 1 Site ThuẦn Css +++++

Chắc các bạn cũng biết và trải qua quá trình dựng layout, sau khi cắt template từ Photoshop. Quá trình này rất mất thời gian để co kéo ảnh, chèn ảnh, làm nền table ....., đặc biệt là với những bản thiết kế có nhiều bảng.

Hiện nay rất nhiều các trang sử dụng thuần CSS. Mọi giá trị định vị trong toàn bộ web đều được thiết lập cố định sẵn. Nếu có chỉnh sửa thì chỉ cần sửa 1 file .CSS này là xong. Mở file HTML của họ thì ko có 1 thẻ table nào.

Cho mình hỏi: Vậy thì ban đầu khi dựng thì ng` ta vẫn phải sử dụng table rồi sắp xếp layout. Sau đó mới dựa vào các thông số pixel table đã có rồi mới tạo mới 1 file CSS. Có nghĩa là CSS được tạo sau khi tạo bảng hoàn chỉnh. Có phải vậy không? Bạn nào biết thì chỉ giúp mình nhé.

Rất vui khi cùng các bạn thảo luận vấn đề này.

Tham khảo:
http://www.htmldog.com/articles/suck...focus/example/
http://solardreamstudios.com/learn/css/footerstick/
http://www.themaninblue.com/experiment/footerStickAlt/
http://stopdesign.com/present/2004/ddw-seattle/tables/
http://www.csszengarden.com/
bathazar viết 02:10 ngày 10/10/2018
Dà dà... Cho em được quảng bá site một chút http://www.vietnamopentour.com.vn

Mình làm CSS luôn. Hông có dùng table để định cấu trúc của site . Thông thường làm CSS thì phải hình dung hơi nhiều và căn chỉnh hơi khó so với table. Table cứ thế nó ra rồi khỏi nghĩ nhiều.

Làm CSS thì nhớ 1 điều căn bản là ID được dùng 1 lần còn Class được dùng nhiều lần. Điều này chắc nhiều bạn biết rồi nói cho newbie chú ý thôi [Những ai giống mình chẳng hạn... he he]
nguyencaophuong viết 02:04 ngày 10/10/2018
Newbie's Question: Thuần CSS thì được cái giầy hả các pác ?
mtt333 viết 02:13 ngày 10/10/2018
Được gửi bởi nguyencaophuong
Newbie's Question: Thuần CSS thì được cái giầy hả các pác ?
Không phải là chuyên gia làm web nhưng mình phỏng đoán được một số cái lợi sau:
- Tách biệt nội dung và cách trình bày.
- Thay đổi cách trình bày thì chỉ cần đổi 1 lần trong css.
- Tiết kiệm kích thước trang.
- Rõ ràng hơn, nếu dùng table thì thực sự rất lằng nhằng.
- Mềm dẻo hơn, với css có thể đặt các khối ở bất kỳ đâu trong trang, không bị ràng buộc trong 1 cell của table.
Điều mình băn khoăn là tính tương thích giữa các trình duyệt đến đâu.
Trịnh Văn Hâir viết 02:12 ngày 10/10/2018
Được gửi bởi bathazar
Mình làm CSS luôn. Hông có dùng table để định cấu trúc của site . Thông thường làm CSS thì phải hình dung hơi nhiều và căn chỉnh hơi khó so với table. Table cứ thế nó ra rồi khỏi nghĩ nhiều.
Vậy cách thức làm là thế nào? Hình dung thì nghe mung lung quá trùi. huhuhuhuhu.........
vnDev viết 02:12 ngày 10/10/2018
Tui nho' la co' mot book cua SitePoint da cover va'n de` nay rat ro~, ba'c nao muo'n la`m thi` kie'm doc choi !
lovephp viết 02:14 ngày 10/10/2018
Nói chung cũng phải dựa vào gian diện trên thiết kế để canh chỉnh cho chính xác! Nhưng nếu muốn đơn giản và khỏi lo browser hổ trợ hay không thì dùng bảng.

Được gửi bởi bathazar
Dà dà... Cho em được quảng bá site một chút http://www.vietnamopentour.com.vn
Ặc, vào trang du lịch VN mà cứ ngỡ đi tuor Hàn Quốc, hix!
gate2vn viết 02:09 ngày 10/10/2018
ban đầu, chuyển từ table qua CSS sẽ hơi khó. Nhưng làm sẽ quen thôi. Nếu bạn nào để ý đến SEO, CSS được tối ưu tốt hơn table nhiều. Những ưu điểm chủ yếu đã được bạn mtt333 list rồi. Còn về trình duyệt, tôi đã test với Safari, Firefox, Opera đều ngon lành. Ở IE, có thể bạn sẽ cần thêm 1 vài options, nhưng code cẩn thận là cũng tốt cả thôi
Trịnh Văn Hâir viết 02:02 ngày 10/10/2018
Ơ đang nói cách làm các bác lại đi đâu thế????? Biết nó hay thì mới dùng chứ. Em muốn các bác hia sẻ kinh nghiệm trong quá trình làm. Chẳng hạn từ bản layout từ shop, các bác đã làm thế nào để chuyển sang htm và vào css. Em mới biết 2 cách:
1. Đo pixel trên PS rồi ghia vào css
2. Export từ PS thẳng qua file htm rồi dùng pixel table trong htm này mà vào css.
Các bác làm thế nào vậy, cả cách thức khi ghi vào css nữa
gate2vn viết 02:16 ngày 10/10/2018
tất nhiên thế nào cũng phải đo 1 image khi đưa vào trang web cũng cần có kích cỡ của nó. tuy nhiên ko cần thiết phải đo tất cả. Ví dụ, bạn cần quan tâm đến
- kích thước bao bên ngoài
- kích thước banner, menu
- tỷ lệ tương ứng của ảnh so với text trong trang web

còn việc ghi vào css, chưa hiểu ý bạn lắm chúng ta sẽ tạo ra các file .css trong đó sẽ chứa các class quy định các thuộc tính mà chúng ta cần dùng. Nếu bạn ko rành về hand-code thì DreamWeaver hỗ trợ cho bạn rất tốt ở điểm này. dùng GUI của nó là ok
Bài liên quan
0