본문 바로가기

Pr Ae

외부자료를 본문내 삽입하는 아이프레임(iframe)

iframe : 정해진 크기에 외부에 콘텐츠나 사이트 그내부에 일부인 것처럼 뜬다.  고유 네임과 ID가 있어서 A태그의 타겟대상되는 경우로도 활용가능. ex)주가정보,날씨,배너,구글검색

 

https://www.w3schools.com/tags/tag_iframe.asp

 

HTML iframe tag

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

www.w3schools.com

 

if.html
0.00MB

 

비디오는 미디어서버 공간활용 및 스트리밍 등의 비용과 장애요소가 있어서 Youtube를 활용한 영상표현에서 아이프레임이 공유에서 태그형태로  사용된다.  

 

유튜브 영상의 반응형 표현

 

W3Schools online HTML editor

The W3Schools online code editor allows you to edit code and view the result in your browser

www.w3schools.com

youtube.html
0.00MB

 

 

비디오 태그의 근본, 유튜브를 추천함


아래는 비디오 태그를 미리보기 이미지와 영상으로 연결하는 소스이다.  대부분 미디어 서버를 통해서 연결된 부분이라, 요즈음은 직접적으로 사용을 기피한다.  

<video width="720" controls>
  <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4"> 
</video>


/html/main/theme/kfood_v03/skin/latest
위 경로에 아래 첨부한 basicOne 이라는 최신글스킨을 업로드하고...

basicOne.zip
0.00MB

 

index.php에 아래 내용을 삽입 혹은 수정 해주세요.

<h2>Today Q&A </h2>
        <? echo latest("theme/basicOne","qa", 2, 18); ?>


오디오 태그를 이용한 브금을 사이트에 적용하기

오디오 태그를 미리보기 이미지와 영상으로 연결하는 소스이다. 저작권등 문제가 있는 부분도 고려를 해야하며, 서버를 통해서 연결된 부분이라, 직접적인 사용보다는 픽사베이의 음악의 주소를 통한 mp3파일연결을 추천한다.  

 

https://www.w3schools.com/tags/att_audio_autoplay.asp

 

HTML audio autoplay Attribute

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

www.w3schools.com

 

https://pixabay.com/ko/music/

다운로드의 링크주소가 mp3이다.

<audio autoplay>
  <source src="https://cdn.pixabay.com/download/audio/2021/11/11/audio_9ca9840f3d.mp3">
</audio>