네이게이션 건너뛰기
codingEverybody
  • HTML
  • CSS
  • JavaScript
  • PHP
  • HTML 소개
  • HTML 태그
  • HTML 속성
  • 유용한 활용 팁
HTML
  • HTML 소개
  • <!DOCTYPE html>
    선언의 올바른 의미
  • HTML 주석
    올바른 이해와 사용 방법
HTML 태그
  • HTML 태그 소개
  • <a>
  • <abbr>
  • <address>
  • <article>
  • <aside>
  • <audio>
  • <b>
  • <base>
  • <bdi>
  • <bdo>
  • <blockquote>
  • <body>
  • <br>
  • <button>
  • <canvas>
  • <cite>
  • <code>
  • <datalist>
  • <del>
  • <details>
  • <summary>
  • <dfn>
  • <div>
  • <dl>
  • <dt>
  • <dd>
  • <em>
  • <fieldset>
  • <legend>
  • <figure>
  • <figcaption>
  • <footer>
  • <form>
  • <h1>~<h6>
  • <head>
  • <header>
  • <hr>
  • <html>
  • <i>
  • <iframe>
  • <img>
  • <input>
  • <ins>
  • <kbd>
  • <label>
  • <li>
  • <link>
  • <main>
  • <map>
  • <area>
  • <mark>
  • <menu>
  • <meta>
  • <meter>
  • <nav>
  • <noscript>
  • <ol>
  • <optgroup>
  • <option>
  • <output>
  • <p>
  • <picture>, <source>
  • <pre>
  • <progress>
  • <q>
  • <ruby>, <rt>
  • <s>
  • <samp>
  • <script>
  • <section>
  • <select>
  • <small>
  • <span>
  • <strong>
  • <style>
  • <sub>
  • <sup>
  • <table>
  • <caption>
  • <tr>
  • <td>
  • <th>
  • <thead>
  • <tbody>
  • <tfoot>
  • <col>
  • <colgroup>
  • <template>
  • <textarea>
  • <time>
  • <title>
  • <u>
  • <ul>
  • <var>
  • <video>
  • <wbr>
HTML 속성
  • HTML 속성 소개
  • button 태그의 type
    버튼의 컨트롤 유형을 지정
  • <button type="button">
  • <button type="reset">
  • <button type="submit">
  • cite
    인용문이나 변경 내용의 출처를 가리키는 URL
  • class
    하나 이상의 클래스 이름을 지정
  • contenteditable
    에디터 개발을 위해 알아야 할 필수 속성
  • crossorigin
    외부 출처 리소스와의 상호작용 허용 방식을 지정
  • data-*
    표준 사용자 지정 데이터 속성
  • datetime
    해당 요소와 관련된 시간 및 날짜 정보
  • dir
    언어의 특성에 맞게 읽고 쓰는 텍스트의 방향을 지정
  • enterkeyhint
    가상 키보드의 Enter 버튼 모양 설정
  • hidden
    숨겨진 요소임을 나타내는 속성
  • href
    링크된 리소스의 URL을 지정
  • id
    웹 페이지 내에서 유일한 고유식별자 설정
  • img 태그의 alt
    이미지의 대체 텍스트를 지정
  • img 태그의 srcset, sizes
    <img>로 반응형 이미지 구현하기
  • input 태그의 type
    다양한 입력 컨트롤 유형을 지정
  • <input type="button">
  • <input type="checkbox">
  • <input type="color">
  • <input type="date">
  • <input type="datetime-local">
  • <input type="email">
  • <input type="file">
  • <input type="hidden">
  • <input type="image">
  • <input type="number">
  • <input type="password">
  • <input type="radio">
  • <input type="range">
  • <input type="reset">
  • <input type="search">
  • <input type="submit">
  • <input type="tel">
  • <input type="text">
  • <input type="time">
  • <input type="url">
  • inputmode
    가상 키보드의 입력 모드 설정
  • lang
    기본 언어를 지정
  • placeholder
    텍스트 박스에 플레이스홀더 텍스트 지정하기
  • rel
    링크된 리소스와 현재 문서 사이의 관계를 지정
  • <link rel="prefetch">
    다음에 사용될 리소스를 미리 로딩하여 캐시로 저장
  • <link rel="dns-prefetch">
    링크된 외부 도메인의 DNS 조회를 미리 수행
  • <link rel="preconnect">
    링크된 외부 도메인을 미리 연결
  • <link rel="preload">
    리소스를 우선순위로 즉시 다운로드하기
  • role
    웹 콘텐츠 접근성을 개선하는 강력한 도구
  • style
    요소에 직접 CSS 스타일하기
  • tabindex
    요소의 키보드 tab 포커스 탐색 제어하기
  • th 태그의 scope
    향상된 테이블 헤더 구조의 접근성 제공
  • title
    요소에 대한 지침 또는 설명 등의 참고 정보
