Hỏi - Đáp

Giáo viên trả lời:
Tôi thấy trong file css layout.css của bạn bạn khoá 2 class này rồi thì nó đâu có float qua trái được, => nó bị rớt xuống dòng là phải rồi


.col_user {
float: left;
padding-right: 10px;
text-align: right;
width: 60px;
}

.col_input {
float: left;
}

Bạn bỏ mấy cái khoá lại chỗ 2 class này đi

Giáo viên trả lời:


====================
Lỗi này là do nó bị xung đột với thẻ h4 trong tập tinp7csspbm2_14.css
Trong trang chủ index.html của bạn các tiêu đề của các box bạn đặt trong thẻ h4
<header class="boxtop">
<h4>Danh muc san pham</h4>
</header>
Do đó trong tập tin p7csspbm2_14.css bạn bỏ class h4 và định nghĩa lại như sau:
/*Heading styles*/
h1, h2, h3, h4 {
margin: 30px 0px 0px 0px;
}
h1 { font-size: 1.5em; }
h2 { font-size: 1.35em; }
h3 { font-size: 1.25em; }
/*h4 { font-size: 1.1em; }*/ /*Bõ chỗ này*/
h4 {margin:0px;} /*Thêm bên dưới*/

+ class slideshoe nên dùng nề trắng

.slideshow{
background-color: #FFF;
height: auto !important;
width: auto !important;
max-width: 100%;
}

Phần nội dung cột giữa bạn chưa thiết kế thì phải. Làm tiếp đi

Giáo viên trả lời:
Trời, mới tới mấy bài này thôi hả, vậy là còn nhiều bài học phía sau lắm đó chắc vài trăm bài nữa lận, chắc học tới tết luôn đó bạn, và còn làm cái đề tài PHP cơ bản nữa khoảng thêm 100 mấy video lận đó (chưa kể bài học chính thức đó) vậy bạn phải còn giải quyết chắc khoảng 200 video trở lên đó.


Xem đề tài tham khảo ở đây http://hocwebgiare.com/demo_php_responsive_programing/

Giáo viên trả lời:
Tôi dự trù đầu năm mới thì sẽ ra chương trình này, vì đầu năm có cái gì có cho nó mới mẻ chút.

Học hết phần căn bản rồi thì bạn có thể dư sức xin làm việc ở các vị trí như thiết kế giao diện website bằng các công nghệ mới HTML5/CSS3/RWD/JS và ở các bộ phận lập trình PHP nhưng ở một mức độ cơ bản thôi bạn. Vì lớp cơ bản thì chỉ trang bị kiến thức nền tảng về PHP thôi, khi học lên PHP nâng cao thì còn nhiều chuyện chúng ta phải học nữa lắm bạn. Bạn đã làm xong phần đề tài PHP cơ bạn chưa vậy? sau khi làm xong đề tài ta còn học thêm một số kiến thức bổ sung cho phần căn bản nữa sau đó mới vào phần nâng cao dễ hơn.

Bạn đã làm xong site để tài này hay chưa vậy?

Giáo viên trả lời:
Trong các form ta thiết kế chuẩn RWD này là ta đang dùng CSS Form Framework của Golden nó dạng 12 côt giống như bootstrap. 

Dạng này dễn dùng vì class là có sẳn ta chỉ việc gọi ra xài thôi. Nhưng sẽ khó khi ta muốn chỉnh sửa theo ý của ta.
là ta tự viết RWD mà không nhờ thư viện nào cả bạn, ta chỉ cần dùng kỹ thuật CSS3 Media Query là làm RWD theo như ý muốn của ta cho tất cả các thành phần trng trang web. bạn đã làm qua 2 project này chưa?

Dĩ nhiên cách ta tự làm là tối ưu nhất vì ta tự viết thì sẽ dễ chỉnh sửa hơn vì tối ưu code hơn còn ta dùng cái Framework thì có những cái ta không dùng mà cũng phải bắc buộc load vào do đó trang web sẽ load chậm và chỉnh sửa cũng khó nhưng bù lại ta sẽ làm nhanh vì chỉ gọi ra dùng thôi.

