Các câu hỏi phỏng vấn mà mọi lập trình viên Frontend nên biết

Spread the love

Chào mọi người, hôm nay mình sẽ đưa mọi người đến một chủ đề khá là thú vị mà mình đang nghiên cứu trong thời gian gần đây. Như tiêu đề của bài viết thì chủ đề đó là “Các câu hỏi phỏng vấn mà mọi lập trình viên Frontend nên biết

Mình nghĩ rằng, thật sự là những câu này không quá khó nhưng mà nếu không từng đọc qua hoặc bỏ thời gian ra nghiên cứu và xem bài viết này thì có thể bạn sẽ bị nhầm một số thông tin nào đó nên mình có tổng hợp lại thành một vài câu hỏi dạng này để mọi người cùng tham khảo:

  1. What is HTML and CSS?
    HTML (Hypertext Markup Language) và CSS (Cascading Style Sheets) là 2 trong số các công nghệ chính để xây dựng một trang web. HTML cung cấp cấu trúc trang, CSS sẽ là bố cục, hình ảnh, âm thanh, màu sắc cho nhiều loại thiết bị.
  2. Syntax of HTML?
    Cấu trúc một file HTML sẽ bắt đầu bằng DOCTYPE, sau đó là html -> head -> body và một thẻ đóng của </html>
<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
</body>
</html
  1. How to link HTML with CSS?
    Để thêm một file css vào, lập trình viên cần nhúng nó trong cặp thẻ <head> và đưa vào sau thẻ <link>
<head>
    <link rel="stylesheet" type="text/css" href="styles.css>
