Tải bản đầy đủ (.pdf) (7 trang)

giới thiệu về css _ học thiết kế web theo chuẩn.

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (306.75 KB, 7 trang )

Giới thiệu về CSS | Học thiết kế web theo chuẩn.
2:59:02 PM]
NAVIGATION
Đơn giản trong thiết kế
Giới thiệu Google webmaster
Thiết kế layout với Photoshop (phần 3/4)
Tạo WordPress Theme – Dựng xHTML
Quá trình tạo một trang web
Ajax-Jquery vs JavaScript
Độ cao của Div
Tạo trang web đầu tiên
Những điều nên tránh khi thiết kế trang web
Dropdown Menu với CSS
PHP CO BẢN – NÂNG CAO
tìm hiểu cú pháp và phương thức PHP
Phép toán và phát biểu có điều kiện trong php
$_POST và $_GET
Làm quen đối tượng Session
Khai báo hàm, chèn tập tin và tập tin dùng chun
Cách xử lý chuỗi, mảng, kiểu DataTime
Thao tác trên cơ sở dữ liệu MySQL
PHP và Database
Phân trang với PHP
Xóa, Cập nhật dữ liệu dạng mảng
Tạo Mailing List: PHP & Mysql
RECENT COMMENTS
Random News Popular
EMAIL ARTICLES
Giới thiệu về CSS
October 7, 2008 14 comments
CSS là gì?


CSS là chữ viết tắt của Cascading Style Sheets, nó chỉ đơn thuần là một dạng file text với
phần tên mở rộng là .css. Trong Style Sheet này chứa những câu lệnh CSS. Mỗi một lệnh
của CSS sẽ định dạng một phần nhất định của HTML ví dụ như: font của chữ, đường viền,
màu nền, căn chỉnh hình ảnh v.v
Trước đây khi chưa có CSS, những người thiết kế web phải trộn lẫn giữa các thành phần
trình bày và nội dung với nhau. Nhưng với sự xuất hiện của CSS, người ta có thể tách rời
hoàn toàn phần trình bày và nội dung. Giúp cho phần code của trang web cũng gọn hơn và
quan trọng hơn cả là dễ chỉnh sửa hơn.
Trước khi bắt đầu tìm hiểu thêm về CSS tôi muốn bạn biết một chút về thế mạnh của nó
trong việc thiết kế web. Ví dụ nếu làm việc với HTML và bạn muốn font chữ của toàn bộ
trang web là Arial. Bạn sẽ phải làm đi làm lại như thế cho tất cả các file .html mà bạn có.
Nhưng nếu bạn sử dụng CSS, thì bạn chỉ cần làm một lần và tất cà các trang khác sẽ tự
động được thay đổi.
Ba cách để định dạng trang web
Có ba cách bạn có thể sử dụng để định dạng trang web là: cục bộ, nhúng vào trang và liên
kết đến một file CSS riêng biệt. Trong thực tế thì cách cuối cùng là liên kết đến một file riêng
biệt được sử dụng phổ biến nhất. Nhưng bạn cũng nên biết về hai cách còn lại vì đôi khi bạn
cũng phải sử dụng đến nó tuy không nhiều
.
1. Cục bộ – code CSS đuợc chèn trực tiếp vào
trong thẻ HTML
Cách định dạng cục bộ là bạn sử dụng code CSS chèn trực tiếp vào thẻ HTML và chỉ có tác
CSS
CSS Cơ bản
jQuery
jQuery Cơ bản
Phát triển Web
Bài viết, kinh nghiệm
Videos
Các thể loại

WordPress
Tutorials, Hacks
HOME CÂU HỎI THƯỜNG GẶP LIÊN HỆ TÁC GIẢ BẢN QUYỀN
Giới thiệu về CSS | Học thiết kế web theo chuẩn.
2:59:02 PM]
Những bài viết có liên quan
Giới thiệu về jQuery
Giới thiệu Google webmaster
QUẢNG CÁO
Your Ad Here for Free
$20 in Free Clicks to place your ad
here. Join Free now!
www.your-site.com
Your Ad Here for Free
$20 in Free Clicks to place your ad
here. Join Free now!
www.your-site.com
Your Ad Here for Free
$20 in Free Clicks to place your ad
here. Join Free now!
www.your-site.com
Tạo WordPress Theme – Dựng xHTML (16)
chicken_roll: hahaha hay quá hết chổ trê (thanks you
very much much…) nghe anh nói đây ko
Tạo WordPress Theme – Slice hình (22)
chicken_roll: ui ui hay quá cảm ỏn nhiều học rất nhiều
từ anh và Anh CS thanks phát cho có
Tạo WordPress Theme – Search form và Random
Posts (15)
DiVIVu: @ajimoto & tuyen: Làm thế này là được bạn ạ:

<script type="text/javascript&
PHP Căn Bản – Bài 9 (40)
pham duy: Vang ban angelthao_0984884679 da noi
dung do chung t con chan chu gi nua ma khong giup
doan: ai muốn xem bằng file swf thì down KMP về mà
dùng cái này còn hay hơn media của win nhiều
Lập trình web và sự Lười nhác (23)
kien: Không còn gì để nói :-s
Tạo trang web đầu tiên (41)
ho nga: ?
ho nga: huhu sao làm web mệt dzữ vậy a hai ui…?
động lên thẻ đó.
Ví dụ
2. Nhúng vào trang web
Cách thứ hai là bạn khai báo code CSS nằm trong cặp thẻ <style></style> được đặt ở phần
<head></head> của tài liệu. Về cơ bản nó cũng chỉ có tác động cục bộ lên file mà bạn chèn
đoạn code CSS này. Nó có phạm vi ảnh hưởng lớn hơn là cách chèn cục bộ được nói ở
trên, nhưng nó không có ảnh hưởng đến các file khác trong cùng một trang web.
3. Liên kết đến một file biệt lập
Thực tế cách cuối cùng này mới là thế mạnh thực sự của CSS bởi vì bạn chỉ cần tạo ra một
file CSS và viết code chỉ một lần. Nó sẽ ảnh hưởng đến toàn bộ trang web chứ không chỉ
ảnh hưởng đến một file .html đơn lẻ hoặc chỉ một thẻ trong hàng ngàn thẻ mà bạn có. Bằng
cách này chúng ta có thể tách rời hoàn toàn những thành phần trình bày và nội dung ra khỏi
nhau. Nếu bạn viết toàn bộ code CSS trong một file và liên kết nó đến những trang còn lại,
thì việc thay đổi sửa chữa trang web trở nên cực kỳ đơn giản.
Để liên kết file CSS đến tất cả các file .html của bạn, bạn chỉ cần chèn đoạn code sau vào
giữa thẻ <head></head> của tài liệu:
Và trình duyệt sẽ tự động dùng file style_sheet.css để định dạng cho trang web của bạn. Tất
nhiên trong file style_sheet.css bạn đã viết code CSS rồi.
Điều cuối cùng bạn cần biết về 3 loại hình sử dụng CSS là

Cục bộ > Nhúng vào trang > Liên kết đến một file biệt lập
Công thức trên có nghĩa là cách Cục bộ “đánh bại” cách Nhúng vào trang và Liên kết đến
một file riêng biệt. Hoặc nói theo cách khác thì cách nhúng cục bộ là mạnh nhất, sau đó đến
Nhúng vào trang và cuối cùng là liên kết đến một file biệt lập.
1 <p style=”font-size:16pt; font-weight:bold; color:blue;”>
2 Nếu bạn thêm code CSS vào trong thẻ này nó sẽ thay đổi cách hiển thị trên trình duyệt
3 </p>
1 <head>
2 <title>Nhúng vào trang</title>
3 <meta http-equiv=”Content-type” content=”text/html; charset=utf- 8″ />
4 <style type=”text/css”>
5 h1 {font-size: 16px;}
6 p {color:blue;}
7 </style>
8 </head>
1 <link href="style_sheet.css" rel="stylesheet" type="text/css" />


Compatible Implant
Trilobe Compatible Implant The $145.00 Alternative
www.BlueSkyBio.com
Giới thiệu về CSS | Học thiết kế web theo chuẩn.
2:59:02 PM]
14 Comments
( Comment bài này )
« Cú pháp của CSS Luôn đọc lại bài viết của mình »
Giới thiệu về CSS3
Giới thiệu WordPress
Giới thiệu Google Analytics
Your Ad Here for Free

$20 in Free Clicks to place your ad
here. Join Free now!
www.your-site.com
Your Ad Here!
BIDVERTISER ADS
Nguyễn khánh says:
October 30, 2009 at 9:09 pm
Hic, sao bây giờ mới tìm thấy cái trang web này chứ, mất bao nhiêu tiền trong trường
trực tuyến để học mấy cái này rồi, huhu
Reply
manticohd says:
December 9, 2009 at 6:47 pm
/*
Cục bộ > Nhúng vào trang > Liên kết đến một file biệt lập
*/
mình tưởng là :
Cục bộ < Nhúng vào trang < Liên kết đến một file biệt lập
Reply
haitvpro says:
July 26, 2010 at 7:37 pm
Mình cũng nghĩ là Cục bộ < Nhúng vào trang < Liên kết đến một file biệt lập
bác Demon xem lại rùi giải thích giùm!
Reply
uamnaruto says:
January 6, 2010 at 12:57 pm
Reply
pn2design says:
January 6, 2010 at 6:57 pm
Reply
Giới thiệu về CSS | Học thiết kế web theo chuẩn.

2:59:02 PM]
Đọc kỹ bài đi, sao mới đọc sơ qua đã muốn sửa rồi vậy? Đó là “Điều cuối cùng bạn
cần biết về 3 loại hình sử dụng CSS” chứ đâu phải kết luận?
Cục bộ > Nhúng vào trang > Liên kết đến một file biệt lập <– thế này dúng rồi mà
Bác nào không hiểu em giải thích lại cho sáng mắt vậy
Nếu có nhiều định dạng cùng loại cho 1 đối tượng thì định dạng cục bộ sẽ "đánh bại"
các định dạng kia… Tức là đối tượng sẽ ưu tiên có định dạng cục bộ.
Ví dụ nhá:
'
.abc { color: green; }
What color is this?
What color is this?