Tốt nhất là ta phối hợp cả 2 lại lúc nào cần nhanh thì dùng cái có sẳn còn chỗ nào cần làm chi tiết theo ý của ta thì tự viết là hay nhất.

Giáo viên trả lời:
thiet ke web


Bạn phải dùng lệnh Insert Record Wizard để tạo Form chuẩn lưu dữ liệu vào database trước sau đó chuyển Form này sang RWD bằng Form Framework Golden.
Tham khảo trang mẫu dangky của tôi, tôi đã ráp các class của Form Golden vào lệnh Insert Record Wizard. Để ý trong các thẻ input có thêm class input. Bạn cũng nên đưa thêm các icon vào form cho đẹp. Xem lại các video clip về thiết kế form trong phần học PHP cơ bản có chỉ thiết kế form này rất nhiều. Kiểm tra mail để nhận file mẫu.

Tham khảo demo mẫu Form đăng ký tại đây:

Giáo viên trả lời:
Không dấu được chữ wowslider là do crack chưa được.

+ Sau khi xuất ra thì ta phải mở tập tinwowslider.js trong thu mụcengine1 lên tìm chỗ show().appendTo đổi thành hide().appendTo
+ Đồng thời ta phải chép các ảnh gốc bỏ bào trong thư mục data1\images vì các hình trong này đã bị đóng mộc trước khi bẻ khoá.
+ Sau đó chạy lại trang index.html lại thì sẽ mất đóng mộc của wowslider

Nếu bạn quét Virus không hết thì phải cài lại Windows rồi. Khi cài lại Windows xong nhớ cài phần mềm diệt virus Avira miễn phí vào trong máy ngay để tránh bị mấy con virus này. Nếu máy không cài vào internet sẽ rất dễ bị dính virus này lắm.

Giáo viên trả lời:

+ Một số thay đổi trong trang chủ index.html

1 - script nice scroll nên đem xuống đặt trước thẻ </body>
2 - Đoạn thẻ tạo scroll to top của bạn không dùng được, đoạn này bạn xem lại trong video tạo scroll top top, và đoạn này nên đặt trước đoạn script nice scroll và cũng đặt phía trước thẻ </body> để trang web load nhanh hơn.
3 - Chép thêm thư mục img chứa cái hình top top vào site
4 - Chép thêm môt số file Jquery như jquery.ui.totop.js, bỏ vào trong ư mục js
5 - Chép thêm tập tin ui.totop.css bỏ vào thư mục css
6 - Chèn thẻ <link rel="stylesheet" media="screen,projection" href="css/ui.totop.css" /> vào sau thẻ meta
7 - Trong file css layout1.css thêm thuộc tính margin:0px vào để layout không hở trên
8 - Xoá bỏ dấu \ bị dư ngay dòng chú thích<!-- End WOWSlider.com HEAD section --> để tránh layout bị hở trên một dòng
9 - Phần ghi nhớ chỗ hộp đăng nhập phải thiết kế là checkbox chứ không dùng Radio

Về giao diện thì cũng OK rôi đó, chỉ sai có bao nhiêu đó thôi, tôi chạy trong trình duyệt không thấy layout bị lệch cột phải qua cột giữa đâu, thấy vẫn bình thường.
+ Đã gửi source sửa lại cho bạn qua email rồi đó, kiểm tra và sửa lại thử đi

Giáo viên trả lời:


==================================================
Tôi kiểm tra trong website của bạn thietkeweb.khanhtri.com.vn thấy phần đa giao diện có một số lỗi

Trong trang inc.php bạn hãy sửa lại code chỉ còn như vầy thôi nhé
$style = $row_rs_default_style['tengiaodien'];
setcookie ("mystyle", $style, time()+604800,"/");
?>