</head>
  1. Is it necessary to close all tag in HTML?
    Câu trả lời cho câu hỏi trên là KHÔNG. Nhưng bạn thấy, thì có thẻ HTML <h1></h1>, <div></div>, <p></p>… thì được yêu cầu kết thúc thẻ đóng, nhưng cũng có những thẻ không yêu cầu thẻ đóng như thẻ <link>, <input>, <hr> hoặc là <br>…
  2. What is DOCTYPE or Why we declare Doctype?
    Khai báo <!DOCTYPE html> được sử dụng để thông báo cho trình duyệt của khách truy cập trang web rằng tài liệu được hiện thị là tài liệu HTML.
    HTML có nhiều phiên bản khác nhau như HTML5, HTML 4, HTML 3, XHTML… Khai báo <DOCTYPE> được các trình duyệt sử dụng để xác định loại văn bản HTML. Hiện tại, HTML5 là phiên bản mới nhất và đang được sử dụng phổ biến trên hầu hết các website.
  3. Difference between Inline & Block level Elements?
    Một “Block level elements” luôn bắt đầu bằng một dòng mới và sẽ chiếm độ rộng bằng độ rộng của độ rộng còn sẵn. Một số thẻ như <h1>, <p>, <div>, <li> là ví dụ về thẻ block elements
    Một “Inline level elements” thì không bắt đầu một dòng mới và chỉ có độ rộng bằng độ rộng cần có của bản thân nó. Bản thân thẻ inline sẽ không chấp nhận width, height cũng như margin top và margin bottom
  4. What are the new Tags in HTML5?
    – New semantic elements: header, section, footer, nav, etc…
    – New graphics elements: svg, canvas
    – New multimedia elements: audio, video
    – New form elements: details, keygen, etc…
  5. What is SEMANTIC ELEMENTS
    Chúng là những phần tử mô tả rõ ràng ý nghĩa về cấu trúc của phần tử đó đối với trình duyệt và lập trình viên. Ví dụ như <header>, <footer>, <section>, <aside>, <article>, <form>, <table>
  6. Difference between HTML Elements and Tags
    Nếu có một vài nội dung giữa 2 cặp thẻ html thì chúng được biết đến như là HTML Element, còn lại là Tags. Một ví dụ về Tag như là <p></p>. Còn <p>Milestone</p> thì được coi là HTML Element.
  7. Why and How are shorthand Property is used give example?
    Sử dụng shorthand sẽ giúp chúng ta cắt giảm dược thời gian tải trang và kích thước file.
    Ví dụ như: padding: 10px 20px;
  8. What is Responsive Web Design?
    Responsive web design là làm cho trang web của bạn nhìn trông đẹp hơn trên các thiết bị như là laptop, mobile
    Để làm điều đó thì chúng ta sẽ sử dụng tới media query hoặc là các thư viện như Bootstrap, W3.css, etc..
  9. Difference between Class and ID?
    Sử khác nhau chính nằm ở việc chúng ta có thể sử dụng một class cho nhiều element trên giao diện, điều này không giống như ID. Một ID chỉ được gán duy nhất cho một element trên giao diện.
  10. What is viewport?
    Chúng thường dùng để hiển thị tốt hơn cho website responsive và được đặt bằng 1.0
  11. Differentiable <b> and <strong> or <i> and <em> tags.
    <b> và <strong> đều dùng để bôi đậm chữ trong văn bản nhưng thẻ <strong> có tác dụng cung cấp thông tin nội dung đó cực kì quan trọng
    Tương tự với đó thì thẻ <i> và thẻ <em> đều dùng để in nghiêng chữ trong văn bản nhưng thẻ <em> có tác dụng nhấn mạnh sự quan trọng
  12. CSS Box model
    Tất cả các phần tử HTML đề có thể được coi là những box.
    Css Box model là nói về một cái hộp bao quanh những phần tử HTML. Chúng bao gồm: margins, borders, padding, và nội dung
  13. CSS Type of List in HTML
    Chia ra làm 2 loại:
    – Unordered list
    – Ordered list
    – Definition lists
  14. CSS Position
    Thuộc tính position cung cấp 5 giá trị đặc biệt cho chúng: static, relative, fixed, absolute, sticky.
  15. CSS Inline, Internal and External CSS
    Như tiêu đề, thì có 3 cách để viết css cho một element bao gồm viết inline (trực tiếp), viết internal (viết trong file đó) và viết external (ra file riêng)
  16. CSS Selectors in CSS
    Là một phần của CSS dùng để lựa chọn ra phần tử nào mà bạn muốn style bình thường hay dùng có ID Selector và Class Selector, ngoài ra còn có Universal Selector, Element Type Selector…
  17. CSS Diffrenece between Class and ID
    Sự khác nhau giữa ID và Class là ID có thể được sử dụng để xác định một phần tử, còn class thì dùng để xác định một hoặc nhiều lần. Và cách khai báo trong CSS thì ID là kí hiệu “#”, còn Class là kí hiệu “.”
  18. HTML <span> Tag
    <span> tag là một thẻ inline thường dùng để trình bày nội dung của văn bản theo kiểu thay đổi trạng thái hoặc màu sắc
<h1>WELCOME, <span>ToanNguyen3105</span></h1>
  1. How to create table?
    1. Sử dụng thẻ HTML <table> để xác định một bảng
    2. Sử dụng thẻ HTML <tr> để xác định một dòng của bảng
    3. Sử dụng thẻ HTML <td> để xác định nội dung của bảng
    4. Sử dụng thẻ HTML <th> để xác định tiêu đề chính của dòng
    5. Sử dụng thẻ HTML <caption> để xác định tiêu đề chính của bảng
  2. HTML Form
    Một số kiểu phổ biến của input như là: text, radio, checkbox, submit, password
  3. CSS Opacity
    opacity là một thuộc tính css, dùng để tăng/giảm độ mờ đục của phần tử
  4. CSS :hover
    :hover là một thuộc tính dùng để tương tác với người dùng khi người dùng có sự kiện đưa con trỏ chuột lên một phần tử của giao diện
  5. CSS z-index
    z-index là một thuộc tính của css dùng để xác định độ ưu tiên theo độ sâu, dùng để ưu tiên hiển thị nội dung trên giao diện người dùng.

3 thoughts on “Các câu hỏi phỏng vấn mà mọi lập trình viên Frontend nên biết”

Leave a Comment