Upload file trong PHP

Trong bài này, mình sẽ hướng dẫn các bạn upload 1 file lên thư mục máy chủ với PHP

Đầu tiên, tạo 1 tài liệu php mới và tạo 1 form bằng mã html như sau:

enctype="multipart/form-data">
Filename:

Cho đoạn mã php này vào

< ?php
if ($_FILES["file"]["error"] > 0)
  {
  echo "Error: " . $_FILES["file"]["error"] . "
";
  }
else
  {
          move_uploaded_file($_FILES["file"]["tmp_name"], "upload/" . $_FILES["file"]["name"]);
  }
?>

Đoạn php trên sẽ upload file vào thư mục upload trên máy chủ.

Có một số cách lọc file khi chọn để upload như sau:
$_FILES["file"]["type"] == "image/gif" //Upload nhưng file ảnh gif
$_FILES["file"]["type"] == "image/jpeg" //Upload những file ảnh jpeg
$_FILES["file"]["size"] < 20000// File upload ko quá 20kb

Áp dụng:

if ((($_FILES["file"]["type"] == "image/gif")|| ($_FILES["file"]["type"] == "image/jpeg")&& ($_FILES["file"]["size"] < 20000))
{
   if ($_FILES["file"]["error"] > 0)
  {
  echo "Error: " . $_FILES["file"]["error"] . "
";
  }
else
  {
          move_uploaded_file($_FILES["file"]["tmp_name"], "upload/" . $_FILES["file"]["name"]);
  }
}

Chúc các bạn thành công

Read More

Bài 6: Định dang văn bản trong CSS

Định dạng và thêm vào các kiểu định dạng đặc biệt cho phần nội dung một trang web là một vấn đề quan trọng cho bất cứ nhà thiết kế web nào. Như đã nói, ở bài học này chúng ta sẽ được tìm hiểu về các thuộc tính CSS về định dạng văn bản.
1. Màu chữ (thuộc tính color):
Để định màu chữ cho một thành phần nào đó trên trang web chúng ta sử dụng thuộc tính color. Giá trị của thuộc tính này là các giá trị màu CSS hỗ trợ. Ví dụ sau chúng ta sẽ viết CSS để định màu chữ chung cho một trang web là đen, cho tiêu đề h1 màu xanh da trời, cho tiêu đề h2 màu xanh lá chúng ta sẽ làm như sau:

body {
             color:#000
          }
h1 {
         color:#0000FF
     }
h2 {
         color:#00FF00
     }

2. Thuộc tính text-indent :
Thuộc tính text-indent cung cấp khả năng tạo ra khoảng thụt đầu dòng cho dòng đầu tiên trong đoạn văn bản. Giá trị thuộc tính này là các đơn vị đo cơ bản dùng trong CSS. Trong ví dụ sau chúng ta sẽ định dạng thụt đầu dòng một khoảng 30px cho dòng văn bản đầu tiên trong mỗi đoạn văn bản đối với các thành phần

p {
      text-indent:30px
   }

3. Thuộc tính text-align :
Thuộc tính text-align giúp bạn thêm các canh chỉnh văn bản cho các thành phần trong trang web.
Cũng tương tự như các lựa chọn canh chỉnh văn bản trong các trình soạn thảo văn bản thông dụng như MS Word, thuộc tính này có tất cả 4 giá trị : left (canh trái – mặc định), right (canh phải), center (canh giữa) và justify (canh đều).
Trong ví dụ sau chúng ta sẽ thực hiện canh phải các thành phần h1, h2 và canh đều đối với thành phần

h1, h2 {
               text-align:right
           }
p { 
       text-align:justify
   }

4. Thuộc tính letter-spacing:
Thuộc tính letter-spacing được dùng để định khoảng cách giữa các ký tự trong một đoạn văn bản.
Muốn định khoảng cách giữa các ký tự trong thành phần h1, h2 là 7px và thành phần

là 5px chúng ta sẽ viết CSS sau:

h1, h2 {
               letter-spacing:7px
           }
p { letter-spacing:5px }

5. Thuộc tính text-decoration:
Thuộc tính text-decoration giúp bạn thêm các hiệu ứng gạch chân (underline), gạch xiên (line-through), gạch đầu (overline), và một hiệu ứng đặc biệt là văn bản nhấp nháy (blink).
Ví dụ sau chúng ta sẽ định dạng gạch chân cho thành phần h1, gạch đầu thành phần h2

h1 {
         text-decoration:underline
     }
h2 {
         text-decoration:overline
     }

6. Thuộc tính text-transform:
Text-transform là thuộc tính qui định chế độ in hoa hay in thường của văn bản mà không phụ thuộc vào văn bản gốc trên HTML.
Thuộc tính này có tất cả 4 giá trị: uppercase (in hoa), lowercase (in thường), capitalize (in hoa ở ký tự đầu tiên trong mỗi từ) và none (không áp dụng hiệu ứng – mặc định).
Trong ví dụ dưới đây chúng ta sẽ định dạng cho thành phần h1 là in hoa, h2 là in hoa đầu mỗi ký tự.

h1 {
         text-transform:uppercase
     }
h2 {
         text-transform:capitalize
     }

Bài học đến đây là kết thúc. Chúc các bạn thành công!

Read More

4. Sử dụng SqlDataReader

Một khi đã tạo được kết nối tới cơ sở dữ liệu và thi hành các lệnh query thì chúng ta cần một phương thức nào đó để hỗ trợ cách xử lý dữ liệu thu nhận được. Nếu bạn đã biết về ADO thì một ADO.NET data reader giống như là ADO recordset một chiều phía client, chứ không phải là một đối tượng COM.
Data readers là các đối tượng được cung cấp trong lớp interface ‘System.Data.IdataReader’. Một ‘Data Reader’ có thể gọi là một stream đã kết nối tới cơ sở dữ liệu đọc dữ liệu hiệu quả, theo một chiều và thu nhận dữ liệu theo từng dòng (row).Vì vậy không thể trực tiếp xử lý data reader mà phải xử lý thông qua phương thức ‘ExecuteReader’ của một đối tượng command.
Ví dụ:

SqlConnection conn = new SqlConnection(connectionString);
SqlCommand cmd = new SqlCommand(new string(“query command”), conn);
SqlDataReader reader = cmd.ExecuteReader();

Đoạn code ở trên là minh họa cách tạo một đối tượng trong lớp SqlDataReader.

Chú ý: Quy tắc chung khi sử dụng data reader đơn giản là chỉ thu nhận và trình bày kết quả thu được bằng cách duyệt từng dòng kết quả để xử lí hoặc hiển thị ra.

Thử một vài ví dụ làm việc với Data Reader

using System;
using System.Data;
using System.Data.SqlClient;

public class DemoSqlDateReader 
{
public static void Main() 
{ 
    // Tạo connection 
    SqlConnection conn = new SqlConnection(@"Server = NguyenVanthanh; 
                                             Integrated Security = True; 
                                             Database = Demo"); 
    // Tạo query 
    string sql = @"SELECT masv FROM sinhvien"; 
    try 
    { 
        // Mở kết nối 
        conn.Open(); 
        // Tạo command 
        SqlCommand cmd = new SqlCommand(sql, conn); 
        // Tạo Data Reader 
        SqlDataReader reader = cmd.ExecuteReader(); 
        while (reader.Read()) 
        { 
            Console.WriteLine(" {0} ", reader[0].ToString()); 
        } 
    reader.Close(); 
    } 
    catch (SqlException ex) 
    { 
        // Thông báo lỗi 
        Console.WriteLine(ex.Message.ToString()); 
    } 
    finally 
    { 
        // Đóng kết nối 
        conn.Close(); 
        Console.WriteLine("Close connection !"); 
    } 
} 
}

Trong vòng lặp thu kết quả của ‘data reader’ (reader) phương thức ‘Read()’ trỏ đến giá trị hàng tiếp theo (nếu có) . Bản chất khi reader đã có kết quả sau khi thực thi query thì reader nắm giữ toàn bộ record thu được. vì vậy có thể dùng index để gọi đến một giá trị bất kì trong kết quả thu được nằm trong giới hạn của bound.

Cuối cùng thì phải đóng lại reader. Tại sao đóng ? Vì khi đã kết nối và reader được gắn vào kết nối thì reader sẽ nằm ở đó để lấy dữ liệu khi xử lý. Cứ tưởng tượng một ngôi nhà mà chỉ có người vào không có người ra thì đến một lúc nào đó sẽ không vào được nữa mà muốn ra cũng không được. Tương tự như vậy, phải đóng lại reader sau mỗi lần đọc.

using System; 
using System.Data; 
using System.Data.SqlClient; 

public class DemoSqlDataReader 
{
    public static void Main() 
    { 
        // Tạo connection 
        SqlConnection conn = new SqlConnection(@"Server = NguyenVanThanh; 
                                                 Integrated Security = True; 
                                                 Database = Demo"); 
        // Tạo query 
        string sql = @"SELECT MaSV,TenSV FROM SinhVien"; 
        try 
        { 
            // Mở kết nối 
            conn.Open(); 
            // Tạo command 
            SqlCommand cmd = new SqlCommand(sql, conn); 
            // Tạo Data Reader 
            SqlDataReader reader = cmd.ExecuteReader(); 
            while (reader.Read()) 
            { 
                Console.WriteLine("{0} | {1}", reader[0].ToString(),reader[1].ToString()); 
            } 
            reader.Close(); 
        } 
        catch (SqlException ex) 
        { 
            // Thông báo lỗi 
            Console.WriteLine(ex.Message.ToString()); 
        } 
        finally 
        { 
            // Đóng kết nối 
            conn.Close(); 
            Console.WriteLine("Close connection !"); 
        } 
    } 
}
 

reader[0] : chính là MaSV
reader[1] : chính là TenSV

Giả sử chúng ta SELECT TenSV, MaSV FROM SinhVien
thì reader[0] : chính là TenSV còn reader[1] : chính là MaSV
Trong ví dụ trên sẽ in ra kết quả như sau:
001|SinhVien1
002|SinhVien2
.......

Để hiều rõ hơn các bạn xem video demo sau: Download
Chúc các bạn thành công!

Read More

3. Sử dụng SqlCommand

Giả sử ta có 1 table sinhvien(masv,tensv)
Bạn muốn thêm 1 bản ghi vào table sinhvien này với masv và tensv nhập từ textbox, bạn phải làm gì?
Bạn muốn xóa 1 sinh viên có mã 001 trong csdl, bạn phải làm gì?
Bạn muốn thay đổi tên 1 sinh viên có mã 001, bản phải làm gì?
=> bạn phải viết các lệnh truy vấn trong sql và thực thi nó.
Để làm được điều này trong C#, chúng ta có lớp SqlCommand dùng để thực thi các lệnh sql.
Tạo một đối tượng mới:

SqlCommand cmd=new SqlCommand(string commandText,SqlConnection con);

2 thuộc tính quan trọng của SqlCommand là commandText và connection của nó.
Commandtext là lệnh sql mà bạn cần để thực thi
Connection là 1 đối tượng SqlConnection và trước đó phải được open
Ví dụ:

SqlConnection con=new SqlConnection(connectstring);
con.Open();
SqlCommand cmd=new SqlCommand("Insert into sinhvien values('002','sinhvien2')",con);

Vậy để thực hiện câu lệnh truy vấn này, chúng ta có những cách nào?
Chúng ta có 4 cách thực thi câu lệnh này, mỗi cách sẽ có ra kết quả khác nhau tùy vào phương thức thực thi mà ta lựa chọn
ExecuteNonQuey() : Không trả về gì vì không phải query
ExecuteScalar() : Một giá trị duy nhất
ExecuteReader() : Không hoặc nhiều hàng
ExecuteXmlReader: XML

Vậy dùng chúng trong các trường hợp nào?
- ExecuteNonQuey(): Dùng với các lệnh insert, update, delete dữ liệu
Ví dụ:

SqlConnection con=new SqlConnection(connectstring);
con.Open();
SqlCommand cmd=new SqlCommand("Insert into sinhvien values('002','sinhvien2')",con);
cmd.ExecuteNonquery();

Sau lệnh trên 1 bản ghi mới sẽ được insert vào bảng sinhvien.
- ExecuteScalar(): Dùng trong trường hợp muốn trả về 1 giá trị từ lệnh truy vấn
ví dụ:

SqlConnection con=new SqlConnection(connectstring);
con.Open();
SqlCommand cmd=new SqlCommand("select tensv from sinhvien where masv='001'",con);
string ketqua=cmd.ExecuteScalar().ToString();

Sau lệnh trên, biến ketqua sẽ lấy được tên của sinhvien có mã 001.
- ExecuteReader():Dùng khi ta muốn đọc lần lượt các bản ghi trong csdl và xử lí chúng.

Để hiểu rõ hơn mời các bạn download video này: Download

Chúc các bạn thành công!

Read More

Gửi mail trong PHP

Trong PHP, chức năng gửi mail thực sự rất dễ dàng. Trong bài này, chúng tôi sẽ hướng dẫn các bạn tạo một trang send mail đơn giản. Ngoài ra các bạn có thể phát triển code trong bài này thành những chức năng send mail phức tạp hơn, đa năng hơn.
Để send mail trong PHP, chúng ta cần sử dụng tới hàm mail().

mail(to,subject,message,headers,parameters)

Ví dụ:

< ?php $to = " hotrolaptrinh@gmail.comhotrolaptrinh@gmail.com ";      $subject = "Test mail";      $message = "Email này được gửi từ website: http://hotrolaptrinh.com";      $from = " admin@hotrolaptrinh.comadmin@hotrolaptrinh.com ";      $headers = "";      mail($to,$subject,$message,$headers);      echo "Email đã được gửi đi thành công."; ?>

Gửi mail có sử dụng form

< ?php if (isset($_POST['sendmail'])&& $_POST['sendmail']=="send"){ //send email $email = $_POST['email'] ; $subject = $_POST['subject'] ; $message = $_POST['message'] ; $to=" hotrolaptrinh@gmail.comhotrolaptrinh@gmail.com "; mail( $to, "Subject: $subject",$message, "From: $email" ); echo "Gửi thành công";   } ?>

Email:   
Subject:   
Message:

      
      

Chúc các bạn thành công!

Theo thegioiweb.vn

Read More

Bài 5: Định dạng Font chữ trong CSS

4.1. Thuộc tính font-family:
Thuộc tính font-family có công dụng định nghĩa một danh sách ưu tiên các font sẽ được dùng để hiển thị một thành phần trang web. Theo đó, thì font đầu tiên được liệt kê trong danh sách sẽ được dùng để hiển thị trang web. Nếu như trên máy tính truy cập chưa cài đặt font này thì font thứ hai trong danh sách sẽ được ưu tiên…cho đến khi có một font phù hợp.
Có hai loại tên font được dùng để chỉ định trong font-family: family-names và generic families.
+ Family-names: Tên cụ thể của một font. Ví dụ: Arial, Verdana, Tohama,…
+ Generic families: Tên của một họ gồm nhiều font. Ví dụ: sans-serif, serif,…

Khi lên danh sách font dùng để hiển thị một trang web bạn sẽ chọn những font mong muốn trang web sẽ được hiển thị để đặt ở các vị trí ưu tiên. Tuy nhiên, có thể những font này sẽ không thông dụng lắm nên bạn cũng cần chỉ định thêm một số font thông dụng dự phần như Arial, Tohama hay Times New Roman và bạn cũng được đề nghị đặt vào danh sách font của mình một generic families (thường thì nó sẽ có độ ưu tiên thấp nhất). Thực hiện theo cách này thì sẽ đảm bảo trang web của bạn có thể hiển thị tốt trên bất kỳ hệ thống nào.
Ví dụ sau chúng ta sẽ viết CSS để quy định font chữ dùng cho cả trang web là Times New Roman, Tohama, sans-serif, và font chữ dùng để hiển thị các tiêu đề h1, h2, h3 sẽ là Arial, Verdana và các font họ serif.

body { font-family:”Times New Roman”,Tohama,sans-serif }
h1, h2, h3 { font-family:arial,verdana,serif }

Mở trang web trong trình duyệt và kiểm tra kết quả. Chúng ta thấy phần tiêu đề sẽ được ưu tiên hiển thị bằng font Arial, nếu trên máy không có font này thì font Verdana sẽ được ưu tiên và kế đó sẽ là các font thuộc họ serif. Chú ý: Đối với các font có khoảng trắng trong tên như Times New Roman cần được đặt trong dấu ngoặc kép.

4.2. Thuộc tính font-style:
Thuộc tính font-style định nghĩa việc áp dụng các kiểu in thường (normal), in nghiêng (italic) hay xiên (oblique) lên các thành phần trang web. Trong ví dụ bên dưới chúng ta sẽ thử thực hiện áp dụng kiểu in nghiêng cho thành phần h1 và kiểu xiên cho h2.

h1 { 
        font-style:italic; 
     }
h2 { 
        font-style:oblique; 
     }

4.3. Thuộc tính font-variant:
Thuộc tính font-variant được dùng để chọn giữa chế độ bình thường và small-caps của một font chữ. Một font small-caps là một font sử dụng chữ in hoa có kích cỡ nhỏ hơn in hoa chuẩn để thay thế những chữ in thường. Nếu như font chữ dùng để hiển thị không có sẵn font small-caps thì trình duyệt sẽ hiện chữ in hoa để thay thế.
Trong ví dụ sau chúng ta sẽ sử dụng kiểu small-caps cho phần h1

h1 { 
         font-variant:small-caps
      }

4.4. Thuộc tính font-weight:
Thuộc tính font-weight mô tả cách thức thể hiện của font chữ là ở dạng bình thường (normal) hay in đậm (bold). Ngoài ra, một số trình duyệt cũng hỗ trợ mô tả độ in đậm bằng các con số từ 100 – 900.
Thử in đậm phần p:

p { 
       font-weight:bold 
    }

4.5. Thuộc tính font-size:
Kích thước của một font được định bởi thuộc tính font-size. Thuộc tính này nhận các giá trị đơn vị đo hỗ trợ bởi CSS bên cạnh các giá trị xx-small, x-small, small, medium, large, x-large, xx-large, smaller, larger. Tùy theo mục đích sử dụng của website bạn có thể lựa chon những đơn vị phù hợp. Ví dụ trang web của bạn phục vụ chủ yếu là những người già, thị lực kém hay những
người dùng sử dụng các màn hình máy tính kém chất lượng thì bạn có thể cân nhấc sử dụng các đơn vị qui đổi như em hay %. Như vậy sẽ đảm bảo font chữ trên trang web của bạn luôn ở kích thước phù hợp.
Ở ví dụ sau trang web sẽ có kích cỡ font là 20px, h1 là 3em = 3 x 20 = 60px, h2 là 2em = 40px.

body {
              font-size:20px
          }
h1 {
          font-size:3em
      }
h2 {
          font-size:2em
      }

Thuộc tính font rút gọn
Tương tự như các thuộc tính background, chúng ta cũng có thể rút gọn các thuộc tính font lại thành một thuộc tính đơn như ví dụ sau:

h1 {
         font-style: italic;
         font-variant:small-caps;
         font-weight: bold;
         font-size: 35px;
         font-family: arial,verdana,sans-serif;
     }
 

Thành

h1 {
         font: italic bold 35px arial,verdana,sans-serif;
      }
 

Cấu trúc rút gọn cho các thuộc tính nhóm font:
Font :font-style | font-variant | font-weight | font-size | font-family

Đi qua bài học này, bạn đã nắm bắt được cách định font chữ cho một thành phần trang web cũng như cách sử dụng các kiểu font in nghiêng, in đậm, font small-caps và cách qui định kích thước font. Trong bài học kế chúng ta sẽ được tìm hiểu thêm về các thuộc tính CSS về định dạng văn bản.

Còn nữa......

Read More

Bài 4: Các thuộc tính của nền -Background

3.1. Màu nền (thuộc tính background-color):
Thuộc tính background-color giúp định màu nền cho một thành phần trên trang web. Các giá trị mã màu của background-color cũng giống như color nhưng có thêm giá trị transparent để tạo nền trong suốt.
Ví dụ sau đây sẽ chỉ cho chúng ta biết cách sử dụng thuộc tính background-color để định màu nền cho cả trang web, các thành phần h1, h2 lần lượt là xanh lơ, đỏ và cam.

body {
             background-color:cyan
         }

h1 {
        background-color:red
     }
h2 {
        background-color:orange
     }

3.2. Ảnh nền (thuộc tính background-image):
Việc sử dụng ảnh nền giúp trang web trông sinh động và bắt mắt hơn. Để chèn ảnh nền vào một thành phần trên trang web chúng ta sử dụng thuộc tính background-image.

body {
            background-image:url(logo.png)
        }

Như các bạn đã thấy chúng ta sẽ phải chỉ định đường dẫn của ảnh trong cặp ngoặc đơn sau url.

3.3. Lặp lại ảnh nền (thuộc tính background-repeat):
Nếu sử dụng một ảnh có kích thước quá nhỏ để làm nền cho một đối tượng lớn hơn thì theo mặc định trình duyệt sẽ lặp lại ảnh nền để phủ kín không gian còn thừa. Thuộc tính background-repeat cung cấp cho chúng ta các điều khiển giúp kiểm soát trình trạng lặp lại của ảnh nền. Thuộc tính này có 4 giá trị:
+ repeat-x: Chỉ lặp lại ảnh theo phương ngang.
+ repeat-y: Chỉ lặp lại ảnh theo phương dọc.
+ repeat: Lặp lại ảnh theo cả 2 phương, đây là giá trị mặc định.
+ no-repeat: Không lặp lại ảnh.
Bây giờ, chúng ta hãy thêm thuộc tính background-repeat này vào ví dụ trên thử xem sao.

body {
            background-image:url(logo.png);
            background-repeat:no-repeat;
        }

3.4. Khóa ảnh nền (thuộc tính background-attachment):
Background-attachment là một thuộc tính cho phép bạn xác định tính cố định của ảnh nền so với với nội dung trang web. Thuộc tính này có 2 giá trị:
+ scroll: Ảnh nền sẽ cuộn cùng nội dung trang web, đây là giá trị mặc định.
+ fixed: Cố định ảnh nền so với nội dung trang web. Khi áp dụng giá trị này, ảnh nền sẽ đứng yên khi bạn đang cuộn trang web.

3.5. Định vị ảnh nền (thuộc tính background-position):
Theo mặc định ảnh nền khi được chèn sẽ nằm ở góc trên, bên trái màn hình. Tuy nhiên với thuộc tính background-position bạn sẽ có thể đặt ảnh nền ở bất cứ vị trí nào (trong không gian của thành phần mà nó làm nền). Background-position sẽ dùng một cặp 2 giá trị để biểu diễn tọa độ đặt ảnh nền. Có khá nhiều kiểu giá trị cho thuộc tính position. Như đơn vị chính xác như centimeters, pixels, inches,… hay các đơn vị qui đổi như %, hoặc các vị trí đặt biệt như top, bottom, left, right.
Ví dụ:
Background-position:5cm 2cm- Ảnh được định vị 5cm từ trái qua và 2cm từ trên xuống.
Background-position:20% 30% - Ảnh được định vị 20% từ trái qua và 30% từ trên xuống.
Background-position:bottom left- Ảnh được định vị ở góc trái phía dưới

Thuộc tính background rút gọn
Khi sử dụng quá nhiều thuộc tính CSS sẽ gây khó khăn cho người đọc, công tác chỉnh sửa cũng như tốn nhiều dung lượng ổ cứng cho nên CSS đưa ra một cấu trúc rút gọn cho các thuộc tính cùng nhóm.
Ví dụ: Chúng ta có thể nhóm lại đoạn CSS sau

background-color:transparent;
background-image: url(logo.png);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: right bottom;

thành một dòng ngắn gọn:

background:transparent url(logo.png) no-repeat fixed right bottom;

Từ ví dụ trên chúng ta có thể khái quát cấu trúc rút gọn cho nhóm background:
background: background-color | background-image | background-repeat |
background-attachment | background-position

Theo mặc định thì các thuộc tính không được đề cập sẽ nhận các giá trị mặc định.
Ví dụ: Chúng ta sẽ bỏ qua hai thuộc tính background-attachment và background-position ở dòng mã trên đi:

background:transparent url(logo.png) no-repeat;

Hai thuộc tính không được chỉ định sẽ đơn thuần được thiết lập tới giá trị mặc định
mà chúng ta điều biết là scroll và top left.

Còn nữa.........

Read More

Bài 3: Đơn vị CSS và vị trí đặt CSS

1. Đơn vị trong CSS
Trong CSS2 hỗ trợ các loại đơn vị là đơn vị đo chiều dài và đơn vị đo góc, thời gian,cường độ âm thanh và màu sắc. Tuy nhiên, sử dụng phổ biến nhất vẫn là đơn vị đo hiều dài và màu sắc. Sau đây liệt kê các đơn vị chiều dài và màu sắc dùng trong CSS.
Đơn vị chiều dài
% - Phần trăm
in - Inch(1 inch = 2.54 cm)
cm - Centimeter
mm - Millimeter
em - 1 em tương đương kích thước font hiện hành, nếu font hiện hành có kích cỡ 14px thì 1 em = 14 px. Đây là một đơn vị rất hữu ích trong việc hiển thị trang web.
ex - 1 ex bằng chiều cao của chữ x in thường của font hiện hành.
pt - Point (1 pt = 1/72 inch)
pc - Pica (1 pc = 12 pt)
px - Pixels (điểm ảnh trên màn hình máy tính)

Đơn vị màu sắc
Color-name : Tên màu tiếng Anh. Ví dụ: black, white, red, green, blue, cyan, magenta,…
RGB (r,g,b): Màu RGB với 3 giá trị R, G, B có trị từ 0 – 255 kết hợp với nhau tạo ra vô số màu.
RGB (%r,%g,%b) :Màu RGB với 3 giá trị R, G, B có trị từ 0 – 100% kết hợp.
Hexadecimal RGB :Mã màu RGB dạng hệ thập lục. Ví dụ: #FFFFFF: trắng, #000000: đen, #FF00FF: đỏ tươi.

2. Vị trí đặt CSS

Chúng ta có ba cách khác nhau để nhúng CSS vào trong một tài liệu HTML
+ Cách 1: Nội tuyến (kiểu thuộc tính)
Đây là một phương pháp nguyên thủy nhất để nhúng CSS vào một tài liệu HTML bằng cách nhúng vào từng thẻ HTML muốn áp dụng. Và dĩ nhiên trong trường hợp này chúng ta sẽ không cần selector trong cú pháp.
Lưu ý: Nếu bạn muốn áp dụng nhiều thuộc tính cho nhiều thẻ HTML khác nhau thì không nên dùng cách này.

+ Cách 2: Bên trong (thẻ style)
Thật ra nếu nhìn kỹ chúng ta cũng nhận ra đây chỉ là một phương cách thay thế cách thứ nhất bằng cách rút tất cả các thuộc tính CSS vào trong thẻ style (để tiện cho công tác bảo trì, sửa chữa ấy mà).

+ Cách 3: Bên ngoài (liên kết với một file CSS bên ngoài)
Tương tự như cách 2 nhưng thay vì đặt tất cả các mã CSS trong thẻ style chúng ta sẽ đưa chúng vào trong một file CSS (có phần mở rộng .css) bên ngoài và liên kết nó vào trang web bằng thuộc tính href trong thẻ link.
Đây là cách làm được khuyến cáo, nó đặc biệt hữu ích cho việc đồng bộ hay bảo trì một website lớn sử dụng cùng một kiểu mẫu. Các ví dụ trong sách này cũng được trình bày theo kiểu này.
Cú pháp link tới 1 file css (đặt trong thẻ head)

link rel="stylesheet" type="text/css" href="style.css">

Sự ưu tiên
Trước khi thực thi CSS cho một trang web. Trình duyệt sẽ đọc toàn bộ CSS mà trang web có thể được áp dụng, bao gồm: CSS mặc định của trình duyệt, file CSS bên ngoài liên kết vào trang web, CSS nhúng trong thẻ style> và các CSS nội tuyến. Sau đó, trình duyệt sẽ tổng hợp toàn bộ CSS này vào một CSS ảo, và nếu có các thuộc tính CSS giống nhau thì thuộc tính CSS nào nằm sau sẽ được ưu tiên sử dụng . Theo nguyên tắc đó trình duyệt của bạn sẽ ưu tiên cho các CSS nội tuyến > CSS bên trong > CSS bên ngoài > CSS mặc định của trình duyệt.

Còn nữa......

Read More

Bài 2: Cú pháp CSS

Để tìm hiểu cú pháp CSS chúng ta hãy thử xem một ví dụ sau.
Ví dụ: Để định màu nền cho một trang web là xanh nhạt (light cyan) chúng ta dùng
code sau:
+ Trong HTML:

+ Trong CSS: body

{ background-color:#00BFF3; }

Nhìn qua ví dụ trên ít nhiều chúng ta cũng thấy được mối tương đồng giữa các thuộc tính trong HTML và CSS cho nên nếu bạn đã học qua HTML thì cũng sẽ rất dễ dàng tiếp thu CSS. Đó là một chút lợi thế của câu chuyện hành trình mà Pearl đã nói ở bài trước. Nhưng không sao cả, bây giờ hãy nhìn vào ví dụ của chúng ta và các bạn xem nó có giống với cấu trúc sau không nhé.
Cú pháp CSS cơ bản:

Selector { property:value; } 

Trong đó:
+ Selector: Các đối tượng mà chúng ta sẽ áp dụng các thuộc tính trình bày. Nó là các tag HTML, class hay id (chúng ta sẽ học về 2 thành phần này ở bài học sau). Ví dụ: body, h2, p, img, #title, #content, .username,… Trong CSS ngoài viết tên selector theo tên tag, class, id. Chúng ta còn có thể viết tên selector theo phân cấp như để chỉ các ảnh ở trong #entry, chúng ta viết selector là #entry img, như vậy thì các thuộc tính chỉ định sẽ chỉ áp dụng riêng cho các ảnh nằm trong #entry. Khi viết tên cho class, đôi khi sẽ có nhiều thành phần có cùng class đó, ví dụ thẻ img và thẻ a cùng có class tên vistors nhưng đây lại là hai đối tượng khác 1 cái là ảnh của người thăm, 1 cái là liên kết tới trang người thăm. Nên nếu khi viết CSS ta ghi là .visitors { width:50 } thì sẽ ảnh hưởng tới cả hai thành phần. Nên trong trường hợp này, nếu bạn có ý dùng CSS đó chỉ riêng phần ảnh thì chỉ nền ghi là img .visitors thôi. Một lối viết tên selector nữa đó là dựa trên tên các thuộc tính có trong HTML. Ví dụ trong HTML ta có đoạn mã như vầy: . Để áp dụng thuộc tính CSS cho riêng ô tìm kiếm này chúng ta sẽ dùng selector input[name=”Search”]. Ngoài việc viết tên selector cụ thể, chúng ta cũng có thể dùng một selector đại diện như * { color:red } sẽ tác động đến tất cả các thành phần có trên trang web làm cho chúng có text màu đỏ.

+ Property: Chính là các thuộc tính quy định cách trình bày. Ví dụ: background-color, font-family, color, padding, margin,… Mỗi thuộc tính CSS phải được gán một giá trị. Nếu có nhiều hơn một thuộc tính cho một selector thì chúng ta phải dùng một dấu ; (chấm phẩy) để phân cách các thuộc tính. Tất cả các thuộc tính trong một selector sẽ được đặt trong một cặp ngoặc nhọn sau selector.

Ví dụ:

body { background:#FFF; color:#FF0000; font-size:14pt }

Để dễ đọc hơn, bạn nên viết mỗi thuộc tính CSS ở một dòng. Tuy nhiên, nó
sẽ làm tăng dung lượng lưu trữ CSS của bạn.
Ví dụ:

body {
                        background:#FFF;
                        bolor:#FF0000;
                        font-size:14pt 
                     }

Đối với một trang web có nhiều thành phần có cùng một số thuộc tính,
chúng ta có thể thực hiện gom gọn lại như sau:

h1 { color:#0000FF; 
        text-transform:uppercase }
h2 { 
          color:#0000FF; 
          text-transform:uppercase;  
     }
h3 { 
          color:#0000FF; 
          text-transform:uppercase; 
      }
==> h1, h2, h3 { 
                      color:#0000FF; 
                      text-transform:uppercase; 
                  }

+ Value: Giá trị của thuộc tính. Ví dụ: như ví dụ trên value chính là #FFF dùng để định màu trắng cho nền trang. Đối với một giá trị có khoảng trắng, bạn nên đặt tất cả trong một dấu ngoặc kép. Ví dụ: font-family:”Times New Roman” Đối với các giá trị là đơn vị đo, không nên đặt một khoảng cách giữa số đo với đơn vị của nó. Ví dụ: width:100 px. Nó sẽ làm CSS của bạn bị vô hiệu trên Mozilla/Firefox hay Netscape.

Chú thích trong CSS:
Cũng như nhiều ngôn ngữ web khác. Trong CSS, chúng ta cũng có thể viết chú
thích cho các đoạn code để dễ dàng tìm, sửa chữa trong những lần cập nhật sau.
Chú thích trong CSS được viết như sau /* Nội dung chú thích */
Ví dụ:
/* Màu chữ cho trang web */

Còn nữa......

Read More

Bài 1: Giới thiệu về CSS

1.1. CSS là gì?
Trong lĩnh vực xây dựng, chúng ta có trang trí nội thất; trong lĩnh vực thẩm mỹ - làm đẹp, chúng ta có kỹ thuật make-up; còn trong lĩnh vực thiết kế web chúng ta có CSS. CSS (Cascading Style Sheets) là một ngôn ngữ quy định cách trình bày cho các tài liệu viết bằng HTML, XHTML, XML, SVG, hay UML,…

1.2. Tại sao CSS?
Nếu bạn đã từng học qua HTML thì cũng biết HTML cũng hỗ trợ một số thuộc tính định dạng cơ bản cho text, picture, table, … nhưng nó không thật sự phong phú và chính xác như nhau trên mọi hệ thống. CSS cung cấp cho bạn hàng trăm thuộc tính trình bày dành cho các đối tượng với sự sáng tạo cao trong kết hợp các thuộc tính giúp mang lại hiệu quả. Ngoài ra, hiện tại CSS đã được hỗ trợ bởi tất cả các trình duyệt, nên bạn hoàn toàn có thể tự tin trang web của mình có thể hiển thị hầu như “như nhau” dù trên một hệ thống sử dụng Windows, Linux hay trên một máy Mac miễn là bạn đang sử dụng một phiên bản trình duyệt mới nhất.

1.3. Học CSS cần những gì?
Hành trang thứ nhất mà bạn nên có là một kiến thức về HTML, nó không thật sự cần thiết nếu bạn chỉ dùng CSS để trình bày cho một trang HTML có sẵn, nhưng bạn vẫn cần biết ý nghĩa một số thẻ HTML, nó sẽ có ích khi bạn viết CSS. Tuy nhiên, nếu bạn muốn tự thiết kế, trình bày một trang web của riêng mình thì tùy theo quy mô trang web, bạn cần phải học thêm cả HTML, XHMTL, Javascript và một số ngôn ngữ lập trình web khác.
Hành trang thứ hai chính là một trình soạn thảo văn bản để bạn có thể viết mã CSS. Ở đây, tôi khuyên các bạn nên sử dụng một trình soạn thảo đơn giản như Notepad, Wordpad trong Windows hay Pico trong Linux, Simple Text trong Mac. Nó sẽ giúp bạn chắc là code là của bạn và không có bất kỳ một sự can thiệt nào từ chương trình như khi dùng DreamWeaver, FrontPage, Microsoft Expression Web…
Hành trang thứ ba của bạn chính lả một phiên bản mới nhất của trình duyệt mà bạn thường dùng.

Và cuối cùng, 1 điều rất quan trọng và không thể thiếu để có thể học tốt CSS là các bạn phải thực hành thường xuyên, nhất là sau mỗi bài học. Nó sẽ giúp các bạn nhớ , hiểu rõ ý nghĩa các lệnh trong CSS.

Còn nữa.......

Read More

Video tạo web tin tức bằng ASP.NET

1. Chuẩn bị csdl và viết lớp xử lí
Download

2. Tạo masterpage và tạo menu bằng sitemap
Download

3. Tạo menu 2 lớp bằng sitemap, lấy nội dung ở csdl
Download
Project tạo menu 2 lớp: http://www.mediafire.com/?36729b71d1103wl

4. Tạo trang nhập tin
Download
FCKEditor: http://www.mediafire.com/?obk127v55mbc51s

5. Hiển thị tin tức
Download

6. Tạo trang đăng nhập
Download

7. Tạo trang đăng ký
Download
Encrypt.cs

8. Tạo trang quản lý tin tức
Download


Download Project
Chúc các bạn học tốt!

Read More

Video lập trình CSDL với C#- Windows Form

Video 1: ôn lại 1 số lệnh truy vấn cơ bản
Download

Video 2: Sử dụng SqlConnection để kết nối CSDL
Download

Video 3: Sử dụng SqlCommand và SqlDataReader
Download

Video 4: Sử dụng SqlDataAdapter, Dataset, DataTable
Download

Video 5: Ôn lại bằng 1 ứng dụng winform đơn giản
Download

Video 6: Các sử dụng Store Procedure với C#
Download

Video 7: Cách sử dụng Transaction
Download

Video 8: Hiển thị, thêm, sửa, xóa bằng storeprocedure
Download

Video 9: Cách viết mô hình 3 lớp
Download

Video 10: Tìm kiếm đơn giản
Download

Share toàn bộ folder tài nguyên video:
https://www.mediafire.com/folder/p70m8hoqe6qn4/iloveit1208_HuongDanLapTrinhCSDL

Chúc các bạn học tập tốt!

Read More

Upload Image Trong ASP.NET

Bài viết sau đây sẽ hướng dẫn các bạn upload 1 bức ảnh lên server. Tuy rằng nó khá đơn giản nhưng nếu không biết chúng ta cũng cảm thấy khó khăn.

Đầu tiên tạo giao diện như hình sau: Gồm có các control"
1 FileUpload
1 button
1 textbox (txtpath)
2 lable (lblError,lblSuccess)



Tiếp theo tạo 1 thư mục Images để chứa ảnh

Tại sự kiện clink ở button [tải lên] ta code như sau:

HttpPostedFile files = FileUpload1.PostedFile;
if (FileUpload1.HasFile == false && files.ContentLength > 500000)
{
     lbError.Text = "Ảnh không hợp lệ";
}
else
{
      try
      {
            string path = Server.MapPath("~/Images/" + FileUpload1.FileName);
            FileUpload1.SaveAs(path);
            txtPath.Text = "~/Images/" + FileUpload1.FileName.ToString();
            lbSuccess.Text = "Upload thành công";
       }
       catch
       {
            lbError.Text = "Trùng tên hoặc chưa chọn hình";
       }
}

Chạy chương trình và vào thư mục Images để kiểm tra.
Chúc bạn thành công

Read More

Upload Image Trong ASP.NET MVC

Những ai đã quen dùng ASP.NET để upload ảnh thì sẽ cảm thấy rất dễ chịu với control .NET FileUpload. Nhưng khi mới bắt đầu học ASP.NET MVC, điều đơn giản này lại trở thành khá phức tạp. Bài viết sau đây sẽ hướng dẫn các bạn Upload Image lên server trong ASP.NET MVC

Giao diện chính của chương trình như sau:


Bước 1: Tạo 1 controller sử dụng để tải ảnh lên và hiển thị các ảnh được tải

//Mới đầu vào trang
       public ActionResult UploadImage()
       {
           ViewData["Message"] = "Please choose a image to Upload";
           const string folderThumbPath = "/Content/Images/";
           var directoryThumbs = new DirectoryInfo(Server.MapPath(folderThumbPath));
           var listImages = directoryThumbs.GetFiles().Select(file => file.Name).ToList();
           ViewData["listImages"] = listImages;
           return View("/Views/Home/UploadImage.aspx");
       }

Bước 2: Tạo 1 Controller để thực hiện save ảnh

        //khi ấn save
       [HttpPost]
       public ActionResult UploadImage(string str)
       {
           if (ModelState.IsValid)
           {
               if (Request.Files != null)
               {
                   var posted = Request.Files["uploadFile"];
                   if (posted.FileName != "" && posted.ContentLength<=512000)//500kb                     {                         const string pathStoredImage = "/Content/Images/";                         var imageName = Path.GetFileName(posted.FileName);                         var filePath = pathStoredImage + imageName;                         posted.SaveAs(Server.MapPath(filePath));                     }                 }             }             return RedirectToAction("UploadImage");         } 

Bước 3: Tạo view để hiển thị

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>
<%@ Import Namespace="System.IO" %>


    Upload Image

   
    <%
        var listPictureName = (IList)ViewData["listImages"];%>
    
        

        

            <%=ViewData["message"] %>
        

            
            

        
        

            <%
                System.IO.DirectoryInfo dr = new DirectoryInfo(Server.MapPath("~/Content/Images"));
                FileInfo[] f = dr.GetFiles();
                if (listPictureName != null)
                {
                    foreach (FileInfo item in f)
                    {%>
                        "  width="100px" height="100px"/>
                    <%}
                }%>
        
        
    

Dowload Project

Chúc các bạn thành công!

Read More

2. Dùng SqlConnection để kết nối CSDL

Trong bài 2 này, mình sẽ hướng dẫn các bạn cách dùng lớp SqlConnection để kết nối tới CSDL NorthWind, một bước rất quan trọng trong lập trình cơ sở dữ liệu.

Các bước kết nối tới CSDL trong C#
1. Khai báo namespace:

using System.Data.SqlClient;

2. Tạo 1 ConnectString (Chuỗi kết nối)

string connectionString = @"Data Source=NGUYENVANTHANH;Initial Catalog=Northwind;Persist Security Info=True;User ID=iloveit1208;Password=************;Pooling=False";

Có nhiều cách tạo ConnectString khác nhau, các bạn vào trang http://connectionstrings.com/ để xem thông tin kết nối chi tiết của các hệ quản trị csdl khác nhau.

3. Tạo 1 đối tượng thuộc lớp SqlConnection và truyền vào ConnectString

SqlConnection conn = new SqlConnection(connectionString);

Vậy là bạn đã 1 đối tượng mang đầy đủ thông tin kết nối. Việc tiếp theo là thử xem kết nối có thành công hay không.

try{
// Mở kết nối
conn.Open();
Console.WriteLine("Connection opened !");
}
catch (SqlException sqle){
// Thông báo biến cố khi kết nối
Console.WriteLine("Error: " + sqle.Message);
}
finally{
// Đóng kết nối
conn.Close();
Console.WriteLine("Connection closed !");
}

Chi tiết bạn có thể xem ở video sau:

Download

Chúc các bạn thành công

Read More

1. Các lệnh SQL căn bản cho người lập trình C#

Bài này mình giới thiệu cho các bạn các thành phần cơ bản của SQL mà bạn cần biết để có thể viết một chương trình làm việc với cơ sở dữ liệu bằng C#.

· Câu lệnh Select

· Câu lệnh INSERT

· Câu lệnh UPDATE

· Câu lệnh DELETE

Những phần mềm cần thiết:
- Microsoft Visual Studio
- Microsoft SQL server

1. Câu lệnh SELECT (Lựa chọn dữ liệu trong bảng)
Cú pháp:
SELECT [Danh sách cột] FROM [Tên bảng]

Ví dụ:
SELECT * FROM Employees

Ý nghĩa của câu lệnh trên là lấy tất cả dữ liệu có trong bảng Employees (* có nghĩa là tất cả).

- Nếu chỉ muốn lấy dữ liệu ở một vài cột:
SELECT [Tên cột 1], [Tên cột 2],.... from [Tên bảng]
Ví dụ: SELECT employeeid, firstname, lastname from Employees
Lấy ba cột employeeid, firstname, lastname trong bảng Employees

- Mệnh đề where : lọc dữ liệu trong bảng

SELECT * from Employees where Country="USA"
Lấy ra danh sách tất cả khách hàng ở nước Mĩ

2. Câu lệnh INSERT (Chèn dữ liệu vào bảng)

Cú pháp:
INSERT INTO [Tên bảng] [(danh sách cột)] VALUES(giá trị 1, giá trị 2, ......)

Chú ý:
- Danh sách cột có thể có hoặc không. Nếu không có tức là insert tất cả các cột trong bảng, các giá trị trong values phải tương ứng từng cột trong bảng
- Giá trị trong values phải tương ứng với danh sách cột truyền vào

Ví dụ:

INSERT INTO shippers( CompanyName, Phone )

VALUES ( ‘Microsoft’, ‘000-123456’);

3. Câu lệnh UPDATE (Cập nhật dữ liệu vào bảng)
Cú pháp:
UPDATE [Tên bảng] SET
[Tên cột 1]=[Giá trị 1]
[Tên cột 2]=[Giá trị 2]
.......
[Tên cột n]=[Giá trị n]
WHERE [Khóa chính của bảng]=[giá trị]

Ví dụ:

UPDATE shippers SET CompanyName = 'Google' WHERE ShipperID = 5

4. Câu lệnh DELETE (Xóa dữ liệu khỏi bảng)
Cú pháp:
DELETE FROM [Tên bảng] WHERE [Khóa chính của bảng]=[giá trị]

Chú ý: Nếu không có mệnh đề where thì tất cả dữ liệu trong bảng sẽ bị xóa

Ví dụ:

DELETE FROM Shippers WHERE ShipperID = 5

Bài 1 đến đây là kết thúc, mình chỉ hướng dẫn các bạn 4 lệnh cơ bản hay dùng nhất trong khi lập trình cơ sở dữ liệu với C#. Khi làm project, sẽ có rất nhiều truy vẫn phức tạp hơn. Chính vì vậy, các bạn hãy tìm hiểu thêm các lệnh của sql ở trong sách vở, trên mạng internet. Còn rất nhiều lệnh, nó sẽ giúp ích cho các bạn trong lập trình cơ sở dữ liệu.
Chúc các bạn thành công!

Video hướng dẫn: Download

Read More