Sau đó vào database đổi trường màu mặc định là OK.

Giáo viên trả lời:
Đã gửi link download qua Email của bạn rồi đó, hãy check mail để tải về hoặc có thể vào phần đính kèm trong bài học để tải về.

Giáo viên trả lời:

Code chổ này là:

<a href="ymsgr:sendIM?thuvtk279"> <img src="http://opi.yahoo.com/ online?u=thuvtk279&amp;m=g& amp;t=2" alt="" border="0" align="absmiddle" class="canhhinh_yahoo" /></a>

Trang web hocwebgiare.com, em vào chổ hỗ trợ online bấm vào chổ mặt cười yahoo trên trang thầy. Nó cũng ko bật lên ô để mình chát.

Nhờ thầy xem giúp em với, cảm ơn thầy.
=====================================
Code này đúng rồi, bên trang của tôi tôi test bấm vào thấy nó bật lên vào Yahoo chat được bình thường. Có thể Yahoo chat trên máy bạn bị gì rồi, gỡ ra cài lại đi.
Cái trang bạn gửi cho tôi thấy nó cũng chạy được bình thường


Giáo viên trả lời:

<a href="<?php echo $url ?><?php echo vietdecode($row_rs_tintuc_cap1['tieudetin']); ?>-p<?php echo $row_rs_tintuc_cap1['ID_tintuc']; ?>.html">
<?php echo $row_rs_tintuc_cap1['tieudetin']; ?>
====================================

Theo như trình tự tuyền biến của bạn như vậy thì mã số tin tức không phải là tham số 1 nữa mà là tham số 2
RewriteRule ^(.*)-p(.*).html$ layout_tintucchitiet.php?id=$1 [L]

Dấu (.*) đầu tiên là tham số 1 => là tieudetin chứ không phải id tin tức nhưng chỗ bạn để ?id=$1 thì nó là tham số 1 do đó lọc sẽ sai. Bạn đổi lại chỗ $1 thành $2 thử xem.

Giáo viên trả lời:
Cái link phía trên nhìn sẽ thuận chiều hơn và đẹp hơn nhiều so với link bên dưới.

Cái link bên dưới bạn để làRewriteRule ^(.*)-p(.*).html$ có nghĩa là tieudetin đi trước rồi chêm vào chữ -p, rồi tới id của tin tức. Ở đây bạn không đưa ra chỗ cái thẻ href cái link bạn truyền như thế nào nên tôi không biết là bạn có truyền đúng thứ tự các tham số trong thẻ href lúc viết link không nữa? bạn cho tôi dòng rewrite trong htaccess không thì tôi cũng chưa thể biết được?
Bạn gửi cho tôi chỗ cái href="?????" để tôi xem bạn truyền đúng thứ tự các tham số hay không?

Giáo viên trả lời:
Boostrap là một CSS Framework có sẳn ta chỉ việc gọi class ra dùng thôi bạn.

Thường nếu chúng ta không tự viết CSS được thì ta có thể dùng thư viện CSS này để tạo giao diện web nhưng ta phải viết đúng các class mà nó đã đặt ra trong thư viện này.
Thư viện CSS Boostrap chạy hơi nặng vì có những cái ta không dùng mà cũng gọi cả thư viện vào nên trang web của ta sẽ load chậm. 
Phần giao diện Boostrap này ta có thể áp dụng vào trong phần Admin Control Panel sẽ OK hơn khi sử dụng ngoài trang chủ.
Bạn download sách tên Bootstrap trong phần thư viện sách thiết kế web về xem thử đi thì biết nó dùng để làm gì?
Tham khảo một số giao diện trang web làm bằng Bootstrap tại đây https://wrapbootstrap.com/ và tại đây http://codecanyon.net/category/skins/bootstrap

