Tổng hợp bài tập thiết kế web
BÀI TẬP THIẾT KẾ WEB
PHẦN HTML
1.Dùng tag Hn để tạo trang Heading.htm có dạng sau:
2.Dùng tag Hn và thuộc tính align để tạo trang Headingcenter.htm có dạng sau:
24 trang |
Chia sẻ: thanhnguyen | Lượt xem: 3956 | Lượt tải: 3
Bạn đang xem trước 20 trang tài liệu Tổng hợp bài tập thiết kế web, để xem tài liệu hoàn chỉnh bạn click vào nút DOWNLOAD ở trên
BÀI TẬP THIẾT KẾ WEB
---------
PHẦN HTML
Dùng tag Hn để tạo trang Heading.htm có dạng sau:
Dùng tag Hn và thuộc tính align để tạo trang Headingcenter.htm có dạng sau:
Dùng tag Hn và thuộc tính align để tạo trang HeadingAlign.htm có dạng sau:
Dùng các tag HTML định dạng văn bản trong trang web Emphasis.htm sau:
Dùng các thuộc tính chèn hình nến trang, định dạng màu chữ, … để tạo trang web sau:
Dùng các ký tự đặc biệt để hiển thị nội dung trang web sau
Dùng tag và thuộc tính align thiết kế trang web sau:
Dùng thuộc tính Background và tag thiết kế trang web sau:
Dùng tag và thiết kế các trang web sau:
Dùng chức năng bookmark Hyperlink thiết kế trang web sau:
Dùng chức năng table tạo trang web sau:
Dùng chức năng table và image tạo trang web sau:
Dùng chức năng table kết hợp thuộc tính colspan, rowspan và image tạo các trang web sau:
Dùng chức năng form tạo trang web sau:
:
PHẦN DREAMWEAVER
Dùng Dreamwearver thiết kế các trang web sau:
Bài 1:
Bài 2:
Bài 3:
Bài 4:
Bài 5 :
Bài 6: Dùng chức năng Template thiết kế các trang web sau:
Bài tập ôn tập: Thiết kế trang web sau
PHẦN JAVASCRIPT
Vieát chöông trình nhaäp vaøo 2 soá m(doøng),n(coät) (duøng haøm prompt ñeå nhaäp). Sau ñoù xuaát ra trang Web moät Table theo daïng sau:
Ví duï (m=3,n=4)
11
12
13
14
21
22
23
24
31
32
33
34
Baøi 2: Vieát chöông trình nhaäp vaøo Maõ soá SV, Hoï teân, Lôùp (duøng haøm prompt ñeå nhaäp) Sau ñoù hieån thò thoâng tin vöøa nhaäp vaøo ra baûng theo daïng sau:
Vieát chöông trình nhaäp vaøo soá 3 soá m,n , p (duøng haøm prompt). Sau ñoù taïo ra moät Form goàm coù m phaàn töû Text , n nhoùm radio moãi nhoùm coù 2 tuøy choïn caùc nuùt radio coù giaù trò laàn löôït laø 1->2*n , vaø 1 Dropdown menu(Listbox) coù p tuøy choïn moãi option coù giaù trò laàn löôït laø 1->p vaøText cuûa option laø Text1 ->Textp.
Vieát chöông trình taïo moät Form nhö sau:
Sau ñoù nhaäp lieäu vaøo Form I%khi baám nuùt Nhap(button)roài hieån thò keát quaû ra daïng nhö sau:laáy döõ lieäu tröôøng Hoï teân hieån thò vaøo oâ YourName, Maät khaåu vaøo oâ YourPWD
Yeâu caàu nhö baøi 4 nhöng kieåm tra döõ lieäu caùc tröôøng phaûi khoâng roãng vaø tröôøng Password coù ít nhaát 6 kyù töï neáu tröôøng naøokhoâng thoûa yeâu caàu thì hieån thò thoâng baùo vaø ñöa con troû veà oâ ñoù ñeå yeâu caàu ngöôøi söû duïng nhaäp laïi döõ lieäu.
Yeâu caàu nhö baøi 4 nhöng theâm ñieàu kieän nhö sau khi Form Load leân thì con troû ñaët trong tröôøng UserName vaø nuùt Nhap ôû cheá ñoä khoâng cho pheùp choïn . Khi ngöôøi söû duïng rôøi khoûi tröôøng UserName neáu kieåm tra tröôøng naøy khoâng roãng thì nuùt Nhap ñöôïc saùng leân (cho pheùp choïn)
Thieát keá trang nhö sau:
Baám vaøo nuùt Play thì chöông trình thay ñoåi hình thay ñoåi moät caùch ngaãu nhieân (2 giaây ñoåi 1 hình) Baám stop thì döøng laïi
Thieát keá trang nhö sau. Khi ngöôøi söû duïng nhaäp vaøo tröôøng soá löôïng vaø rôøi khoûi tröôøng naøy thì oâ Toång thaønh tieàn seõ ñöôïc caäp nhaät(löu yù neáu nhaäp vaøo khoâng phaûi laø soá thì thoâng baùo yeâu caàu nhaäp laïi)
Cho trang Web sau
Trong noù goàm caùc tuøy choïn sau:
Mua vaøo, Baùn ra laø tröôøng textbox
Loaïi xe laø Dropdown Menu goàm caùc option
Text Value
Toyota ../images/mer2.jpg
KIA ../images/otoa1.jpg
Ford ../images/t2.jpg
Caäp nhaät cho: goàm 2 tuøy choïn laàn löôït coù giaù trò laø 1 , 0 maëc ñònh khoâng ñöôïc choïn nuùt naøo.
Update, State laø nuùt button.
Yeâu caàu xöû lyù:
Khi trang load leân thì con troû nhaäp lieäu trong tröôøng ‘Mua vaøo’ vaø nuùt State ôû cheá ñoä khoâng cho pheùp choïn.
Khi di chuyeån con troû ra khoûi tröôøng ‘Mua vaøo’ neáu nhö giaù trò tröôøng naøy laø soá vaø khoâng roãng thì nuùt State saùng leân.
Khi Click vaøo muïc choïn hình quaõng caùo thì seõ theå hieän hình ñoù beân vuøng beân.
Khi baám vaøo nuùt Update vaø neáu nuùt radio ‘Vaøng’ ñöôïc choïn thì caäp döõ lieäu ôû ‘Baûng tin thò tröôøng’ trong muïc ‘Vaøng’ coøn ngöôïc laïi thì caäp nhaät ôû muïc ‘USD’ töông öùng vôùi tröôøng ‘Mua vaøo’ cuûa coät ‘Mua vaøo’ vaø tröôøng ‘Baùn ra’ cuûa coät ‘Baùn ra’ (Duøng inner ñeå caäp nhaät)
Ch o trang web sau:
Yeâu caàu: (Töï theâm caùc option trong Listbox vaø ñaët giaù trò trong radio)
Haõy nhaäp döõ lieäu treân Form sau ñoù baám Dang ky thì döõ lieäu seõ hieän thò vaøo caùc coät töông öùng a,b,c,d .(Löu yù laø döõ lieäu tröôùc ñoù vaãn coøn) duøng:
innerHTML hoaëc innerText
Iframe
Ví duï: Thieát keá Form nhö sau:
Vieát chöông trình xöû lyù theo yeâu caàu sau:
Khi trang load leân thì nuùt Nhap ôû cheá ñoä môø vaø con troû nhaäp lieäu ôû oâ hoï teân.
Khi rôøi khoûi tröôøng Lôùp neáu tröôøng hoï teân vaø lôùp khaùc roãng thì nuùt Nhap saùng leân.
Baám nuùt Nhap thì döõ lieäu hieån thò vaøo baûng “Danh Sach Sinh Vien” ôû beân döôùi vaø nuùt Nhap laïi môø
THEM SINH VIEN
function Init()
{
frmnhap.ht.focus()
frmnhap.nh.disabled=true
}
function Test()
{
var hten,lop;
hten=frmnhap.ht.value;
lop=frmnhap.lo.value;
if(hten=="")
{
alert("Ban quen nhap ho ten roi")
return;
}
if(lop=="")
{
alert("Ban quen nhap lop roi")
return;
}
frmnhap.nh.disabled=false
}
var count;
count=1;
function WriteData()
{
var hten,lop;
var pdau,pthan,pthem,pcuoi
hten=frmnhap.ht.value;
lop=frmnhap.lo.value;
Idhten.innerHTML=hten
Idlop.innerHTML=lop
Idhten.id="Idhten"+count
Idlop.id="Idlop"+count
count++;
pthan=Iddata.innerHTML
pdau=""
pthem=""
pthem=pthem+ " "
pthem=pthem+" "
pthem=pthem+ " "
pcuoi=""
Iddata.outerHTML=pdau+pthan+pthem+pcuoi
frmnhap.nh.disabled=true
frmnhap.ht.value=""
frmnhap.lo.value=""
}
THEM
SINH VIEN
Họ
tên
Lớp
DANH
SACH SINH VIEN
HỌ
TÊN
LỚP
Các file đính kèm theo tài liệu này:
- Tổng hợp bài tập thiết kế web.doc