📥 Tải xuống của tôi Bảng gian lận HTML, CSS và PHP, đầy đủ mọi thứ bạn cần biết và nhớ về ba ngôn ngữ mã hóa này.
- HTML là gì?
- Ví dụ HTML5 (Code PlayGround)
- 📥 Trang tính gian lận HTML
- CSS là gì?
- 📥 Trang tính gian lận CSS
- PHP là gì?
- 📥 Trang Cheat PHP
- 📥 HTML CSS và PHP Cheat Sheet
Nghệ thuật viết mã có thể mất nhiều năm để thành thạo hoàn toàn với tất cả các thẻ, cú pháp và các yếu tố khác của ngôn ngữ lập trình thường đan xen với nhau.
Ngay cả những nhà phát triển có kinh nghiệm hơn cũng có thể rơi vào cái bẫy quên cú pháp chính xác cho các tác vụ cụ thể. Như vậy, thật không thực tế khi mong đợi nhiều màu xanh hơn các nhà phát triển web để nắm bắt hoàn hảo về nghệ thuật.
Đây là lý do tại sao cheat sheet cho HTML, CSS và PHP cực kỳ hữu ích, bất kể bạn đã luyện tập bao lâu. Nó phục vụ như một hướng dẫn nhanh để tìm các lệnh và cú pháp phù hợp, cho phép bạn tập trung vào phát triển web thực tế.
Dưới đây, bạn sẽ tìm thấy các bảng gian lận nghiêng về trực quan, trước đó là các phần bổ sung nhanh để hỗ trợ bạn trong nỗ lực viết mã của mình. Tôi cũng đã làm cho nó dễ dàng được đánh dấu, lưu hoặc in để thuận tiện cho bạn.
HTML là gì?
HTML là viết tắt của Hypertext Markup Language – một mã được sử dụng để tạo cấu trúc cho một trang web và nội dung của nó.
Ngôn ngữ đánh dấu này bao gồm một loạt các yếu tố được sử dụng để làm cho nội dung xuất hiện hoặc hoạt động theo một cách nhất định và là một phần chính của mã giao diện người dùng của mọi trang web.
HTML là ngôn ngữ để mô tả cấu trúc của các trang Web… Với HTML, các tác giả mô tả cấu trúc của các trang bằng cách sử dụng đánh dấu. Các phần tử của ngôn ngữ gắn nhãn các phần nội dung như đoạn văn, danh sách, bảng, v.v. - từ W3.org
Ví dụ: bạn có thể bao quanh hoặc bao bọc các phần khác nhau của nội dung - nơi các thẻ bao quanh có thể tạo siêu liên kết từ hoặc hình ảnh đến một trang khác. Bạn cũng có thể sử dụng điều này để in nghiêng các từ và làm cho phông chữ lớn hơn hoặc nhỏ hơn, trong số các phông chữ khác.
Theo ghi nhận của W3, một số điều khác mà HTML cho phép bạn thực hiện bao gồm:
- Xuất bản tài liệu trực tuyến với tiêu đề, văn bản, bảng, danh sách, ảnh, Vv
- Truy xuất thông tin trực tuyến chỉ bằng một nút bấm qua liên kết siêu văn bản.
- Thiết kế các hình thức để thực hiện các giao dịch với các dịch vụ từ xa tìm kiếm thông tin, đặt chỗ hoặc đặt mua sản phẩm, trong số các chức năng khác.
- Bao gồm bảng tính, video clip và các phương tiện khác và các ứng dụng đã có trong tài liệu của bạn.
Vì vậy, nếu bạn định xếp hàng "Con chó của tôi rất ngọt ngào" tự nó, bạn có thể chỉ định rằng đó là một đoạn văn bằng cách đặt nó trong các thẻ đoạn văn (sẽ tìm hiểu thêm về điều này sau), trông giống như sau: Con chó của tôi rất ngọt ngào
Sự khác biệt giữa HTML và HTML5 là gì?
Như tên cho thấy, HTML5 là phiên bản thứ năm của tiêu chuẩn HTML. Nó hỗ trợ tích hợp video và âm thanh vào ngôn ngữ, giúp giảm nhu cầu về các phần tử và plugin của bên thứ ba.
Dưới đây là những điểm khác biệt chính giữa HTML và HTML5:
HTML
- Không hỗ trợ âm thanh và video mà không hỗ trợ trình phát flash.
- Sử dụng cookie để lưu trữ dữ liệu tạm thời.
- Không cho phép JavaScipt chạy trong trình duyệt.
- Cho phép đồ họa vector bằng cách sử dụng các công nghệ khác nhau như VML, Silver-light và Flash, trong số các công nghệ khác.
- Không cho phép kéo và thả hiệu ứng.
- Hoạt động với tất cả các trình duyệt cũ hơn.
- Ít thân thiện với thiết bị di động.
- Khai báo Doctype dài và phức tạp.
- Không có các thành phần như nav và header, cũng như các thuộc tính như charset, async và ping.
- Rất khó để có được Vị trí địa lý thực sự của người dùng bằng cách sử dụng trình duyệt.
- Không thể xử lý cú pháp không chính xác.
HTML5
- Hỗ trợ điều khiển âm thanh và video với việc sử dụng và các thẻ.
- Sử dụng cơ sở dữ liệu SQL và bộ đệm ứng dụng để lưu trữ dữ liệu ngoại tuyến.
- Cho phép JavaScript hoạt động trong nền với việc sử dụng JS Web worker API.
- Đồ họa vector là một phần cơ bản của HTML5, giống như SVG và canvas.
- Cho phép kéo và thả các hiệu ứng.
- Làm cho nó có thể vẽ hình dạng.
- Hỗ trợ tất cả các trình duyệt mới như Firefox, Mozilla, Chrome và Safari.
- Thân thiện với thiết bị di động hơn.
- Khai báo Doctype rất đơn giản và dễ dàng.
- Có các thành phần mới cho cấu trúc web như điều hướng, đầu trang và chân trang, cùng các thành phần khác, và cũng có các thuộc tính charset, async và ping.
- Làm cho việc mã hóa ký tự trở nên đơn giản và dễ dàng.
- Cho phép theo dõi Vị trí địa lý của người dùng bằng cách sử dụng API Vị trí địa lý JS.
- Có khả năng xử lý cú pháp không chính xác.
Ngoài ra, có nhiều phần tử của HTML đã được sửa đổi hoặc loại bỏ khỏi HTML5. Bao gồm các:
- - Thay đổi để
- - Thay đổi để
- - Thay đổi để
- - Đã xóa
- - Đã xóa
- - Đã xóa
- - Không có thẻ mới. Sử dụng CSS.
- - Không có thẻ mới. Sử dụng CSS.
- - Không có thẻ mới. Sử dụng CSS.
- - Không có thẻ mới. Sử dụng CSS.
- - Không có thẻ mới. Sử dụng CSS.
Trong khi đó, HTML5 cũng bao gồm một số phần tử mới được thêm vào. Bao gồm các:
- nav
- âm thanh
- hình tượng
- tiến bộ
- lệnh
- thời gian
- danh sách dữ liệu
- video
- con số
- mét
- dữ liệu
- phần
- thời gian
- qua một bên
- vải
- tóm tắt
- rp
- rt
- chi tiết
- wbr
- cú đội đầu
- chân
- bàn phím
- nhúng
- bài viết
- nhóm
- bdi
- dấu
- đầu ra
- nguồn
- theo dõi
- phần
- hồng ngọc
Ví dụ HTML5 (Code PlayGround)
Ví dụ về cấu trúc ngữ nghĩa
In HTML5 có một số yếu tố ngữ nghĩa có thể được sử dụng để xác định các phần khác nhau của trang web. Dưới đây là những cái phổ biến nhất:
Tiêu đề
<header>
<h1>Guide to Search Engines</h1>
</header>
Điều hướng
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
Phần
<section>
<h2>Internet Browsers</h2>
<p>Google Chrome, Mozilla Firefox, Internet Explorer, Safari and Opera dominate the browser market.</p>
</section>
Bài báo
<article>
<h3>Google Chrome</h3>
<p>Google Chrome is a web browser developed by Google, released in 2008. Chrome is the world's most popular web browser today!</p>
</article>
Aside (thanh bên)
<p>Google Chrome is a cross-platform web browser developed by Google.</p>
<aside>
<h4>History of Mozilla</h4>
<p>Mozilla is a free software community founded in 1998.</p>
</aside>
Chân trang
<footer>
<p>Copyright Example.com. Read our <a href="#">privacy policy</a>.</p>
</footer>
Ví dụ về Định dạng Văn bản Cơ bản
Đề mục đến
<h1>Heading level 1</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>
<h5>Heading level 5</h5>
<h6>Heading level 6</h6>
Đoạn văn ( & )
<p>Paragraph of text with a sentence of words.</p>
<p>Paragraph of text with a word that has <em>emphasis</em>.</p>
<p>Paragraph of text with a word that has <strong>importance</strong>.</p>
Không theo thứ tự và danh sách đặt hàng
<ul>
<li>HTML5</li>
<li>CSS3</li>
<li>PHP</li>
</ul>
<ol>
<li>HTML5</li>
<li>CSS3</li>
<li>PHP</li>
</ol>
Blockquote và trích dẫn
<blockquote cite="https://www.huxley.net/bnw/four.html">
<p>Words can be like X-rays, if you use them properly – they'll go through anything. You read and you're pierced.</p>
</blockquote>
<cite>– Aldous Huxley, Brave New World</cite>
Liên kết
<p>Search for it on <a href="https://www.google.com/" title="Google search engine">Google</a>
Cái nút
<button name="button">I am a Button. Click me!</button>
Ngắt dòng
<p>The line break tag produces a<br> line break in<br> text (carriage-return)</p>
Đường chân trời
<p>This is the first paragraph of text.</p><hr><p>This is second paragraph of text.</p>
Địa chỉ
<address>
Acme Inc<br>
PO Box 555, New York, USA<br>
Call us: <a href="tel:+1-555-555-555">+1-555-555-555</a><br>
Email us: <a href="mailto:[email protected]">[email protected]</a>
</address>
Chỉ số dưới & chỉ số trên
<p>The chemical formula of water is H<sub>2</sub>O</p>
<p>This text is <sup>superscripted</sup></p>
Viết tắt
<p><abbr title="Hypertext Markup Language">HTML</abbr> is easy to learn.</p>
Mã
<p>This is normal text. <code>This is code.</code> This is normal text.</p>
Thời gian
<p>The movie starts at <time>20:00</time>.</p>
Đã xóa
<p>I am <del>wrong</del> right, you are <del>right</del> wrong.</p>
Ví dụ về bảng
Ví dụ về đầu bàn, thân và chân
<table>
<thead>
<tr> ...table header... </tr>
</thead>
<tfoot>
<tr> ...table footer... </tr>
</tfoot>
<tbody>
<tr> ...first row... </tr>
<tr> ...second row... </tr>
</tbody>
<tbody>
<tr> ...first row... </tr>
<tr> ...second row... </tr>
<tr> ...third row... </tr>
</tbody>
</table>
Ví dụ về tiêu đề bảng, hàng và dữ liệu
<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>John</td>
<td>Doe</td>
<td>50</td>
</tr>
<tr>
<td>Jane</td>
<td>Doe</td>
<td>34</td>
</tr>
</table>
Ví dụ về phương tiện
Hình ảnh
<img src="images/dinosaur.png"
alt="The head and torso of a dinosaur skeleton;it has a large head with long sharp teeth"/>
Hình ảnh
<picture>
<source type="image/svg+xml" srcset="pyramid.svg">
<source type="image/webp" srcset="pyramid.webp">
<img src="pyramid.png" alt="regular pyramid built from four equilateral triangles">
</picture>
Nhân vật
<figure>
<img src="/images/frog.png" alt="Tree frog" />
<figcaption>Tree frog by David Clode on Unsplash</figcaption>
</figure>
Video
<video controls width="400" height="400" autoplay loop muted poster="poster.png">
<source src="rabbit.mp4" type="video/mp4">
<source src="rabbit.webm" type="video/webm">
<source src="rabbit.ogg" type="video/ogg">
<source src="rabbit.mov" type="video/quicktime">
<p>Your browser doesn't support HTML5 video. Here is a <a href="rabbit.mp4">link to the video</a> instead.</p>
</video>
Hoàn thành Trang tính Cheat HTML
Cho dù bạn là một nhà phát triển dày dạn kinh nghiệm hay một người chỉ muốn bắt đầu chân ướt chân ráo vào ngành, thì việc có một Bảng cheat định dạng HTML tiện dụng. Và tôi đã thiết kế một thứ có thể giúp bạn từng bước một.
CSS là gì?
Cascading Style Sheets hoặc CSS mô tả cách các phần tử HTML sẽ được hiển thị trên màn hình. Bởi vì nó có thể kiểm soát bố cục của nhiều trang cùng một lúc, nó có thể giúp bạn tiết kiệm rất nhiều thời gian và công sức.
CSS là ngôn ngữ để mô tả cách trình bày của các trang Web, bao gồm màu sắc, bố cục và phông chữ. Nó cho phép một người điều chỉnh bản trình bày với các loại thiết bị khác nhau, chẳng hạn như màn hình lớn, màn hình nhỏ hoặc máy in. - từ W3.org
Sự khác biệt giữa HTML và CSS là gì?
Mặc dù HTML và CSS đều là ngôn ngữ được sử dụng để xây dựng các trang web và ứng dụng, chúng có các chức năng khác nhau.
HTML là những gì bạn sử dụng để chỉ định cấu trúc và nội dung sẽ được hiển thị trên trang web.
Mặt khác, CSS được sử dụng để sửa đổi thiết kế web của các phần tử HTML trên trang web (bao gồm bố cục, hiệu ứng hình ảnh và màu nền).
HTML tạo ra cấu trúc và nội dung, CSS thực hiện thiết kế hoặc phong cách. Cùng với nhau, HTML và CSS tạo nên một giao diện trang web.
Cú pháp CSS là gì?
Cú pháp CSS được tạo thành từ một bộ chọn và một khối khai báo.
Bộ chọn xác định phần tử HTML được tạo kiểu trong khi khối khai báo chứa một hoặc nhiều khai báo hoặc cặp CSS, tên thuộc tính và giá trị có dấu hai chấm giữa chúng.
Các khai báo được phân tách bằng dấu chấm phẩy và các khối khai báo luôn được đặt trong dấu ngoặc nhọn.
Ví dụ: nếu bạn muốn sửa đổi giao diện của tiêu đề 1, thì cú pháp CSS của bạn sẽ giống như sau: h1 {color: red; font-size: 16pc;}
Toàn bộ CSS Cheat Sheet
CSS đủ dễ sử dụng. Thách thức là có rất nhiều bộ chọn và khai báo mà việc ghi nhớ tất cả chúng là rất khó nếu không muốn nói là không thể. Tuy nhiên, bạn không cần phải ghi nhớ chúng.
Dưới đây là một cheat sheet cho CSS và CSS3 mà bạn có thể sử dụng bất cứ lúc nào.
PHP là gì?
PHP là từ viết tắt của Hypertext Preprocessor, một ngôn ngữ kịch bản mã nguồn mở, được nhúng HTML phổ biến được sử dụng để phát triển các trang web động, ứng dụng web hoặc trang web tĩnh.
từ PHP là một ngôn ngữ phía máy chủ, các tập lệnh của nó được thực thi trên máy chủ (không phải trong trình duyệt) và đầu ra của nó là một HTML thuần túy trên trình duyệt.
PHP là một ngôn ngữ kịch bản mã nguồn mở được sử dụng rộng rãi, đặc biệt thích hợp cho phát triển web và có thể được nhúng vào HTML. - từ PHP.net
Ngôn ngữ kịch bản phía máy chủ này chạy trên nhiều hệ điều hành, bao gồm Windows, Mac OS, Linux và Unix. Nó cũng tương thích với hầu hết các máy chủ như Apache và IIS.
So với các ngôn ngữ khác như ASP và JSP, PHP rất dễ học cho người mới bắt đầu. PHP cũng cung cấp nhiều tính năng mà các nhà phát triển cấp cao cần.
Sự khác biệt giữa PHP và HTML là gì?
Mặc dù cả hai ngôn ngữ đều rất quan trọng đối với phát triển web, PHP và HTML khác nhau theo một số cách.
Sự khác biệt chính nằm ở hai ngôn ngữ được sử dụng để làm gì.
HTML được sử dụng cho phía máy khách (hoặc front-end) phát triển, trong khi PHP được sử dụng cho phía máy chủ phát triển.
HTML là ngôn ngữ mà các nhà phát triển sử dụng để tổ chức nội dung trên một trang web, chẳng hạn như chèn văn bản, hình ảnh, bảng và siêu liên kết, định dạng văn bản và chỉ định màu sắc.
Trong khi đó, PHP được sử dụng để lưu trữ và truy xuất dữ liệu từ cơ sở dữ liệu, thực hiện các hoạt động logic, gửi và trả lời email, tải lên và tải xuống tệp, phát triển ứng dụng máy tính để bàn, v.v.
Về loại mã, HTML là tĩnh trong khi PHP là động. Mã HTML luôn giống nhau mỗi khi được mở, trong khi kết quả PHP khác nhau tùy thuộc vào trình duyệt của người dùng.
Đối với các nhà phát triển mới, cả hai ngôn ngữ đều dễ học, mặc dù đường cong học tập với HTML ngắn hơn so với PHP.
Hoàn thành bảng gian lận PHP
Nếu bạn là một lập trình viên mới làm quen muốn thành thạo hơn về PHP hoặc mở rộng kiến thức về nó, thì đây là một Bảng gian lận PHP bạn có thể nhanh chóng tham khảo.
Bảng lừa đảo này bao gồm các hàm PHP - là các phím tắt cho các mã được sử dụng rộng rãi - được tích hợp sẵn trong ngôn ngữ kịch bản.
Bảng Cheat HTML, CSS và PHP Cuối cùng
Cho dù bạn là nhà phát triển dày dạn kinh nghiệm hay chỉ là người mới bắt đầu viết mã, thật tuyệt khi có thứ gì đó mà bạn luôn có thể quay lại để tham khảo hoặc chỉ đơn giản là làm mới bộ nhớ của mình.
Và như một món quà dành cho các nhà phát triển, những người đã tung hứng giữa HTML, CSS và PHP, đây là bảng gian lận ULTIMATE, đầy đủ mọi thứ bạn cần biết và nhớ về ba ngôn ngữ mã hóa sau:
Tải xuống Bảng lừa đảo HTML, CSS & PHP kết hợp