Giáo viên trả lời:
Bản AppServ dùng phiên bản PHP 5.2.x là một phiên bản PHP rất thông dụng hiện nay trên các hosting Windows. Bạn nên cài bản Appserv 5.2.9 trước để máy có PHP 5.2.x rồi sau đó cài tiếp bản Xamp để có bản PHP 5.3.x. Khi cài Xamp sau bạn chọn port khác ví dụ như là 8080 và khi cài nó hỏi có thay đổi cấu hình file php.ini không thì ta chọn không. Khi cài Appserv trước thì nó sẽ chiếm Port 80. Hiện tại máy của tôi cũng đang chạy 2 webserver PHP 5.2.x dùng AppServ và PHP 5.3.x dùng Wamp.

Bạn nên dùng phần mềm Wamp Server sẽ ít bị xung đột hơn thằng Xamp.

Bạn gỡ thằng Xamp ra đi rồi cài lại theo trình tự bên dưới

Bạn xem video hướng dẫn cách cài đặt AppServ 5.2.9 Server tại đây

Bạn xem video hướng dẫn cách cài đặt Wamp Server tại đây

Chú ý: Cài đặt AppServ trước rồi mới cài đặt tới Wamp.

Giáo viên trả lời:
Nếu bạn đã thực hành qua hết tất cả các thuộc tính của CSS3 thì đã có thể áp dụng vào việc thiết kế giao diện web được rồi. Khi vào phần đề tài thì chúng ta cũng có áp dụng các kỹ thuật này vào làm giao diện cho website. Tốt nhất Bạn nên vào mục Thư viện tài nguyên web  để làm thêm các ví dụ thực tế từ các nguồn tài nguyên thiết kế này (hầu như là dùng HTML5/CSS3/RWD/JQUERY), vì không có nguồn nào hay hơn cái này nữa đâu bạn, nguồn này là số 1 trên mạng bây giờ rồi đó. Không biết là mấy bữa nay Bạn đã có download về và áp dụng thử nguồn tài nguyên này vào website của bạn chưa? Tôi sẽ cố gắng cập nhật nguồn này hàng ngày cho các Bạn để các bạn làm thử từ các ví dụ thực tế này. Trong lúc làm nếu cái nào chưa hiểu cứ gửi câu hỏi lên đây để tôi trợ giúp cho Bạn.

Giáo viên trả lời:
Trong website của bạn tôi thấy có khá nhiều lỗi

1 - Trong thẻ body bạn không nên để class dongho vì class dongho này bạn địnhmargin-bottom: 10px; sẽ làm layout toàn trang lệch xuống bên dưới 10px không sát lên trên cùng.
2 - Trong file giaodien.css trong thẻ body phải thêm thuộc tính margin:0px để layout nằm sát lên trên

body {
background-color: #9F6;
margin:0px;
}
3 - Trong website này thấy bạn có dùng Jquery Sroll to top mà tôi thấy bạn chép thiếu thư mục img chứa cái hình mũi tên và bạn chưa chép tập tinui.totop.css bỏ vào thư mục css nên nó không lên được cái nút cuộn trang lên
4 - Bạn nên bỏ các thẻ <pre> và </pre> trong trang chủ đi để nó không làm dữ liệu của ta rớt xuống dòng

<!--<pre>-->
<img src="image/images (1).jpg" width="900" height="200" />
<!--</pre>-->

<!--<pre>-->
<marquee direction="left" scrolldelay="60" scrollamount="5" behavior="scroll" onMouseOver="this.stop()" onMouseOut="this.start()" > chao ban den trang wed cua chung toi </marquee> <!--</pre>-->

5 - Khi bạn đưa vào nút To top nó sẽ nằm bên phải do đó hộp quảng cáo góc phải bạn nên dời qua bên trái

#fl813691{z-index:9999999; font: 12px Arial, Helvetica, sans-serif; color:#666; position:fixed; _position: absolute; left:0; bottom:0; height:150px; }

Chỉnh toạ độ left:0

6 - Chỗ thuộc tính này bạn nên định qua trái