HTML 유용한 활용 팁
  • HTML 유용한 활용 팁 소개
  • 오픈 그래프 프로토콜
    웹 페이지의 소셜 미디어 공유 미리보기 설정
  • 특수 문자 사용법과 의의
    예약된 문자와의 충돌을 피하며 웹 콘텐츠 작성하기
  • 웹 페이지에서 이모지(이모티콘) 사용하기
    웹 페이지에 이모지 삽입하는 방법
  • <video> 태그 자동 재생 완벽 가이드
    자동 재생 안 됨 해결

HTML 유용한 활용 팁 소개

HTML 다음

HTML을 다룰 때 유용한 활용 팁을 다룹니다.

HTML 유용한 활용 팁
오픈 그래프 프로토콜
웹 페이지의 소셜 미디어 공유 미리보기 설정
소셜 미디어 공유 미리보기를 설정하려면 오픈 그래프 프로토콜을 사용하는 것입니다. 오픈 그래프 프로토콜은 웹 페이지가 소셜 미디어 플랫폼에서 공유될 때 적절한 미리보기 이미지, 제목, 설명 등을 제공하기 위해 메타데이터를 설정하는 방법을 정의합니다.
특수 문자 사용법과 의의
예약된 문자와의 충돌을 피하며 웹 콘텐츠 작성하기
HTML 특수 문자는 웹 페이지에서 예약된 문자로 인식되거나 특수한 의미를 갖는 문자들을 표현하는 데 사용됩니다. 이를 사용함으로써 웹 개발자들은 예약된 문자 충돌을 피하고 원하는 문자를 정확하게 표시할 수 있습니다.
웹 페이지에서 이모지(이모티콘) 사용하기
웹 페이지에 이모지 삽입하는 방법
웹사이트에 감정, 상황, 개념을 다양하게 표현하기 위해 HTML과 CSS를 활용하여 이모티콘을 삽입하는 방법을 알아보고, 주요 이모지의 종류와 관련 유니코드, 그리고 다양한 이모지 리소스를 활용하는 방법을 안내합니다.
<video> 태그 자동 재생 완벽 가이드
자동 재생 안 됨 해결
HTML 비디오 태그를 사용하여 브라우저에서 비디오 파일을 자동으로 재생하는 방법에 대해 다룹니다. 자동 재생과 관련된 속성들과 브라우저 정책, 그리고 디바이스 환경에 대해서도 상세히 알아봅니다. 웹 개발자들을 위한 완벽한 가이드로, 비디오 태그를 사용하여 자동 재생을 구현하는 방법과 자주 발생하는 이슈들에 대한 해결책을 제시합니다.
HTML 다음

codingEverybody는 모든 사람을 위한 코딩 학습서입니다.
모든 자료와 예제는 오류를 방지하기 위해 지속적으로 검토되지만 완전한 정확성을 보증할 수는 없습니다.
따라서, 모든 자료와 예제를 신뢰하기 전에 스스로의 판단에 따라 오류, 버그, 취약점이 없는지 신중하게 테스트하고 검토해야 합니다.
크리에이티브 커먼즈 저작자표시-저작자표시 4.0 국제 에 따라 사용할 수 있습니다.

Copyright © 옵티안. All Rights Reserved.