[html] Media & etc

Jin·2021년 9월 12일
0

html

목록 보기
5/5
post-thumbnail

Media & etc

Audio

  • controls : control 창 나타나게해줌
  • autoplay : 자동재생 (화면에는 아무것도 안나옴)
  • loop : 반복 재생
  <audio src="./assets/audio/hi.mp3" loop autoplay></audio>

wav파일을 사용하고 싶은데 만약 브라우저가 지원을 하지 않을 때 아래와 같이 작성하면 wav파일이 안되면 mp3가 재생이 됨. 좀더 user friendly
하지만 이 방법으로 하면 type을 꼭 넣어줘야함

  <audio controls>
    <source src='/assets/audio/hi.wav' type='audio/wav'>
   <source src='/assets/audio/hi.mp3' type='audio/mpeg'>
    <p> 브라우저를 바꾸자</p> # 둘다 안될때
 </audio>

Video

# 첫번재 방법
 <video controls src="./assets/video/hi.mp4"></video>
# 두번째 방법
<video loop autoplay>
    <source src='./aseets/video/kimbug.mov' type='vidoe/mp4' />
    <source src='./aseets/video/kimbug.mp4' type='video/mp4' />
  <p>브라우저를 바꾸세요</p> # 둘다 지원을 안하는 브라우저 사용할때 이 텍스트 나옴
</video>

iframe

이 안에 또 다른 html문서나 컨텐츠를 집어 넣고 싶을때.

ETC

Abbrevation

사용자가 모를만한 단어 같은거에 대한 뜻을 알려줄때

 <p>너 혹시 <abbr title="ADHD is one of the most common neurodevelopmental disorders of childhood">ADHD</abbr>니?</p>

Address

연락처에 관한 마크업을 할때 사용

  • 연락망으로 될 수 있는것들 :
    • (물리적)주소
    • URL
    • email주소
    • 전화번호
    • SNS
<address>
    <h1>Jin</h1>
    <a href="instagram.com/">instagram.com</a>
  </address>

Preformmated, code

html 내에서도 code를 작성하고 싶을 때

내가 작성한대로 출력이됨. 만약 p태그로 했다면 한줄에 표현, indentation도 안됐을꺼.

 <pre>
    <code>
      def python():
        return True
    </code>
</pre>

profile
내가 다시 볼려고 작성하는 블로그. 아직 열심히 공부중입니다 잘못된 내용이 있으면 댓글로 지적 부탁드립니다.

0개의 댓글