Ebook Các thủ thuật trong Flash & Dreamweaver: Phần 3 - Nguyễn Trường Sinh (chủ biê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 (16.9 MB, 228 trang )

®

C h ư ơ n g 14: Các kỹ th u ậ t trìn h duyệt t h ế giới thực

465

H ì n h 14-18-2

I 0K 1
C ancel
Help

H ì n h 14-18-3

Thủ th u ậ t 14-19: X em trư ớ c n h iề u h ồ sơ
c ù n g lú c
Đôi khi bạn làm việc với nhiều tậ p tin và muốn xem trước chúng trong
trình duyệt, vì t h ế bạn mờ ra nhiều tập tin và lần lượt n h ấ n phím F12
dế xem chúng. Điều này thường làm m ấ t thời gian và bạn h ẳn sẽ sung
sướng khi biết rằ n g b ạn có th ể xem t ấ t cả các tra n g web này cùng lúc.
Trong bảng điều k h iể n Files, n h ấ n phím Ctrl và n h ấp chuột vào từng tập
tin bạn muốn xem hoặc n h ấ p chuột và sau đó n h ấ n phím Shift và nhấp
vào một tập tin k h ác để chọn m ột loạt các tập tin (xem hình 14-19-1). Sử
dụng phím t ắ t F12 (xem tro n g tr ìn h duyệt chính) hoặc Shift+F12 (xem
trong trìn h duyệt phụ) hoặc n h ấp nút chuột phải vào ph ần lựa chọn
trong bảng điều k h iể n Files và chọn tr ìn h duyệt trong menu con Preview
in Browser. T ấ t cả các tr a n g sẽ được mở ra trong cùng một cửa sổ trìn h
duyệt để bạn có th ể duyệt qua chúng th ông qua nút Back hoặc chúng sẽ
được mở ra trong nhiều cửa sổ trìn h duyệt để bạn xem. H àn h vi này còn

M

P h ầ n II: Các thủ thuật, trong Dreamweaver

466

tùy thuộc vào p h iê n b ả n t r ì n h duyệt, h ệ điều h à n h b ạ n đ a n g sử dụng và
những thông số b ạ n t h i ế t lập t r o n g m ộ t sô' t r ì n h duyệt.

c

õ

s Ồ
S ite
B Ồ

ầ
i

t

*

*

| E

- Thu th u a t (D :\ th u th u at; ỂÌ\
im ages

Sỉ

0 4 5 0 0 0 2 2 . )pg

ãá
S)

0 6 3 4 0 0 0 4 . )pg
s p a ce r.g if

a p p .c ss
bg_grad .|pg
b g _ n a v .jp g

: a
ì

e m x _ n a v je ft.c s s
g b ln a v _ left.g if

&

g lb ln a v _ se lected .g if

b

g lbn av _back g ro u n d .g if

'Ị
j

g lbn av _rig h t.gif

I

3

p a g e l.h tm

Ql

