隨著互聯(lián)網(wǎng)技術(shù)的快速發(fā)展和普及,個(gè)人主頁(yè)已經(jīng)成為了人們展示自我的重要渠道之一。而HTML5個(gè)人主頁(yè)模板則讓創(chuàng)建這樣一個(gè)頁(yè)面變得更加簡(jiǎn)單。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>個(gè)人主頁(yè)</title> <link rel="stylesheet" href="style.css"> </head> <body> <header> <h1>My Name</h1> <p>A brief introduction about myself.</p> </header> <section> <h2>About Me</h2> <p>I am a programmer who loves coding and challenges. I have been programming for 5 years and have worked on various projects. I enjoy solving complex problems, and continually learning new things. When I am not coding, I like to read books, play video games, and watch movies.</p> </section> <section> <h2>Skills</h2> <ul> <li>HTML5</li> <li>CSS3</li> <li>JavaScript</li> <li>jQuery</li> </ul> </section> <section> <h2>Experience</h2> <ul> <li>Front-end Developer at ABC company (2018-2020)</li> <li>Full-stack Developer at XYZ company (2020-2021)</li> <li>Freelance Developer (2021-present)</li> </ul> </section> <section> <h2>Contact Me</h2> <ul> <li>Email: myemail@example.com</li> <li>Phone: 123-456-7890</li> <li>Social: <a href="https://www.linkedin.com/in/myprofile">LinkedIn</a></li> </ul> </section> </body> </html>
在以上代碼中,我們可以看到一個(gè)基本的HTML5個(gè)人主頁(yè)模板。其中header用于展示頭部信息,section則用于展示不同區(qū)域的內(nèi)容,如個(gè)人介紹、技能、經(jīng)驗(yàn)和聯(lián)系方式等。
除此之外,我們還引入了一個(gè)名為style.css的樣式表,通過(guò)指定不同元素的樣式,進(jìn)一步美化頁(yè)面。可以通過(guò)修改樣式表來(lái)自定義頁(yè)面的風(fēng)格。