收藏
批改狀態(tài)：合格
老師批語(yǔ)：
<!DOCTYPE html> <html> <head> <title>文本控制</title> <meta charset="utf-8"> </head> <body> <h1>這是一個(gè)h1標(biāo)簽</h1> <h2>這個(gè)是h2標(biāo)簽</h2> <h3>這是h3標(biāo)簽</h3> <h4>這是h4標(biāo)簽</h4> <h5>這是h5標(biāo)簽</h5> <h6>這是h6標(biāo)簽</h6> <b>這是粗體標(biāo)簽B標(biāo)簽</b> <p>食用方法：未經(jīng)保存處理的荔枝有“一日色變，二日香變，三日味變，四日色香味盡去”的特點(diǎn)。為了保存荔枝的色香味，可以把荔枝噴上點(diǎn)水裝在塑料保鮮袋中放入冰箱，利用低溫高濕保存。<br>功效：荔枝味甘、酸、性溫，入心、脾、肝經(jīng)；可止呃逆，止腹瀉，是頑固性呃逆及五更瀉者的食療佳品，同時(shí)有補(bǔ)腦健身，開(kāi)胃益脾，有促進(jìn)食欲之功效；因性熱，多食易上火。荔枝果肉香甜汁多，有生津止渴、益肝補(bǔ)脾的作用，夏季炎熱，人的胃口略有不佳，<br>食用些荔枝可改善食欲不振情況。此外，荔枝對(duì)大腦組織有補(bǔ)養(yǎng)作用,能明顯改善失眠、忘記、神疲等癥。能夠增強(qiáng)免疫功能荔枝肉含豐富；作用的物質(zhì),對(duì)糖病患者十分適宜。荔枝還能消腫解毒,止血止痛荔枝除廣為人知的滋補(bǔ)作用外,還可用于外科。 </p> <br> <!-- 換行，標(biāo)簽換行 --> <br> <br> <strong>PHP中文網(wǎng)</strong> <!-- 加重語(yǔ)氣 粗體 --> <i>斜體</i> <!-- 斜體 --> <em>定義著重字</em> <!-- 斜體 --> <del>定義刪除字標(biāo)簽</del> <span style="background:pink; width:300px;height:200px;">399元</span><del>499</del> <pre>定義 預(yù)格 式 化文本</pre> <!-- 可以輸出空格 換行 --> <p style="background:#ccc;width:300px;height:200px;">123</p> <!-- 獨(dú)占一行 --> <span>399元</span> <!-- 塊級(jí)元素 P標(biāo)簽 自帶換行符 獨(dú)占一行 寬高間隙屬性值生效 --> <!-- 行類(lèi)元素 可以共存一行 對(duì)寬高屬性值不生效 --> <!-- 行內(nèi)塊元素；結(jié)合了塊級(jí)以及行內(nèi)的特點(diǎn) 既可以對(duì)寬高屬性值生效，還可以共存于一行 --> <img src="2.jpg" style="winth:200px; height:300px;" /><span>123</span> 行內(nèi)塊級(jí)相互轉(zhuǎn)換； display：inline 將塊級(jí)元素轉(zhuǎn)換為行內(nèi)元素 display:inline-block; 將塊級(jí)元素轉(zhuǎn)換為行內(nèi)塊元素 display:block; 將行內(nèi)轉(zhuǎn)換為塊級(jí) <div style="width:100px;height:100px;background:pink; display:inline;">1</div> <div style="width:100px;height:100px;background:pink; display:inline-block;">2</div> <spen style="width:100px;height:100px;background:pink;display:block;">3</spen> <spen style="width:100px;height:100px;background:pink; display:inline-block;">4</spen> <spen style="width:100px;height:100px;background:pink; display:inline-block;">5</spen> </body> </html>
點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例
<!DOCTYPE html>
<html>
<head>
<title>文本控制2</title>
<meta charset="utf-8">
<style type="text/css">
p {font-weight: bold; /*定義粗體*/
font-size: 30px; /*定義字體大小*/
}
h1 {font-family: 方正超粗黑簡(jiǎn)體;
text-align:center;/*left right*/
height: 100px;
background: #ccc;
line-height: 100px} /*定義行高*/
span{font-size: 40px;
font-weight:bold;
font-family: georgia;
}
img{width:300px;height: 400px;}
b{display: block;width: 300px;height: 40px;
background: pink;
overflow: hidden; /*溢出隱藏*/
margin-bottom: 100px;
}
b:hover{overflow: visible;} /*代碼注意用英文，默認(rèn)值，內(nèi)容不會(huì)修剪，元素會(huì)被呈現(xiàn)元素框以外*/
</style>
</head>
<body>
<h1>PHP中文網(wǎng)</h1>
<p>php中文網(wǎng)</p>
<br>
<!-- 谷歌logo -->
<span style="color:#0388F1">G</span> <!-- 16進(jìn)顏色值 -->
<span style="color:rgb(245,28,39)">o</span> <!-- RGB顏色值 -->
<span style="color:#FFE80E;">o</span>
<span style="color:#0388f1">g</span>
<span style="color:#39ff1b">l</span>
<span style="color:#ffe80e">e</span>
<!-- 圖文混排 -->
<p style="display:inline-block;width:300px;height:400px;">功效：荔枝味甘、酸、性溫，入心、脾、肝經(jīng)；可止呃逆，止腹瀉，是頑固性呃逆及五更瀉者的食療佳品，同時(shí)有補(bǔ)腦健身，開(kāi)胃益脾，有促進(jìn)食欲之功效；因性熱，多食易上火。荔枝果肉香甜汁多，有生津止渴、益肝補(bǔ)脾的作用，夏季炎熱，人的胃口略有不佳，食用些荔枝可改善食欲不振情況。此外，荔枝對(duì)大腦</p>
<img src="2.jpg">
<br><br>
<img src="2.jpg">
<b>功效：荔枝味甘、酸、性溫，入心、脾、肝經(jīng)；可止呃逆，止腹瀉，是頑固性呃逆及五更瀉者的食療佳品，同時(shí)有補(bǔ)腦健身，開(kāi)胃益脾，有促進(jìn)食欲之功效；因性熱，多食易上火。荔枝果肉香甜汁多，有生津止渴、益肝補(bǔ)脾的作用，夏季炎熱，人的胃口略有不佳，食用些荔枝可改善食欲不振</b>
</body>
</html>點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例
<!DOCTYPE html>
<html>
<head>
<title>國(guó)產(chǎn)重磅新機(jī)宣布：全球首發(fā)高通10nm新U</title>
<meta charset="utf-8">
<style type="text/css">
h1{font-weight: bold;font-size: 30px;text-align:center;font-family: 黑體;}
span{font-size: 13px; color: rgb(153, 153, 153); }
p{text-align:left}
b{display: block;height: 35px;
overflow: hidden; /*溢出隱藏*/
margin-bottom: 100px;
}
b:hover{overflow: visible;
</style>
</head>
<body>
<h1>國(guó)產(chǎn)重磅新機(jī)宣布：全球首發(fā)高通10nm新U</h1>
<span>鳳凰科技 08-13 17:53</span>
<br>
<br>
<div style="text-align:center">
<img src="http://pic176.nipic.com/file/20180808/3554136_093134624000_2.jpg" style="winth:500px; height:500px;text-align:center"/><span></span>
<p>8月13日消息，OPPO官方宣布R17系列即將發(fā)布，現(xiàn)在官方已經(jīng)公布了該系列的部分信息。</p>
</div>
<p>官方介紹，OPPO R17首發(fā)驍龍670移動(dòng)平臺(tái)，這顆片是高通最新推出的中端處理器，它基于10nm LPP工藝制程打造，也是高通驍龍600系列首款10nm片。</p>
<p>它采用Kryo 360架構(gòu)、八核心設(shè)計(jì)，CPU主頻為2.0GHz，GPU為Adreno 615，性能強(qiáng)悍。</p>
<p>此外，OPPO R17采用6.4英寸水滴屏，首發(fā)康寧第六代大猩猩玻璃，屏占比達(dá)到了91.5%，最高配備8GB內(nèi)存+128GB存儲(chǔ)，前置2500萬(wàn)像素?cái)z像頭，支持AI智慧美顏，后置AI智能雙攝，電池容量為3500mAh，支持VOOC閃充，運(yùn)行ColorOS 5.2系統(tǒng)（基于安卓深度定制）。</p>
<p>值得一提的是，OPPO R17配備光感屏幕指紋，這是OPPO旗下首款屏幕指紋收集，擁有4mm?超大傳感器，秒速解鎖。</p>
<b>該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約該機(jī)將于8月18日開(kāi)啟預(yù)約</b>
</body>
</html>點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例
總結(jié)：
這節(jié)課程學(xué)習(xí)了標(biāo)簽的文本控制，個(gè)人感覺(jué)內(nèi)容有多，信息量大，現(xiàn)在能基本都理解，但是如果單獨(dú)敲，還有些背不下來(lái)比如:display:inline-block 這些
元素分為：塊級(jí)、行內(nèi)、行內(nèi)塊級(jí)，三種，且可以相互轉(zhuǎn)換：
塊級(jí)元素 P標(biāo)簽 h1~h6 div 自帶換行符 獨(dú)占一行 寬高間隙屬性值生效
行類(lèi)元素 可以共存一行 對(duì)寬高屬性值不生效
行內(nèi)塊元素；結(jié)合了塊級(jí)以及行內(nèi)的特點(diǎn) 既可以對(duì)寬高屬性值生效，還可以共存于一行
行內(nèi)塊級(jí)相互轉(zhuǎn)換；
display：inline 將塊級(jí)元素轉(zhuǎn)換為行內(nèi)元素
display:inline-block; 將塊級(jí)元素轉(zhuǎn)換為行內(nèi)塊元素
display:block; 將行內(nèi)轉(zhuǎn)換為塊級(jí)
微信掃碼
關(guān)注PHP中文網(wǎng)服務(wù)號(hào)
技術(shù)交流群
QQ掃碼
加入技術(shù)交流群
Copyright 2014-2025 http://ipnx.cn/ All Rights Reserved | php.cn | 湘ICP備2023035733號(hào)