一, HTML的基本語法
前言： 我學(xué)習(xí)標(biāo)簽是直接去W3C中的<參考手冊>中學(xué)習(xí)的
1, html中常用的標(biāo)簽声登，可結(jié)合iOS開發(fā)中的控件
重點：和iOS一樣，標(biāo)簽里面可以放標(biāo)簽遵岩，一層層的嵌套籽懦，只是合不合理的問題
重點突出容器控件 結(jié)合百度網(wǎng)站突出div的重要性始衅，在開發(fā)中最常用的是div
上代碼：
分析下里面生成的代碼
2.如何用標(biāo)簽窍帝？
1> 分析下必須要的標(biāo)簽,h1-h4設(shè)置內(nèi)容展示
先h1-h3,再寫h4。分析h的特點
2> 知識點：標(biāo)簽前后加空格不會影響授帕，會被忽略
3> a 標(biāo)簽特姐，結(jié)合京東分析（注意寫注釋）
a是超鏈接標(biāo)簽
herf：是鏈接地址
*體驗不好晶丘，有些網(wǎng)站會另外打開一個窗口
target="_blank"：新開一個網(wǎng)頁
4> input標(biāo)簽
* 在網(wǎng)頁中展示
* 在模擬器中展示
* 特殊點：沒有結(jié)束標(biāo)簽 區(qū)分：如果里面不要放東西，則不需要結(jié)束
5> input中常見的樣式唐含，用type引出
<input type="color">
<input type="checkbox">
<input type="radio">
<input type="range">
<input type="date">
6> input中的value屬性(設(shè)置了默認值)
placeholder:請輸入用戶名(占位文字)
7> br 標(biāo)簽 換行<不需要結(jié)束>
8> img 標(biāo)簽
* 本地路徑 ----引出協(xié)議：https:// http:// ftp:// file:// 跨域的問題
* 相對路徑和絕對路徑
相對路徑：從當(dāng)前文件入手去找這個圖片文件 （加一個文件夾用于區(qū)分）
絕對路徑：右擊-->復(fù)制圖片網(wǎng)址
9> div 標(biāo)簽
為什么要用div呢浅浮，為什么大家都要用它呢？因為它非常靈活
* 放到上面h一起講解
<div>122121212112</div>
div和h比較像捷枯，但是有區(qū)別
--再加
<div>122121212112</div>
<div>122121212112</div>
<div>122121212112 放入其他的控件</div>
div就是一個容器滚秩，沒有更多才華的容器
div 和 h 標(biāo)簽的區(qū)別
div:非常純潔的容器，什么都沒有淮捆，一塊未雕琢的玉郁油，我們想怎么做都可以，演示攀痊，個性化定制
關(guān)于更多的標(biāo)簽桐腌，朋友們可以去W3C中看<參考手冊>
二, 標(biāo)簽的簡單使用
<!--根標(biāo)簽-->
<html>
<!--頭部標(biāo)簽-->
<head>
<meta charset="utf-8">
<title>哈弗大學(xué) - 物理1102 </title>
</head>
<!--內(nèi)容標(biāo)簽-->
<body>
<!--標(biāo)題標(biāo)簽 h家族都是標(biāo)簽類型-->
<h1>物理1102 - 男生</h1>
<h2>物理1102 - 女生</h2>
<h3>物理1102 - 胖子</h3>
<h4>物理1102 - 瘦子</h4>
<h5>物理1102 - 男胖子</h5>
<h6>物理1102 - 女的都瘦</h6>
<!--段落標(biāo)簽-->
<p>物流1102班有一個籃球隊</p>
<p>也有一個女子籃球隊</p>
<p>每個女生的成績都非常棒</p>
<p>大多數(shù)男生的成績都很好,比如我</p>
<!--輸入框標(biāo)簽
1, 最簡單的輸入框<input>
2, 有占位文字的輸入框 <input placeholder="請輸入用戶名和密碼">
3, 輸入框中有默認值 <input value="王大帥鍋">
4, 插入主題顏色選擇 <input type="color">
5, 日期輸入框 <input type="date">
6, 選擇勾選的 <input type="checkbox">
7, 按鈕 <input type="button">
-->
<input>
<input placeholder="請輸入用戶名和密碼">
<input value="王大帥鍋">
<input type="color">
<input type="date">
<input type="checkbox">
<input type="button">
<!--換行標(biāo)簽-->
<br> <br> <br> <br> <br>
<input><br>
<input placeholder="請輸入用戶名和密碼"><br>
<input value="王大帥鍋"><br>
<input type="color"><br>
<input type="date">
<input type="checkbox"><br><br>
<!--超鏈接標(biāo)簽-->
<!--打開一個新的網(wǎng)頁來展示連接-->
<a target="_blank">我相信超越馬云不是夢</a><br><br>
<!--直接在當(dāng)前頁面展示連接-->
<a >百度一下,您就知道了</a><br><br>
<!--圖片標(biāo)簽
加載圖片需要了解兩個概念
1, 相對路徑 : 引用的是項目中的資源
2, 絕對路徑 : 也就是全路徑, 只要是以http:// , https:// , file://, ftp://開頭的都是絕對路徑
-->
<!--加載占位圖片-->
<img src="#"> <br>
<!--絕對路徑加載圖片-->
<img src="https://www.google.com.sg/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png"><br>
<!--相對路徑中加載圖片,想講資源圖片導(dǎo)入項目中-->
<!--<img src="imagessources/7.jpg"><br>-->
<!--給圖片設(shè)置寬和高-->
<img src="https://www.google.com.sg/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" width="150" height="150"><br>
<img src="imagessources/7.jpg" width="150" height="150"><br>
<!--列表標(biāo)簽-->
<ul>
<li>蘋果售后服務(wù)</li>
<li>蘋果售后技術(shù)支持</li>
<li>蘋果售后客服</li>
</ul>
<!--容器標(biāo)簽-->
<div>學(xué)習(xí)iOS是一個持續(xù)的過程,所以,不要放棄,堅持自己的夢想</div>
</body>
</html>
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
