본문 바로가기
  • 커뮤니티
  • 블로그
  • 북마크

Front-end/HTML3

[HTML]HTML 태그(풀네임)과 의미 - 시멘틱 웹 HTML 태그의 풀네임을 모르는 분들도 많으리라 생각됩니다. 실무에선 풀네임까지는 몰라도 업무를 보는데 크게 지장이 없습니다. 그래도 알아서 나쁠 건 없으니 참고만 하시면 될 거 같습니다. : Hypertext Markup Language (하이퍼텍스트 마크업 언어) : Head (문서 헤드) : Title (문서 제목) : Body (문서 본문) : Heading One (제목 1) : Heading Two (제목 2) : Heading Three (제목 3) : Heading Four (제목 4) : Heading Five (제목 5) : Heading Six (제목 6) : Paragraph (단락) : Anchor (앵커) : Image (이미지) : Unordered List (비정렬 목록) :.. 2023. 6. 19.
[HTML]라이트모드, 다크모드 이미지를 picture에 미디어(media)쿼리로 다른이미지 불러오기 다크모드나 해상도에 따라 이미지를 다르게 보여줄때 유용하게 사용됩니다. 간단히 설명을 드리자면 source media는 css에 미디어쿼리와 동일하다고 생각하시면 됩니다. 아래 내용을 참고하셔서, 라이트/다크 모드일때 보여지는 이미지와, source 아래 기본 이미지를 넣으시면 됩니다. 반응형(해상도별) 예시 @media screen and (max-width:921px) { } (해상도 예시) 디바이스(운영체제별) 라이트, 다크모드 @media (prefers-color-scheme: dark) { } (디바이스 다크모드 예시) 2023. 6. 6.
[HTML]ios(아이폰)에서 video 태그로 mp4 영상 삽입시 재생안될때 해결방법 아이폰에서 mp4 영상을 바로 호출하면 재생이 되나, video 태그로 삽입시 재생이 안되는 문제입니다. 먼저 video 태그의 속성을 살펴봅시다. 아이폰에서 autoplay 실행시 playsinline 를 추가하면 전체화면 전환없이 바로 재생이 됩니다. 즉 autoplay 를 넣을경우 playsinline 를 같이 넣어줘야한다는 의미입니다. 그래야 아이폰에서 영상이 제대로 보여집니다. autoplay : 자동재생 playsinline : IOS 자동재생 그리고 자동재생을 하기 위해서는 muted(음소거) 도 같이 넣어줘야합니다. 예제) 영상이 안보일시 포스터도 넣어보세요. 썸네일 사이즈가 맞지 않는다면 CSS에 poster 사이즈를 100%로 줍니다. video[poster]{width:100%} 2022. 11. 29.
반응형