.cent_cent1 {
text-align: left; /*Chỗ này nên định là left*/
width: 507px;
margin-top: 10px;
float: left;
border: 1px solid #000;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}

7 - Chiều cao chứa menu nên định là Auto

.menu {
width: 900px;
height: auto; /*Sửa lại là auto để chiề cao lấy tự độ*/
padding: 0px;
margin-top: 5px;
}


8 - Trong trang chủ bạn bỏ Spry menu bar rồi thì dòng này bạn phải bỏ ra để không thôi nó sẽ báo lỗi

var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1" , {imgRight:"SpryAssets/ SpryMenuBarRightHover.gif"});

9 - Phần tạo Acordition trong lúc chèn vào chổ Link path bạn nên để trống

10 - Còn mấy chỗ khác thì tạm OK.

Hình như bài này bạn tự làm không giống torng LAB thì phải. Các bài LAB làm sẽ liên tục, bài của tuần này sẽ làm tiếp cho các tuần sau đó nữa do đó bạn nên làm đúng tên class để chúng ta làm tiếp các tuần sau cho dễ. Sau khi chúng ta làm qua đúng hết các bài tâp yêu cầu rồi thì lúc này ta mới tự làm các bài khác theo ý của mình thì sẽ dễ dàng hơn khi bạn học tiếp các tuần kế nữa.

Bạn xem lại website tôi đã chỉnh lại một số lỗi trong site của bạn nhé.

Giáo viên trả lời:
Tôi đã sử lại link rồi đó, Bạn vào lại xem thử xem được chưa nhé.

Giáo viên trả lời:
Trong bài tập cuối khoá phần web tĩnh nhớ đã có làm bài này rồi mà.

Menu dạng này chứ gì http://news.hocwebgiare. com/

Trong phần đề tài lập trình PHP cơ bản ta còn làm thêm menu dạng này nữa http://phpcoban.hocwebgiare.com giống như thằng zing.vn đó, mai mốt là làm tới rồi bạn

Trong tập tin css bạn gửi cho tôi thấy bạn định nghĩa sai chỗ class bg_menu do đó nó không hiện ra được cái nền của menu trãi dài
<!--End:header-->
.bg_menu
{width:100%;
background:#CCC;
}

Chỗ này có một lỗi nặng về tạo chú thích trong CSS, muốn tạo chú thích trong tập tin css thì bạn phải dùng /* Ghi chú */
Bạn ghi như vậy do đó cái class bg_menu bên dưới của bạn nó chết ngắt luôn.

Sửa như bên dưới

/*End header*/
.bg_menu {
width:100%;
height:auto;
background-color:#DDDDE1;
}

+ Bạn nên dùng thêm lệnh Commnads -> Apply Source Formatting để tạo Code CSS đẹp, tập tin CSS của bạn viết nhìn lọt sọt quá trời luôn.
+ Đã gửi bài sửa của bạn qua Email hãy check mail để kiểm tra và sửa lại.


Giáo viên trả lời:
+ Bản DWCC thì chỉ chạy trên Win7 trở lên còn DWCS6 thì Win nào chạy cũng được

+ Nếu bạn đang dùng DWCS6 thì cũng không cần cài thêm DWCC làm gì trừ phi bạn muốn trải nghiệm thêm bản mới
+ DWCS6 hay DWCC đều hỗ trợ làm web HTML5/CSS3/RWD cả (DWCS3/DWCS4 ta vẫn làm được chỉ cài thêm cái Extension vào là có mà có ưu điểm nhẹ máy)
+ Bản DWCC có nhiều chế độ thiết kế hơn bản DWCS6 nhưng khó dùng hơn.
+ Thiết kế web quan trọng là ý tưởng, bạn đừng quan tâm nhiều đến phiên bản. Tôi thì trung thành với bản DWCS3 vì tôi đã trải nghiệm hơn 10 năm các bản này thì tôi thấy bản DWCS3 là tốt nhất, nhẹ nhất.