Tất cả đều ra mày đỏ.
pn2design says:
January 6, 2010 at 6:59 pm
Ác đưa code lên sao ấy nhĩ?
<style type="text/css">
.abc { color: green; }
</style>
<b style="color: red;" class="abc">What color is this?</p>`
`<b class="abc" style="color: red;">What color is this?</p>
Reply
uamnaruto says:
January 7, 2010 at 12:33 am
có mỗi cái đơn giản mà cứ như thịt trâu vậy
em giải thích rồi nhưng sao lại bị mất 1 đoạn
cục bộ là ba của nhúng vào trang , nhúng vào trang là ba của liên kết đến 1 file mới
… ở đây giới thiệu để cho chúng ta hiểu nguồn gốc CSS thôi… cái gì cũng có nguồn
gốc mà …

Reply
layla says:
January 10, 2010 at 8:46 pm
Anh ơi sao em thấy web của anh {
#firebugBody .firebugCanvas là sao hả anh.
Em không hiểu mong anh giúp đỡ
Reply
Giới thiệu về CSS | Học thiết kế web theo chuẩn.
2:59:02 PM]
nguyen thanh nam says:
March 11, 2010 at 9:52 am
cho mình hòi tí … mình chưa từng qua trường lớp đào tạo web nhưng về HTML mình
bít sơ vì có lấy sách vọc thử … mình ko biết với trình độ của mình hiện nay có học
qua CSS nổi chưa nửa. . mong các huyng đệ hướng dẫn mà ko bít để trở thành
chuyên viên web mình nên đi theo những bước nào : HTML–>CSS —> tới đâu nửa
mình đang cần câu trả lời . thank tất cả mọi người
Reply
clackken.smith says:
March 11, 2010 at 10:42 am
Nếu bạn muốn là một Programer thì bạn nên học theo 2 hướng chính.
1. PHP
2. ASP. ASP.NET
- Theo tôi khuyên bạn nên theo PHP đơn giản vì nó thông dụng và được support
nhiều, các hàm của nó cũng đễ học, và căn bản thì chỉ theo nguyên lý lập trình C.
- Nếu bạn theo PHP thì cũng nên học qua 1 khoá kỹ thuật lập trình C
- Nếu bạn theo ASP thì nên học VBBasic hoặc VB.NET nó sẽ hỗ trợ nhiều cho ASP.
- Đó là lời khuyên của tôi, bạn thì sao ^^
Reply
Phan Công Vinh says:
March 24, 2010 at 8:39 pm

Rất cám ơn bạn !
Reply
truongho says:
April 28, 2010 at 8:43 pm
Hay quá, ngắn gọn, dễ hiểu
Reply
viet says:
May 4, 2010 at 9:21 pm
hay quá à
Reply
Fuong Ngo says:
May 25, 2010 at 1:41 pm
mấy hôm nay em học thiết kế web mà chưa tìm hiểu gì hết…đợi đến khi cho đồ án rồi
em mới “vọc” hic hic…Nhưng giờ có anh DW rồi em sẽ không lo lắng gì nữa. Bài viết
của anh cái nào cũng ngắn gọn và dể hiểu…hi hi hi. Thank you
Reply
Giới thiệu về CSS | Học thiết kế web theo chuẩn.
2:59:02 PM]
Leave a comment
( Chọn hình đại diện )
Chọn kiểu gõ: Tự động TELEX VNI Tắt
Tên bạn
Email
Website
Comment
Luu ý khi post comment:
Không "bóc tem" topic
Dùng lời lẽ có văn hoá và lịch sự
Xem trang FAQs trước khi hỏi
Bạn có thể dùng thẻ HTML như:<strong>, <em>, <a>

Wrap code trong dấu `backtick` (dấu trên phím Tab)
© 2008-2010 izwebz, All Rights Reserved. BACK TO TOP Powered by WordPress | Hand coded and designed by Demon Warlock
Izwebz is solemnly hand coded and designed
from scratch by Demon Warlock. It is also very
proud of being powered by WordPress, which
is an exceptionally well written and beautiful
CMS
Rules are not made to be broken at Izwebz
Bạn không được tự ý copy và phát hành
lại nội dung của izwebz nếu chưa được sự
đồng ý của tôi.
Biết tôn trọng và cư xử hòa nhã với mọi
người
Không "bóc tem" bài viết.
Izwebz được quyền xóa những comment
nào không phù hợp với nội dung của trang
web
Câu hỏi thường gặp
Liên hệ
Tác giả
Bản quyền
Trang web vẫn đang trong quá trình phát triển
về nội dung. Do vậy nếu bạn có khả năng hãy
đóng góp bài viết hoặc bạn có thể quảng cáo
trang web đến những người mà bạn biết.
Được vậy tôi sẽ rất biết ơn bạn.
Submit
Giới thiệu về CSS | Học thiết kế web theo chuẩn.
2:59:02 PM]

×