본문 바로가기

HTML35

동영상 삽입을 위한 HTML video 태그 Video 태그란? 태그가 이미지를 삽입하는 용도라면 태그는 동영상 콘텐츠를 추가하는 용도입니다. video는 전체 이름을 쓰는데 왜 이미지 태그는 라고 하지 않고 라고 하는지 잘 모르겠네요. 사용법 Your browser does not support the video tag. video 태그를 열고 src, width, height 등의 속성을 입력합니다 src : 비디오 파일이 있는 URL을 입력합니다 width : 재생할 비디오 영상의 너비를 정합니다 height : 재생할 비디오 영상의 높이를 정합니다 width, height를 입력하지 않으면 동영상 원본 크기로 재생됩니다 controls 이 속성을 추가하면 유저가 비디오를 재상, 일시정지, 음량 조절 할 수 있는 버튼이 보입니다. contro.. 2023. 7. 3.
HTML <strong> 텍스트를 굵게 만들고 강조하는 태그 STRONG이란? 태그는 텍스트를 강조하는 태그입니다. 우리가 흔히 알고 있는 굵게, bold체로 만들어 버리죠. 사용법 할인 50%! 한정판매 굵게 강조하고자 하는 텍스트를 태그로 감쌉니다 간단하죠? See the Pen Untitled by 40's Programmer (@40sProgrammer) on CodePen. 태그와 태그의 차이점 그런데 텍스트를 굵게 만드는 라는 태그가 존재합니다. 어떤 차이가 있는지 살펴볼께요. 태그는 굵게 만드는 시각적 효과 뿐만 아니라 '이 텍스트는 중요하다'라는 의미도 내포하고 있습니다. 따라서 검색엔진 등이 볼 때는 'strong 태그에는 중요한 텍스트가 있구나' 라고 생각하죠. 반면에 태그는 특별한 의미없이 텍스트를 굵게 만듭니다. 단순하게 보여주는 태그에요. .. 2023. 7. 1.
HTML <div> 태그, 웹 페이지를 구조화하고 스타일을 입히다 DIV태그란? html에서 태그는 정말 많이 쓰이는 중요한 요소입니다. 웹페이지를 구조화하고 레이아웃을 정돈하기도 하고 CSS를 통해 스타일을 입힐 수도 있기 때문입니다. 사용법 인사 안녕하세요! 위의 예시에서 과 만 써도 컨텐츠를 출력하는데는 아무런 문제가 없습니다. 하지만 를 통해서 2개의 구역으로 나누었지요. 이 부분이 바로 웹페이지 구조화입니다. 그럼 스타일을 입히는 예시를 살펴볼께요 예시 코드 See the Pen div by 40's Programmer (@40sProgrammer) on CodePen. 위의 예시는 를 통해 header와 content를 클래스로 나누었어요. header는 메뉴 네비게이션 영역, content는 실제 내용 영역으로 구분된게 보이죠? 각 div에는 다른 이름의 .. 2023. 6. 30.
HTML article 태그, 웹 페이지 구성과 시멘틱 마크업 용도 ARTICLE 태그란? 웹페이지를 만드는 건 결국 다른 사람에게 정보를 공유하기 위함이고, 이를 위해 검색엔진이 좋아하는 구조로 구성해야 합니다. article은 section, fieldset 등과 같이 컨텐츠의 구획을 정하는 태그입니다. 사용법 article은 열고 닫는 태그입니다. article은 기본적은 class, id 외에는 별다른 속성은 없습니다. 과 의 차이 언제 section 태그를 쓰고 언제 article 태그를 쓰는지 궁금하더라구요. 그래서 검색을 해보았습니다. article은 블로그, 글, 뉴스, 기사 등 게시물과 관련된 컨텐츠 블록을 감쌀 때 쓰고 section은 긴 문서를 영역별로 나눌 때 사용하는 태그입니다. 웹페이지에 단락이 세 개 있으면 section을 세 번 써서 나누는 .. 2023. 6. 21.

티스토리툴바