Hướng dẫn này mô tả một trang web sử dụng HTML và CSS, bao gồm tất cả các giai đoạn: phát triển website,
tạo một tài khoản trên một hosting miễn phí và cuối cùng tập tin tải lên trang web của chúng tôi trên hosting, lưu trữ miễn phí là một phương pháp nhanh chóng của việc đưa một trang web trực tuyến của chúng tôi trong vòng một vài phút, bất lợi của phương pháp này là chúng ta sẽ có một số quảng cáo hiển thị ở tất cả các lần ở đầu (tiêu đề ở trên).
Bất cứ ai muốn mở một trang web, bạn cần phải biết HTML và CSS, không cần phải là một chuyên gia trong HTML (Hyper Text MArkupe Language), nhưng một số thông tin mã là hoàn toàn cần thiết để hiểu cách những thứ này hoạt động.
Thậm chí nếu bạn xây dựng một trang web, bạn vẫn phải không có ý tưởng về những gì đang xảy ra qua các tập tin sẽ yêu cầu sửa chữa định kỳ các lỗi hoặc thành tựu của sự thay đổi.
Nhiều người chạy trốn mã, nhiều mã giống như chữ tượng hình, không giống như vậy, có người từng nói: "CODE IS POETRY", anh ấy đã đúng, khi bạn thấy rằng một cái gì đó được sinh ra từ một loạt các dòng mã, bạn cảm thấy tuyệt vời, bạn xây dựng một thế giới ảo chỉ với bàn phím và chuột.
Chúng tôi đã sử dụng các ứng dụng được xây dựng bởi các công ty phần mềm trong một thời gian dài, chúng tôi chỉ hoạt động trên máy tính, đã đến lúc lập trình, thực tế nó không phải là ngôn ngữ lập trình, nó là "ngôn ngữ đánh dấu", nhưng chúng tôi sẽ đề cập đến Nó giống như một ngôn ngữ lập trình, vì nghe có vẻ "ngôn ngữ đánh dấu" khá kỳ lạ, HTML là một trong những ngôn ngữ lập trình (đánh dấu) dễ sử dụng nhất hiện nay, chúng ta thấy HTML trên bất kỳ trang web nào, nhiều phần mềm có trong chúng là thành phần của HTML, ngôn ngữ lập trình này ở khắp mọi nơi, đã đến lúc học nó.
Lần đầu tiên có thể được ít khó khăn, nhưng nếu bạn đang cẩn thận hơn, bạn sẽ hiểu ngay rằng không phải tất cả mọi thứ là nó rất khó khăn là điều đơn giản và đẹp, chúng ta tạo ra một cái gì đó với hai bàn tay của chúng tôi, đó là điều quan trọng nhất.
Chúng tôi sẽ tìm hiểu những điều cơ bản, sau đó chúng tôi tìm hiểu làm thế nào để nhập văn bản vào một trang web, sau đó chúng tôi sẽ sắp xếp và sẽ tô màu cho chữ, chúng tôi sử dụng một CSS phong cách trang (cascading style sheets) mà chúng ta sẽ đặt tất cả các phần tử của trang HTML tại tất cả để bạn sẽ đặt trên trang web của chúng tôi là làm cho giống như một mảnh.
Bạn sẽ được học các kỹ thuật đơn giản, cơ bản HTML và CSS, mặc dù đây là những điều cơ bản trong HTML và CSS, sẽ tạo ra một cái nhìn tổng quan thú vị.
Đối với hướng dẫn này, bạn phải trang bị cho mình với sự quan tâm và lòng kiên nhẫn, hướng dẫn này không phải là một cái gì đó chúng ta có thể đủ khả năng để mang về ít, nếu vài giây di chuyển bạn có thể bỏ lỡ một cái gì đó rất quan trọng và bạn sẽ thấy sau đó không còn có ý nghĩa, tập trung thông tin là rất cao và đó là lý do tại sao tôi yêu cầu bạn phải rất, rất cẩn thận.
Sau khi hướng dẫn này, thậm chí khóa học chuyên sâu, tôi sẽ nói, bạn sẽ có một ý tưởng tốt hơn những gì HTML và CSS, bạn có thể kiểm soát các mã tốt và bạn hiểu đầy đủ tài liệu HTML, cảm giác rằng HTML không phải là chỉ là một mảng của heroglife sẽ tiêu tan, bạn biết nó là gì khi bạn nhìn vào một file HTML hoặc CSS một.
Chúng tôi sẽ tìm hiểu về các thẻ (tag), chúng tôi có ở đây một số ví dụ về các thẻ (tags) mà bạn có thể sử dụng trong một tài liệu HTML, đừng lo lắng, không cần phải ghi nhớ tất cả chúng, bạn cần phải tìm hiểu chỉ những điều cơ bản trong bảng đầu tiên phần còn lại có thể được tìm thấy ở đây trên trang web hay trên mạng, khi bạn cần chúng.
Ngay cả các bảng được sắp xếp các thẻ, được thực hiện bằng cách sử dụng HTML.
các yếu tố cơ bản (tags).
Định nghĩa một Web định dạng tập tin | |
tiêu đề tài liệu | |
tài liệu Tilul | |
cơ thể trang HTML | |
BGCOLOR = màu | Màu nền của trang |
TEXT =màu | màu sắc văn bản trên trang |
LINK =màu | trang màu liên kết unvisited |
VLINK =màu | Visited màu liên kết của trang |
ALINK =màu | Tô màu liên kết trong exacutat người dùng nhấp chuột |
CƠ SỞ = url | Trang hình nền |
đoạn | |
<Hn> <Hn> | Các phụ đề của mức tài liệu (n = 1-6) |
thuộc tính cụ thể của văn bản được đóng khung | |
SIZE =n | Kích thước văn bản là 1-7 |
MẶT ="A, b" | Quy định phông chữ: aNếu có sẵn, hoặc b |
COLOR =s | Màu chữ: hoặc là một tên màu hoặc một giá trị RGB |
newline | |
thông tin định dạng sẵn | |
HTML Comenatriu | |
Trung tâm Chất liệu trong trang | |
thước ngang | |
SIZE =x | chiều cao cây thước bằng pixel |
WIDTH =x | chiều rộng Thước bằng pixel hoặc phần trăm |
NOSHADE | Tắt hiển thị bóng cho thước ngang |
CANH =x | Alignment thước ngang trên trang (trái, giữa, phải) |
COLOR =x | Màu ngang cai trị (chỉ IE) |
Đánh dấu loại neo | |
href =url | tham khảo siêu văn bản |
href =#name | Tham chiếu đến một neo nội |
Đặt tên =tên | Định nghĩa của neo nội |
Các mặt hàng vào danh sách .
định nghĩa mô tả | |
định nghĩa danh sách loại | |
trong định nghĩa | |
danh sách tính năng | |
<OL | danh sách có thứ tự (số) |
TYPE =tip | Việc đánh số. Giá trị có thể: A, là, tôi, tôi, 1 |
START =x | Số lượng bắt đầu danh sách đặt hàng |
<UL | danh sách không có thứ tự (đánh dấu) |
TYPE =hình thức | Mẫu dấu. Giá trị có thể: tròn, vuông, đĩa. |
yếu tố nhân vật định dạng .
Dán văn bản in đậm | |
Dán văn bản in nghiêng | |
Dán đánh dấu văn bản | |
font chữ đơn cách | |
bibliogarfica trích dẫn | |
Chương trình danh sách | |
Logic làm nổi bật phong cách | |
Bàn phím văn bản | |
Làm nổi bật lý mạnh mẽ | |
Chương trình hoặc biến | |
<Phông chữ cơ sở SIZE = n> | Chỉ định kích thước font chữ mặc định của trang |
Các bộ khung .
Xác định trang viết | |
CỘT =x | Số lượng và kích thước tương đối của các cột |
ROWS =x | Các dòng kích thước số và tương đối |
BIÊN GIỚI =x | Chỉ định trạng thái của người dùng trên nền tảng của người nổi tiếng hoặc người hâm mộ trên khung hình của FRAMEET (1 hoặc 0) |
frameborder = x | Chỉ định kích thước khung hình |
FRAMESPACING = x | Số lượng không gian giữa hai khung liền kề |
Định nghĩa của một khung cụ thể | |
SRC =url | nguồn URL cho khung |
NAME =tên | Tên khung (được sử dụng cùng với TARGET = tên như một phần của dấu neo |
scrolling =SCRL | Xác định tùy chọn thanh derulare.Valori thể: trên (kích hoạt), tắt (không hoạt động), tự động (tự động) |
frameborder =x | Kích thước của biên giới xung quanh khung |
marginheight =x | Thêm không gian bên trên và bên dưới một khuôn khổ nhất định |
marginwidth =x | không gian Suplimetar trái và phải cho một cụ thể |
Trang phần hiển thị cho người dùng không thể nhìn thấy một khung | |
Framework (chỉ (IE) | |
SRC =url | nguồn khung |
NAME =s | Tên cửa sổ (hữu dụng cho TARGET) |
HEIGHT =x | chiều cao khung nhúng |
WIDTH =x | chiều rộng khung nhúng |
Các yếu tố cho bảng .
bảng HTML | |
BIÊN GIỚI =x | table border |
cellpadding =x | Các không gian phụ trong các tế bào bảng |
cellspacing =x | Thêm không gian giữa các tế bào bảng |
WIDTH =x | Áp đặt bảng chiều rộng |
FRAME =giá trị | tinh chỉnh của bảng |
QUY TẮC =giá trị | Thước bảng điều chỉnh tốt |
borderColor = màu | màu Thông số kỹ thuật Bảng biên giới |
BORDERCOLORLIGHT = màu | Các màu sáng hơn của hai màu sắc quy định |
BORDERCOLORDARK = màu | Màu đậm hơn trong hai màu sắc quy định |
CANH =trái | Canh lề bảng để lề trái của trang, và các văn bản chảy phía bên phải |
CANH =ngay | Canh lề bảng để cạnh phải của trang và các văn bản chảy sang bên trái |
hspace =x | không gian ngang Suplimetar quanh bàn |
vspace =x | không gian dọc Suplimetar quanh bàn |
CỘT =x | Xác định số lượng các cột của một bảng |
Xác định một tập hợp các định nghĩa cột bằng cách sử dụng đánh dấu | |
<COL WIDTH =x> | Xác định chiều rộng cột bằng pixel |
Xác định tiêu đề bảng | |
Xác định cơ thể bảng | |
bảng dòng | |
BGCOLOR =màu | Chỉ định màu nền cho toàn bộ dòng |
CANH =liên kết | liên kết tế bào trên dòng hiện tại (trái, giữa, phải) |
tế bào dữ liệu của bảng | |
BGCOLOR =màu | Chỉ định màu nền cho các dữ liệu di động |
colspan =x | Số lượng các cột bao gồm dữ liệu di động hiện nay |
rowspan =x | Số lượng các dòng kéo dài dữ liệu di động hiện nay |
CANH =liên kết | Gắn kết cấu của các tế bào date.Valori thể: (trái, phải, giữa) |
valign =liên kết | Căn dọc của vật liệu từ các tế bào date.Valori thể: (trên, dưới, giữa) |
CƠ SỞ =url | Chỉ định hình nền cho các ô trong bảng |
nowrap | Không cho phép dòng chia tách các văn bản trong một tế bào |
CANH =cơ sở | Căn tế bào dữ liệu vào cơ sở của văn bản liền kề |
CANH =nhân vật | Căn chỉnh một cột cho một ký tự cụ thể (ký tự mặc định là ".") |
CANH =biện hộ | Căn cả cạnh trái và cạnh phải của văn bản |
Mục để thêm hình ảnh.
<IMG | Đánh dấu hình ảnh đầu vào |
SRC =url | Source File đồ họa |
ALT =văn bản | văn bản thay thế để hiển thị, nếu cần thiết |
CANH =liên kết | Việc sắp xếp các hình ảnh trên trang. Có thể có các giá trị: đầu (top), trung (ở giữa), phía dưới (bên dưới), trái (trái), bên phải (bên phải) |
HEIGHT =x | chiều cao hình ảnh (pixels) |
WIDTH =x | chiều rộng ảnh |
BIÊN GIỚI =x | Khung xung quanh ảnh khi nó được sử dụng như là các siêu liên kết |
hspace =x | Thêm không gian xung quanh hình ảnh theo chiều ngang (pixels) |
vspace =x | Thêm không gian xung quanh hình ảnh theo chiều dọc (theo pixel) |
Forms yếu tố.
dạng HTML hoạt động | |
hoạt động =url | chương trình CGI trên máy chủ nhận dữ liệu |
PHƯƠNG PHÁP =phương pháp | Làm thế nào dữ liệu được truyền đến máy chủ (GET hoặc POST) |
< ĐẦU VÀO | văn bản Camp hoặc dữ liệu đầu vào khác |
TYPE =tùy chọn | Loại trường nhập . Các giá trị có thể có: văn bản, mật khẩu, hộp kiểm, ẩn, tệp, Đài phát thanh, trình, thiết lập lại, hình ảnh. |
NAME =tên | Các lĩnh vực giá trị tên biểu tượng |
VALUE =giá trị | lĩnh vực nội dung văn bản mặc định |
ĐÁNH DẤU = tùy chọn | Nút / hộp kiểm được đánh dấu theo mặc định |
SIZE =x | Số lượng ký tự trong một lĩnh vực văn bản |
SIZE =x | Số ký tự tối đa cho phép |
hộp kiểm nhóm | |
NAME =tên | Các lĩnh vực giá trị tên biểu tượng |
SIZE =x | Số lượng các mục menu được hiển thị một lần (mặc định = 1) |
NHIỀU =x | Cho phép nhiều lựa chọn các mục menu |
<TÙY CHỌN | Sự lựa chọn cụ thể trong một lĩnh vực |
VALUE =giá trị | Kết quả là giá trị của menu lựa chọn này |
Trại cốt văn bản trên nhiều dòng | |
NAME =tên | Các lĩnh vực giá trị tên biểu tượng |
ROWS =x | Số lượng các dòng của hộp văn bản |
CỘT =x | Số lượng các cột (ký tự) trên mỗi dòng của hộp văn bản |
Chia sẻ hình thức hợp lý trong phần | |
Tên liên bộ các lĩnh vực (fieldsets) | |
CANH =s | Chỉ định truyền thuyết liên kết (giải thích) đang bày (trên, dưới, trái, phải) |
tabIndex =x | Xác định các mục để khi người dùng nhấn phím Tab |
ACCESKEY =c | Cung cấp khóa cụ thể từ các phím tắt bàn phím đi kèm với một mặt hàng cụ thể |
TÀN TẬT | Yếu tố không hoạt động, nhưng được hiển thị trên màn hình |
chỉ đọc | Nguyên tố này được hiển thị trên màn hình nhưng không thể chỉnh sửa |
yếu tố nâng cao.
Thông tin cụ thể về các kiểu mô hình | |
TYPE =val | Các kiểu mẫu. Thường là "văn bản / css" |
Thường bao gồm một kịch bản Javascript trong trang web của bạn | |
LANGUAGE =ngôn ngữ | Ngôn ngữ sử dụng |
TRƯỜNG =sự kiện | Tổ chức sự kiện mà gây nên việc thực hiện các kịch bản cụ thể |
CHO =numeobiect | Trang Object Name trên có tác kịch bản |
Nếu bạn muốn truy cập các trang web tiến hành hướng dẫn, bạn có thể truy cập tại địa chỉ này: http://www.videotutorial.150m.com.
Tôi khuyên bạn giải nén tập tin đính kèm và nghiên cứu ba file html hoặc CSS file bằng Notepad ++ hoặc một trang web chương trình chỉnh sửa theo cách này có thể làm thay đổi cau thậm chí có thể ghi chú trong nó, bạn sẽ tìm hiểu html mà không có em tài khoản.
Bạn mong quý vừa ý và chào đón các bạn ở các bài hướng dẫn sau đây trong loạt bài này và xa hơn nữa.
Xem Bình luận (333)
Rất đẹp, tấn thông tin trong hướng dẫn này.
Hướng dẫn này có thể được gọi là truyền về HTML và CSS.
Có thể bạn không nhận được học trong một vài tháng bạn có thể tìm hiểu ở đây trong một giờ hoặc lâu hơn, tôi đã nhìn thấy nó trước khi được đăng và có thể nói rằng tôi ấn tượng trích dẫn thông tin có thể phù hợp trong một hướng dẫn.
Có lúc tôi cảm thấy cần phải uống nước, mặc dù tôi chỉ xem các hướng dẫn, tôi cũng không muốn nghĩ, trích dẫn Dan uống nước sau đó.
Có gì đó không để học HTML và / hoặc CSS sau khi hướng dẫn này.
Aoleu, những gì tôi đã cố gắng học trong khoảng 3 tháng, dường như tôi không có thời gian ...
Cảm ơn rất nhiều, tôi xem nó một cách cẩn thận!
vâng bạn đúng cristi nhưng tôi thất vọng vì tôi nghĩ bạn sẽ làm hướng dẫn :( nhưng dù sao bravo dan hướng dẫn rất tốt
Thật không hay những gì bạn nói và tôi thành thật nói với bạn điều này, người đàn ông này đã vật lộn khoảng một tiếng rưỡi để dạy bạn cách tạo một trang web từ đầu và bạn nói bạn thất vọng vì anh ta không làm được? Bạn có thể tưởng tượng người đàn ông đã bỏ ra bao nhiêu công sức và mất bao nhiêu thời gian để dạy chúng tôi những điều cơ bản về html và css không, hãy suy nghĩ trước khi bạn mở miệng rằng nó sẽ không phù hợp với bạn để gửi công việc và sau đó để lại những bình luận không cần thiết khác như bạn thất vọng vì anh ấy đã không đặt, một người khác đã tạo ra hướng dẫn này, cảm ơn bạn rằng bạn có nơi để học;)
Bạn nghĩ gì, rằng loạt bài về "Cách tạo một trang web" đã kết thúc.
Trong hướng dẫn tiếp theo sẽ là tôi.
Bởi vì những gì các hướng dẫn tiếp theo tôi sẽ cần phải được theo dõi hướng dẫn này được thực hiện bởi Dan.
Những gì tôi trình bày là khác nhau từ các hướng dẫn, tôi đã aza Dan, nhưng thông tin trong đó sẽ là không thể thiếu cho sự hiểu biết đúng đắn của sự vật.
Có một số cách để xuất bản nội dung trên web, nhưng tất cả đều có một mẫu số chung, HTML và CSS, nếu không có họ bạn không thể làm bất cứ điều gì.
Xin chào Cristi, sẽ đến một loạt các php hoặc js?
Chúng tôi nói về tất cả mọi thứ, nhưng cũng PHP và JS trang web liên kết với HTML, HTML không thể không có.
PHP được sử dụng nhiều hơn để trích xuất dữ liệu từ cơ sở dữ liệu, các trang web vẫn trên HTML, cho dù chúng ta đang nói về các trang web động (php, dhtml, asp, jsp, cf) hoặc chúng ta đang nói về một trang web tĩnh, chúng ta sẽ nói về một trang web tĩnh sử dụng HTML, không có gì có thể được thực hiện mà không có nó.
Nhiều người mắc một lỗi lớn "Tôi không muốn có trang HTML nữa, tôi muốn có trang php động", đó là một lỗi lớn, HTML được sử dụng ở hầu hết mọi nơi, cho dù chúng ta đang nói về trang động hay trang tĩnh.
JS (java script) là không giống với JSP (Java Server Pages) mà phụ thuộc vào một máy chủ, các trang web JS được sử dụng cho một số kịch bản, không cần bất cứ kịch bản máy chủ JS có thể chạy trên bất kỳ trình duyệt mà không cần các thành phần máy chủ, và trong hướng dẫn này, Dan sử dụng một loạt các kịch bản JS (sưu tập ảnh), để cụ sử dụng đúng JS, không có các trang web đầy đủ với JS thay vì có đầy đủ các trang web sử dụng Java các trang máy chủ đó là cái gì khác, mặc dù họ có vẻ giống nhau.
Tôi biết bạn đã bắt đầu nghiên cứu "mã" từ lâu, hướng dẫn này là một trợ giúp tuyệt vời, Dan đã làm một điều phi thường với hướng dẫn này, bạn thậm chí không nhận ra hướng dẫn này có giá trị như thế nào, theo hướng dẫn bạn có hầu hết tất cả các thẻ ) được sử dụng trong HTML, bạn có thể sử dụng chúng, đặc biệt là vì mỗi cái có một mô tả.
Đừng để ALEX, mã nghỉ của bạn, nó được dựa.
Tin tôi đi, bạn thiếu KHÔNG CHO TIỀM NĂNG!
wow rất nhiều thông tin có cấu trúc rất tốt để mọi người có thể hiểu. Cá nhân tôi đã xem hướng dẫn chỉ để tìm hiểu một cái gì đó mới, và khi hướng dẫn tiến triển, tôi đã rất ngạc nhiên về việc một trang web có thể được thực hiện dễ dàng như thế nào, không quá tải và rất dễ chịu để xem. Xin chúc mừng cho hướng dẫn này mà còn cho tất cả những người khác. Tôi mong chờ "thông tin" tiếp theo (lời của cristi) với thông tin.
Xin chúc mừng!! Hướng dẫn rất hay, Nó sẽ là một Rumani đầy nhà thiết kế Web :) (hy vọng !!)
Nó sẽ là một dreamweaver hướng dẫn? Dc không sử dụng Dreamweaver hoặc trong hướng dẫn của bạn?
Xin chúc mừng cho tất cả các hướng dẫn ... bạn là người mạnh nhất;)
Xin chào .. hướng dẫn này thực sự tuyệt vời, có "tấn" thông tin..và tôi nghĩ rằng tôi đã phải học html cơ bản ở frontpage 98 'khi thực hiện hàng tá bài kiểm tra lấy từ sách trong thư viện vì tôi không có vào thời điểm đó và bây giờ tôi có thể xem một hướng dẫn giải thích mọi thứ tôi cần biết .. rõ ràng là tôi đã phát triển :))) .. Tôi thích thực tế rằng nó đã được giải thích từng bước và chúng được đặt trên trang web tất cả các lệnh cơ bản + một ví dụ có thể được thực hiện .. rõ ràng là bạn biết những gì bạn đang làm bạn là giáo viên thực sự !!
Nhưng hầu hết những người làm việc trong thiết kế web sử dụng các chương trình tự động thực hiện các đơn đặt hàng và câu hỏi của tôi là bạn sẽ làm cho một hướng dẫn với một chương trình như vậy ??
Tôi biết rằng bạn đã thực hiện hướng dẫn này để hiểu các lệnh và do đó hiểu rõ hơn về các chương trình thiết kế web ... nhưng tôi vẫn tò mò muốn xem bạn sẽ tiếp tục với loạt bài hướng dẫn này vì có nhiều thảo luận về chủ đề này ngay cả khi một số người xem xét nó nhàm chán khi nói đến các hướng dẫn giống như hướng dẫn của Dan, mà tôi chúc mừng nhân dịp này cho hướng dẫn ...