HTML5 새 태그 (온라인 강의 노트, 개인용)

1. 비디오 태그 :동영상 재생

참고 : vedio는 img와 매우 유사하고 src 뒤에 동영상 위치가옵니다. 여기서 autoplay = "autoplay"는 자동 재생을 의미하거나 자동 재생을 직접 추가합니다.

<video src="SeanXiao.mp4" autoplay="autoplay">
</video>
* 속성 1 : 컨트롤 및 컨트롤 막대

여기에 사진 설명 삽입

 <video src="SeanXiao.mp4" align="center" autoplay="autoplay" controls="controls">     
 </video>
* 속성 2 : 포스터 — 비디오가 재생되기 전에 표시되는 사진

여기에 사진 설명 삽입
poster = "사진 위치"

 <video src="SeanXiao.mp4" align="center" controls="controls" poster="007fzS16ly1gje86iv2jsj33qj23lhdy.jpg">     
 </video>
* 속성 3 : 루프-비디오를 루프에서 재생해야하는지 여부

자동 재생의 유사한 사용법

* 속성 4 : 미리로드-프리로드 동영상

자동 재생 속성과 모순

* 속성 5 : 음소거 됨-동영상이 음소거되었으며 너비와 높이가 img와 동일합니다.

2.audeo 레이블 :오디오 재생

중요한 속성은 vedio, 자동 재생 자동 재생 및 컨트롤과 동일합니다.

여기에 사진 설명 삽입

 <audio src="初见.mp3" autoplay controls>
 </audio>

3. 세부 사항, 요약 태그 :요약 세부 정보 탭

여기에 사진 설명 삽입

<details>
        <summary>肖战</summary>
        2015年,被浙江卫视《燃烧吧少年!》节目组发掘成为选手;同年12月31日,作为燃烧吧少年团体成员之一亮相于浙江卫视“奔跑吧2016”跨年演唱会。2016年,主演校园星座超能力网络剧《超星星学园》并正式进入演艺圈。同年9月,以主唱担当的身份加入“X玖少年团”;之后,随X玖少年团推出同名数字专辑《X玖》。2017年,参演东方玄幻剧《斗破苍穹》;同年4月2日,随组合举行“以己之名”上海演唱会;之后,在古装言情传奇剧《狼殿下》饰演浪迹天涯的赏金猎人疾冲 。2018年,确认参演根据猫腻同名小说改编的古装权谋剧《庆余年》;4月,主演古装仙侠剧《陈情令》。2019年6月27日,主演的古装仙侠剧《陈情令》在腾讯视频播出,肖战凭魏无羡一角获得更多关注。8月,主演都市情感剧《余生,请多指教》。9月13日,主演的古装仙侠电影《诛仙I》在全国上映。11月10日,参加在上海举行的双十一晚会。
    </details>    

4. 선택 윤곽 태그 :요약 세부 정보 탭

<marquee direction="right" scrollamount="100">
        内容1
</marquee> 
<marquee scrollamount="10" loop="2" behavior="slide">
        内容2
</marquee>

dirction은 스크롤 방향을 지정하고 scrollamount = "10"은 스크롤 속도를 지정하고 loop는 스크롤 수를 지정하며 behavior = "slide"는 스크롤 유형을 지정합니다.

<marquee>
<img src="007fzS16ly1gje5kxcp6aj32e936u1l3.jpg" width="100">
</marquee>

선택 윤곽의 모든 항목을 스크롤 할 수 있습니다.

5. 특수 라벨 : 굵게, 밑줄, 기울임 꼴, 취소 선 (엔터프라이즈 개발에는 사용되지 않음)

----------> strong = b 、 ins = u 、 em = i 、 del = s

보여 주다:
여기에 사진 설명 삽입

    <b>SeanXiao</b>
    <u>SeanXiao</u>
    <i>SeanXiao</i>
    <s>SeanXiao</s>
    <!--改进版可以增添语义-->
    <strong>SeanXiao</strong>
    <ins>SeanXiao</ins>
    <em>SeanXiao</em>
    <del>SeanXiao</del>

6. 문자 엔티티 (공백, 캐리지 리턴, 탭 표시 방법)

공백 : & nbsp; (공백)
특수 기호 (> <)를 표시하는 방법 : & lt; 작음 & gt;
저작권 기호 보다 큼 : & copy;

여기에 사진 설명 삽입

 &gt;<br>
 &lt;<br>
 &copy;<br>

7.CSS 소개

여기에 사진 설명 삽입

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>CSS开始学习</title>
    <style type="text/css">
        .one{
            font-weight: bold;
        }
        .two{
            text-decoration: underline;
        }
        .three{
            font-style: italic;
        }
        .four{
            text-decoration: line-through;
        }
    </style>
</head>

<body>
    <hr>
    <p class="one">SeanXiao</p>
    <p class="two">SeanXiao</p>
    <p class="three">SeanXiao</p>
    <p class="four">SeanXiao</p>
</body>
</html>

추천

출처blog.csdn.net/qq_43978754/article/details/109890432