page2.h(:m

H

p a g e3 .h tm
p a g e 4 .h tm

@L page5.htm
.461~ ~ ĩỹ ~ I

V!
JS'

3 lo c a l ite m s s e le c te d to ta llin g 1 5 2 9 6 b y l

H ì n h 14-19-1

T hủ th u ậ t 14-20: S o ạ n th ả o d a n h s á c h trình
duyệt

Việc xem trước các tr a n g web tron g một số tr ìn h duyệt sẽ giúp bạn tránh
được các phiền toái sau này. Để làm cho quá trìn h này đỡ rắc rối, bạn
nên th iế t lập các tr ìn h duyệt để D ream w eaver sử dụng với đặc diêm
Preview in Browsers. H ãy chọn E d it > P references hoặc C tr l * u và sau
đó nhấp vào mục Preview in Brow ser tron g dan h sách Category ờ phía
trái (xem h ìn h 14-20-1). N h ấp n út Add (+). Hộp thoại Add Browser sẽ
xuất hiện (xem h ìn h 14-20-2). H ãy khoan cung cấp cho trin h duyệt một
tê n gọi vì nó sẽ bị th a y t h ế trong bước tiếp theo. Bây giờ nháp nút
Browse và duyệt tìm tập tin thực thi ứng với tr ìn h duyệt. K ế đến. cung
cấp cho tr ìn h duyệt một tê n gọi th â n thiện. Tên này sẽ xuất hiện trong
menu. Cuối cùng, bạn quyết định chọn xem đây có phái là trin h duyệt
chính hay không (được truy xuất th ô n g qua phím F12> hoặc là trình

C h ư ơ n g 14: Các kỹ th u ậ t trìn h duyệt thê’ giới thực

467 m

duyệt phụ (được truy xuất thông qua tổ hợp phím Shitf+F12). Bạn không
cần quan tâm tới việc trìn h duyệt chính hay phụ nếu bạn truy xuất trình
duyệt thông qua menu File > Preview in Browser. Theo cách này, bạn có
thể cài đ ặt nhiều phiên bản của trìn h duyệt Netscape trên hệ thông máy
của minh để kiểm tra. Tuy nhiên, bạn chỉ có th ể cài một phiên bản của
trình duyệt IE.

n

P re fe re n ce s
C a te g o r y
G e n era l

Accessibility
C o d e C oloring
C o d e F o rm at
C o d e H ints
C o d e R ew riting
CSS S ty le s
File T y p e s / E ditors
F o n ts
Highlighting
Invisible E lem en ts
L ay e rs
L ay o u t M ode
New D o cum ent
O ffice C o p y /P a s te
P an els______________
P rev iew in B row ser
S ite
S ta tu s Bar
Validator

Defaults: I IPrimary browser
□

Secondary browser

Options: 0 Preview using temporary file
Checking this option will create a temporary copy for preview and
server debugging. To update the document directly please uncheck
this option.

C an ce l

H ì n h 14-20-1
Add Browser

mozilla.exe

N ame:
Application:

C :\Progtam Files\mozilla.org\Mozilla\r

B r o w s e ...

D e f a u l t s : I I Primary brow ser
0

S e c o n d a ry brow ser

OK

H ì n h 14-20-2

C ancel

Help

I®

468

P h ầ n II: Các thủ t h u ậ t tro ng Dreamweaver

T hủ th u ậ t 14-21: C uộn tr a n g n h a n h tro n g IE
Việc cuộn xuông trong một tra n g quá dài là m ột việc làm không thú vị
chút nào. Thủ th u ậ t này sẽ giúp b ạn t r á n h được sự n h àm chán đó, dù
rằn g nó có th ể gây ra tr a n h cãi. N h ấp n ú t chuột phải vào th a n h công cụ
trong các tra n g web dài trong IE (chỉ áp dụng với người sử dụng
Windows) và bạn sẽ có một menu ngữ cảnh tro ng đó có liệt kê một số tùy
chọn cuộn hữu ích (xem h ìn h 14-21-1). Bạn th ấ y th ê nào? Chúng tôi rất
thích menu ngữ cảnh.
Ik P H P C o ílin t; S ía n d « ii <1 - M ic ro s o f t I n t e r n e t F x p lo to i
Fie

Q

Ed*

View

Back

Q

F a v o r ite s

Tools

.

-

H dp

X
•

Address ị é n D:\Users\snh\(ÍDí:s\í*ie\P^

" /a ro a r- -ÍTT,

f

PHP Coding Standard
Last M odified: 2003-02-17
The P H P C od in g S ta n d ard I S w ith p e rm is s io n b a s e d o n Todd H off's C + + C o d in g S ta n d a r:
R ew ritten for P H P by F rg d n k K ristian se n / D B M e d ia la b O slo 2 0 0 0 -2 0 0 3
U s in g th is s t a n d a r d If you w ant to m a ke a local copy of this standard

and use It as your own you are perfectly free to do so That's why we
m a de It1 If you find any errors or m a ke any im pro ve m en ts p le a s e e -m ail
me the changes so I can m e rge them in R ecent C hanges
B e f o r e y o u sta rt p le a s e v e rify that y o u h a v e th e m o s t re c e n t
docum ent

You can also dow nload a this standard as a w o rd docu m e n t
(m a in ta in ed by C hris H u b b a rd i

•a g e X

- »7 lo»X
s .--A :*>#•.

D iscu ss this standard

Contents

H ì n h 14-21-1

T h ủ th u ậ t 14-22: T h iế t lậ p D r e a m w e a v e r
là m tr ìn h s o ạ n th ả o m ặc
đ ịn h
Một trong những cách tốt n h á t đê học tậ p là kiểm tr a các tra n g web
hiện có trê n web. IE cung cấp một nút Edit trê n th a n h công cu của mình

C h ư ơ n g 14: Các kỹ t h u ậ t trìn h duyệt t h ế giới thực

469 B T

để mở tr a n g web h iện tại trong m ột tr ìn h soạn thảo được chọn. Chức
năng này làm việc với tr ìn h duyệt IE5.5 trê n Windows 2000 và IE6 trên
Windows XP. Nếu b ạn làm việc với các trìn h duyệt khác hoặc hệ điều
hành không phải Windows, chức n ă n g này có th ể sẽ không hoạt động.
Nếu chức năn g này h o ạ t động, hãy th iế t lập để D reamweaver là trìn h
soạn thảo mặc định cho IE. Đầu tiên, bạn cần mở một thư mục bất kỳ
trên hệ thông của m ình với tr ìn h quản lý Windows Explorer hoặc một
công cụ b ất kỳ và sau đó chọn Tools > Folder Options (xem hình 14-221). Nhấp vào thẻ File Types và sau đó chọn HTML từ d anh sách

Registered File Types (xem h ìn h 14-22-2). Tiếp đến, nh ấp vào nút
Advanced. Chọn mục E d it trong danh sách Actions và sau đó nhấp vào
nút Edit (xem h ìn h 14-22-3). Trong mục Application used to perform
action, duyệt tìm tậ p tin thực th i của Dreamw eaver (xem h ìn h 14-22-4).
Những gì xuất hiện tro n g trường này phải được đ ặt trong dấu nháy tiếp
theo bởi m ột k h o ả n g tr ắ n g và sau đó là %1. K ết quả là b ạn sẽ có được

kết quả tương tự n hư sau:
" c : \ p r o g r a m f i l e s \ m a c r o m e d i a \ d r e a m w e a v e r mx 2 0 0 4 \ d r e a m w e a v e r . e x e "

%1

Bây giờ, hãy khởi động IE nếu nó chưa được mở và chọn Tools > In te rn e t
Options và chọn th ẻ Program . Giả sử rằn g mọi chuyện diễn ra tố t đẹp
trong các bước nêu trên , bạn sẽ có th ể chọn D ream w eaver MX 2004
trong danh sách HTML editor và nh ấp OK (xem h ìn h 14-22-5). Từ giờ
trở đi, mỗi khi b ạ n n h ấ p vào n út Edit trê n th a n h công cụ của IE, tran g
web hiện tại sẽ được mở ra trong D ream w eaver MX 2004 để b ạ n xem
hoặc chỉnh sửa m ã lệnh.
Tools
Map N etw ork D riv e...
D iscon n ect N etw ork D riv e ...
S y n ch ro n iz e ...

H ì n h 14-22-1

a

470

P h ẩ n II: Các thù th u ậ t trong Dreamweaver
Folder Options
G en eral II View

File T yp es

o n lin e Files I

R e g istered file types:
E x ten sio n s
□

HTA

<§t)HTC
®HTM
HTML
(S ịH T T

File T yp es
HTML Application
HTML Com ponent
HTML D ocum ent
HTML D ocum ent
H yperText Tem plate

[^1 H TX
Internet D a ta b a s e C onn ector HTML Tem plate
. A H ..L

í~ ì- U V A __________
N ew

D ele te

D etails for 'HTML' exten sion
O p en s with:

A

Internet Explorer

C h an g e

Files with exten sion 'HTML' a re of type 'HTML D ocum en t' T 0
c h a n g e settings that a ffect all 'HTML D ocum en t' files, click
A d v an ced
A d v a n ced

OK

C a n cel

H ì n h 14-22-2
Edit File Type

á

TML D ocum ent

C h a n g e I c o n ...

A c tio n s :
E d it

N ew ...

m

O p en

*1
=

P rin t

E d it...

E d it w ith A l to v a X M L 5 P Y
E d it w ith D r e a m w e a v e r M X 2 0 0 4
<
0

V
>

_

S e t D efault

Confirm o p en a fte r dow nload

1 I Always show e x te n s io n

OK

H ì n h 1 4-22-3

][

C ancel

C h ư ơ n g 14: C á c kỹ th u ậ t trìn h duyệt t h ế gíđi thức

471 g r

Editing action for type: HTML Document

I ? IIX I

Action:

Ị

8£d it

Cancel

Application used to perform action:

re am w eav e r MX 2C l04\ D ream w eaver.exe" % 1

0

j

OK

Browse...

Use DDE

DDE M essage:

Application:
M acrom edia

DDE Application Not Running:

T o p ic:
Sy stem

H ì n h 14-22-4
Internet Options
G eneral II Security II Privacy II C ontent II C o nn ectio ns

Program s

A d v a n ced

Internet programs
Y o u c a n specify w hich program W indow s autom atically u se s
for e a c h In ternet serv ice
HTML editor

D ream w eav er MX 2 0 0 4

E -mail

O utlook E x p ress

N ew sgroups

M icrosoft Outlook

Internet call

N etM eeting

Calendar

M icrosoft O utlook

C o n tact list:

M icrosoft O utlook

R e s e t W e b Settings.

M a n a g e Add-ons

Y o u c a n reset Internet Explorer to the default
h om e and s e a rch p a a e s
E n a b le or disable browser add-ons installed on
your com puter

[ 7 ] Internet Explorer should c h e c k to s e e w hether it is the default browser

OK

H ì n h 14-22-5

C a n cel

Apply

P h ẩ n II: Các thủ th u ậ t trong Dreamweaver

T hủ th u ậ t 14-23: G ỉâu t iê u đ iể m
Nếu bạn hỏi đồng nghiệp của m ìn h làm sao để ẩn các đường nét chấm
bao quanh h ìn h ảnh, liên kết, n út nhấn... và có lẽ họ sẽ cung cấp cho bạn
một đoạn m ã Jav aS crip t để thực hiện điều đó. Các đường tiêu diểm đóng
vai trò như m ột đặc điểm về đảm bảo tín h truy cập của các trình duyệt
nhưng cùng có những trường hợp không cần tới các đường n ét chấm này.
Thay vì phải dựa vào Jav aS crip t để thực h iện điều này, bạn có thể sử
dụng một thuộc tín h được hỗ trợ tro n g trìn h duyệt IE 5.5 và cao hơn.
Bạn có th ể bổ sung m ã h i d e f o c u s = " t r u e " cho thẻ <a>, < in p u t> hoặc
<img>. Thẻ <area> cũng được tuyên bố là được hỗ trợ nhưng thực tế lại
không như vậy (ít n h ấ t là với các thử nghiệm của tác giả). Nếu bạn áp

dụng điều này với thẻ <img> thì nó sẽ làm việc với bản đồ ảnh (thẻ
<area>). Một nhược điểm của th ủ th u ậ t n ày là nó chỉ áp dụng được với
trìn h duyệt IE 5.5 trở lên.
Tag L ib ra ry Editor
Tags:

X

Í

P h lf-I

0

p]
r]
[i)
r]
p

)

fi)
-E)
]

pÌ
r>

Tag format:

Line breaks:
Contents:
Case:

Preview:

OK

HTML tags
accesskey

HHp

class
dll
href
hreflarig

'd
lang
nam e
onBlur
— n ;„ i.
No Line Breaks
Form atted But Not Ind ented
Default

tex t< a> ta g
c o n te n ts< /a > te x t

H ình 14-23-1

j j Set;
]

C h ư ơ n g 14: Các kỹ th u ậ t trìn h duyệt t h ế giới thực

473 m

Bạn có th ể sẽ hỏi cách tô t n h ấ t để bổ sung thuộc tính này trong
Dreamweaver là cách nào? Chúng tôi đề nghị bạn bổ sung thuộc tính bạn
muốn gắn cho các th ẻ b ạn cần trong hộp thoại Tag Library Editor (xem
hình 14-23-1) - (Edit > Tag Libraries). Sau đó thuộc tính này sẽ có hiệu
lực trong thẻ A ttribute tro n g Show List. Bạn cũng có th ể có được thuộc
tính này trong các gợi ý m ã lệnh khi bạn chọn viết mã thủ công (xem
hình 14-23-2).
<body>

< /p >

I f l