生活随笔
收集整理的這篇文章主要介紹了
十五、导航,头部,CSS基础
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
制作自己的導航條。HTML頭部元素:<base>? 定義了頁面鏈接標簽的默認鏈接地址<style>? 定義了HTML文檔的樣式文件<link>? 定義了一個文檔和外部資源之間的關系?練習樣式表:行內樣式表內嵌樣式表外部樣式表分別練習定義三類選擇器:HTML 選擇器CLASS 類選擇器ID 選擇器 <!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>音樂在線</title><base herf="http://music.163.com/#/discover"<link rel="stylesheet" type="text/css" herf="180.css"></head>
<body>
<!--這是一個注釋-->
<h1>音樂在線<span style="font-size: larger";>好好聽~</span></h1><style type="text/css">p{color:red}p1{color:green}</style><body style="background-color:Gainsboro;"></body>
<nav>
<img src="http://img.mp.itc.cn/upload/20161016/b45e3e6b512547c1a8ab866787695733.gif" width="75"height="75"><a herf=""><img src="w_02_08_00.png">首頁</a><a herf="http://www.gzcc.cn/">下載APP</a><input type="text" name="search"><button type="submit">搜索</button><a herf="">登錄</a><a herf="">注冊</a>
</nav><div><p>雙11日韓專輯<span style="font-family:'Consolas','Deja Vu Sans Mono','Bitstream Vera Sans Mono',monospace;font_size:50px;background_color:red">50%OFF</p>
</div><h2 id="2017">2017</h2>
<script>document.write(Date())document.getElementById("2017").innerHTML="????";
</script>
<p style="color:blue;margin-left:20px;">This is a paragraph.</p>
<p>This is a paragraph.</p>
<a herf="#2">2</a>
<div id="container" style="width:400px " ><div id="header" style="background-color:cornflowerblue;"><h2 align="center" style="margin-bottom:0;">傾聽你的音樂</h2></div><div id="content" style="background-color:lightsteelblue;height:150px;width:400px;float:left;"><form action="">Number:<input type="text" name="user" placeholder="請輸入會員號/手機號/郵箱號"><br>Password:<input type="password" name="password" placeholder="請輸入專屬秘密"><br><input type="radio" name="role" value="stu">普通會員<input type="radio" name="role" value="teacher">高級會員<br><input type="checkbox" value="true"><span>記住我</span><a herf="">登錄遇到問題</a><br><input type="button" value="login" οnclick="alert('登錄驗證')"></form></div><div id="footer" style="background-color:cornflowerblue;clear:both;text-align:center;">獨家版權 ? wjl</div></div><div id="container" style="width:400px " ><div id="header" style="background-color:cornflowerblue;"><h2 align="center" style="margin-bottom:0;">搜索</h2></div><div id="content" style="background-color:lightsteelblue;height:200px;width:400px;float:left;"><select><option value="" style="color: lightsteelblue;">---請選擇---</option><option>會員</option><option>游客</option></select><ul><li>古典音樂</li><li>搖滾音樂</li><li>嘻哈音樂</li></ul><ol><li>掃一掃</li><li>聽歌識曲</li></ol></div><div id="footer" style="background-color:cornflowerblue;clear:both;text-align:center;">獨家版權 ? wjl</div><hr><P>友情鏈接</P><a href="http://yue.sina.com.cn/">娛樂one by one<br><img src="http://ww1.sinaimg.cn/bmiddle/6548a21bgw1eglr5kvkohg209s0bkajt.gif" width="300" height="130" alt="music.cn" ></a></body>
</html> 運行結果如圖:
轉載于:https://www.cnblogs.com/Green-/p/7680909.html
總結
以上是生活随笔為你收集整理的十五、导航,头部,CSS基础的全部內容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。