HTML簡單練習——個人名片

阿新 • • 發佈：2021-02-02

個人名片

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>個人名片</title>
    </head>
    <link rel="stylesheet" href="css/style.css">
    <body>
        <div>
            < 
h1 style="color:blue">姓名</h1>
            <img src="image/n.jpg" width="150" height="200">
            <p>sust學生</p>
        </div>

        <div>
            <h2>我的愛好</h2>
            <ul>
                <li id= 
"hello">寫程式碼</li>
                <li class="world">乒乓球</li>
                <img src="image/p.jpg" width="150" height="200">
                <li>看綜藝</li>
                <li>玩遊戲</li>
            </ul>
        < 
/div>

        <div>
            <h2>我的學習經歷和夢想</h2>
            <ol>
                <li>y中學</li>
                <li>sust大學</li>
                <li><a href="https://www.qq.com/">騰訊</a></li>
            </ol>
        </div>
    </body>
</html>

還需要的配置
在這裡插入圖片描述
css檔案裡面是

程式碼

/*元素選擇器*/
h2{
    color: aquamarine;
}
/*id選擇器*/
#hello{
    color: red;
}
/*類選擇器*/
li.world{
    color: red;
}
h1{
    text-align: center;/*居中*/
    font-size: 100px;/*字型大小*/
}
body{
    background-image: url("../image/n.jpg");
}
div.hobby li:hover{
    color: blue;
}

image裡面是一些圖片(圖片隨便放，只要圖片名稱和程式碼中的一致即可)
在這裡插入圖片描述
最後就在tomcat/webapps目錄下，放進去，啟動tomcat，就可以看到成果。

HTML簡單練習——個人名片

技術標籤：前端HTMLhtmlcssweb 個人名片 <!doctype html> <html> <head> <meta charset="utf-8">

css+html做一個個人頭像預覽，或者說名片把

效果圖： ---- index.html <!DOCTYPE html> <html> <head> <meta charset=\"utf-8\">

HTML 簡單的表格

[ HTML 例項 <!DOCTYPE html> <html> <head> <meta charset=\"utf-8\"> <title>簡單的表格 - Break易站(www.breakyizhan.com)</title>

[kuangbin帶你飛] 專題一簡單搜尋個人題解

目錄[kuangbin帶你飛] 專題一簡單搜尋個人題解棋盤問題Dungeon MasterCatch That CowFliptileFind The MultiplePrime PathShuffle\'m UpPotsFire GameFire!迷宮問題Oil Deposits非常可樂Find a way

簡單的個人介紹網頁-主頁面【附程式碼】

此文轉載自：https://blog.csdn.net/Baridhu/article/details/110004129 主頁面程式碼1（style.css）

微信 8.0 上線獨特個性狀態標識，設定後個人名片將凸顯微信狀態

1月23日訊息隨著這幾天微信 8.0 全新版本的到來，相信各位小夥伴已經在嘗試發現各種有趣的小功能，接熱心網友線索投遞：當用戶設定好每日的微信狀態後，使用者在聊天或聯絡人列表中也會顯示出對應的狀態內容且支援進

Swagger簡單使用(個人用)

技術標籤：Springbootspringspring boot 用於前後端的分離，可以實時的展示後端的介面

html簡單元件（七）：transform實現圖片輪播

技術標籤：HTML簡單元件html5csscss3jquery輪播圖 html簡單元件（七）：transform實現圖片輪播

抖音測試“個人名片”功能

4 月 27 日訊息據 Tech 星球報道，抖音在測試個人名片功能，目前暫時應用於商家、企業端，服務於企業之間的交流，這是抖音在企服場景下的社交嘗試。

HTML簡單知識點整理

1. 簡介 1.1 什麼是HTML Hyper Text Markup Language(超文字標記語言) 超文字包括：文字，圖片，音訊，視訊，動畫等

HTML簡單入門

HTML 初步學習 buchiyexiao HTML語法 HTML主要語法為倆種，分別為單標籤語法和雙標籤語法：

html簡單認識

建立單選框,文字域,複選框 <!DOCTYPE html> <html xmlns=\"http://www.w3.org/1999/html\">

c#簡單的個人簡介自動生成程式

今天完成了一個.net的實驗，老師讓我們用TextBox、GroupBox、RadioButton、CheckBox、ComboBox、ListBox 控制元件這些控制元件編寫一個Windows應用程式，所以我寫了一個簡單的個人簡介生成軟體。

短視訊直播系統，簡單實現個人主頁背景圖片和文字顏色的更改

短視訊直播系統，簡單實現個人主頁背景圖片和文字顏色的更改 <style name=\"AppBaseTheme\" parent=\"android:Theme.Holo.Light.DarkActionBar\">&l