移動(dòng)應(yīng)用項(xiàng)目開(kāi)發(fā)實(shí)戰(zhàn) 課件 MUI_第1頁(yè)
移動(dòng)應(yīng)用項(xiàng)目開(kāi)發(fā)實(shí)戰(zhàn) 課件 MUI_第2頁(yè)
移動(dòng)應(yīng)用項(xiàng)目開(kāi)發(fā)實(shí)戰(zhàn) 課件 MUI_第3頁(yè)
移動(dòng)應(yīng)用項(xiàng)目開(kāi)發(fā)實(shí)戰(zhàn) 課件 MUI_第4頁(yè)
移動(dòng)應(yīng)用項(xiàng)目開(kāi)發(fā)實(shí)戰(zhàn) 課件 MUI_第5頁(yè)
已閱讀5頁(yè)，還剩15頁(yè)未讀， 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說(shuō)明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

移動(dòng)應(yīng)用技術(shù)與服務(wù)專業(yè)

技能提升培訓(xùn)MUI組件Ajax請(qǐng)求標(biāo)簽的使用CSS3基礎(chǔ)應(yīng)用綜合MUI組件

<ulclass="mui-table-view"> <liclass="mui-table-view-cellmui-collapse"> <aclass="mui-navigate-right"href="#">面板1</a> <divclass="mui-collapse-content"> <p>面板1子內(nèi)容</p> </div> </li> </ul><buttontype="button"class="mui-btn">默認(rèn)</button> <buttontype="button"class="mui-btnmui-btn-primary">藍(lán)色</button> <buttontype="button"class="mui-btnmui-btn-success">綠色</button> <buttontype="button"class="mui-btnmui-btn-warning">黃色</button> <buttontype="button"class="mui-btnmui-btn-danger">紅色</button> <buttontype="button"class="mui-btnmui-btn-royal">紫色</button>認(rèn)識(shí)HTML5HTML5萬(wàn)維網(wǎng)的核心語(yǔ)言、標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言下的一個(gè)應(yīng)用超文本標(biāo)記語(yǔ)言（HTML）的第五次重大修改。HTML（HyperTextMarkupLanguage，超文本標(biāo)記語(yǔ)言或叫超文本標(biāo)簽語(yǔ)言）是用來(lái)描述網(wǎng)頁(yè)的一種語(yǔ)言，是創(chuàng)建Web頁(yè)的基礎(chǔ)。HTML不是一種編程語(yǔ)言，而是一種標(biāo)記語(yǔ)言（MarkupLanguage），標(biāo)記語(yǔ)言是一套標(biāo)記標(biāo)簽，HTML使用標(biāo)記標(biāo)簽來(lái)描述網(wǎng)頁(yè)。HTML5的設(shè)計(jì)目的是為了在移動(dòng)設(shè)備上支持多媒體，如video、audio和canvas標(biāo)記。HTML5提供了一些新的元素和屬性，例如<nav>（網(wǎng)站導(dǎo)航塊）和<footer>。這種標(biāo)簽有利于搜索引擎的索引整理，同時(shí)更好的幫助小屏幕裝置和視障人士使用?；A(chǔ)標(biāo)簽<h1>一級(jí)標(biāo)題</h1><h2>二級(jí)標(biāo)題</h2><h3>三級(jí)標(biāo)題</h3><h4>四級(jí)標(biāo)題</h4><h5>五級(jí)標(biāo)題</h5><h6>六級(jí)標(biāo)題</h6><h1>我和我的祖國(guó)</h1><p>填

詞：張藜</p><p>譜

曲：秦詠誠(chéng)</p><p>歌曲原唱：李谷一</p><p>我和我的祖國(guó)，一刻也不能分割</p><p>無(wú)論我走到哪里，都流出一首贊歌</p><p>我歌唱每一座高山，我歌唱每一條河</p><p>裊裊炊煙，小小村落，路上一道轍</p><p>我最親愛(ài)的祖國(guó)，我永遠(yuǎn)緊貼著你的心窩</p><ol>

<li>項(xiàng)目一HTML的基本標(biāo)簽</li><li>項(xiàng)目二表單應(yīng)用</li><li>項(xiàng)目三表格應(yīng)用和布局</li><li>項(xiàng)目四CSS樣式表</li></ol>基礎(chǔ)標(biāo)簽<tablewidth="200"border="1"><tr><tdcolspan="2">我的成績(jī)</td></tr><tr><td>SQLServer數(shù)據(jù)庫(kù)技術(shù)</td><td>98</td></tr><tr><td>CSS+DIV頁(yè)面布局技術(shù)</td><td>95</td></tr></table>有的單元格在水平方向上是跨多個(gè)單元格的，這就需要使用跨列屬性colspan。基本語(yǔ)法：<tdcolspan=“value”>基礎(chǔ)標(biāo)簽<tablewidth="300"border="1"><tr><tdrowspan="2">張?chǎng)?lt;/td><td>SQLServer數(shù)據(jù)庫(kù)技術(shù)</td><td>98</td></tr><tr><td>CSS+DIV頁(yè)面布局技術(shù)</td><td>95</td></tr><tr><tdrowspan="2">李青青</td><td>SQLServer數(shù)據(jù)庫(kù)技術(shù)</td><td>88</td></tr><tr><td>CSS+DIV頁(yè)面布局技術(shù)</td><td>91</td></tr></table>有的單元格在垂直方向上是跨多個(gè)單元格的，這就需要使用跨行屬性rowspan?；菊Z(yǔ)法：<tdrowspan=value>基礎(chǔ)標(biāo)簽<divstyle="margin-top:300px;margin-left:300px;border:3pxsolidblack;width:400px;"><divstyle="width:400px;height:300px;"><p>放置在DIV中的段落，div簡(jiǎn)單而言是一個(gè)區(qū)塊容器標(biāo)記，即div相當(dāng)于一個(gè)容器，一個(gè)“裝東西的盒子”，可以容納段落、標(biāo)題、表單、圖片、乃至單元等各種HTML元素。</p><h3>放置在DIV中的標(biāo)題標(biāo)簽</h3><ul><li>放置在DIV中的無(wú)序列表標(biāo)簽</li><li>放置在DIV中的無(wú)序列表標(biāo)簽</li><li>放置在DIV中的無(wú)序列表標(biāo)簽</li><li>放置在DIV中的無(wú)序列表標(biāo)簽</li></ul>div標(biāo)簽中的普通文字......</div></div>基礎(chǔ)標(biāo)簽嵌入視頻<videosrc="test.webm"width="800"height="600"></video>嵌入音頻<audiosrc="images/music.mp3"controlsautoplay></audio>CSS3CSS是CascadingStyleSheets的縮寫(xiě)，一般翻譯為層疊樣式表。CSS3是CSS（層疊樣式表）技術(shù)的升級(jí)版本。在網(wǎng)頁(yè)設(shè)計(jì)中我們把HTML、CSS、JavaScript并列為網(wǎng)頁(yè)前端設(shè)計(jì)的三種基本語(yǔ)言。其中HTML負(fù)責(zé)構(gòu)建網(wǎng)頁(yè)的基本結(jié)構(gòu)，CSS負(fù)責(zé)設(shè)計(jì)網(wǎng)頁(yè)的顯示效果，JavaScript負(fù)責(zé)開(kāi)發(fā)網(wǎng)頁(yè)的交互效果。HTML是網(wǎng)頁(yè)的骨是框架，CSS是網(wǎng)頁(yè)的皮用來(lái)制作頁(yè)面的外觀效果，JavaScript是網(wǎng)頁(yè)的筋用來(lái)進(jìn)行客戶端動(dòng)態(tài)的交互。CSS3基礎(chǔ)應(yīng)用CSS規(guī)則由兩個(gè)主要的部分構(gòu)成：選擇器和一條或多條聲明。選擇器通常是需要改變樣式的HTML元素，可以是某個(gè)標(biāo)簽、網(wǎng)頁(yè)對(duì)象、class、id等。選擇器也被稱為選擇符。每條聲明由一個(gè)屬性和一個(gè)值組成，用分號(hào)來(lái)標(biāo)識(shí)一個(gè)聲明的結(jié)束。使用花括號(hào)來(lái)包圍聲明。CSS3基礎(chǔ)應(yīng)用（1）標(biāo)簽選擇器，就是HTML標(biāo)簽，如<body>、<table>、<li>標(biāo)簽等body{}p{}div{}

（2）類選擇器

.類名{}（3）id選擇器#id名稱{}（4）后代選擇器divp{}(5)子選擇器div>p{}CSS3基礎(chǔ)應(yīng)用（1）字體大小屬性（font-size），這個(gè)屬性可以設(shè)置字體的大?。?）字體風(fēng)格屬性（font-style），，這個(gè)屬性有三個(gè)值可選：normal、italic、oblique（3）字體濃淡（粗細(xì)）屬性（font-weight），這個(gè)屬性常用值是normal和bold（4）字體顏色屬性（color）（5）文本對(duì)齊屬性（text-align），設(shè)定文本的對(duì)齊方式（6）文本修飾屬性（text-decoration），設(shè)定文本劃線的屬性（7）行高屬性（line-height），段落中文本行與文本行之間的距離（8）背景顏色屬性（background-color），這個(gè)屬性為HTML元素設(shè)定背景顏色（9）背景圖片屬性（background-image），這個(gè)屬性為HTML元素設(shè)定背景圖片（10）背景重復(fù)屬性（background-repeat），與background-image屬性一起使用，repeat，no-repeat等，（11）background-size

背景大小CSS3基礎(chǔ)應(yīng)用什么是CSS的盒子模型呢？?jī)?nèi)容（content）、填充（padding）、邊框（border）、邊界（margin），CSS盒子模型都具備這些屬性。CSS3基礎(chǔ)應(yīng)用左浮動(dòng)與右浮動(dòng)<divstyle="background-color:beige;height:100px;width:100px;float:left;"> 左浮動(dòng)</div><divstyle="background-color:brown;height:100px;width:100px;float:right;">右浮動(dòng)</div>CSS3基礎(chǔ)應(yīng)用相對(duì)定位relative相對(duì)某一位置，這里指的是相對(duì)原來(lái)的位置，不脫離標(biāo)準(zhǔn)文檔流<divclass="box1"></div><divclass="box2"></div><style>.box1{width:50px;height:50px;background-color:pink;

position:relative;top:10px;left:10px;}

.box2{width:20px;height:20px;background-color:skyblue;}</style>CSS3基礎(chǔ)應(yīng)用絕對(duì)定位absolute絕對(duì)定位通常發(fā)生父子標(biāo)簽中，脫離標(biāo)準(zhǔn)文檔流，不保留原本的位置由于直系父標(biāo)簽中沒(méi)有定位，所以字標(biāo)簽會(huì)一直向上查找，直到找到有定位的父標(biāo)簽，這個(gè)案例中，找到的就是頁(yè)面。所以它的絕對(duì)定位，是距離頁(yè)面的定位。<divclass="father"><divclass="son"></div></div>.father{ width:100px; height:100px; background-color:skyblue;}

.son{ left:100px;top:100px;bottom:0;right:0px; width:50px; height:50px; background-color:pink; position:absolute;//絕對(duì)定位}CSS3基礎(chǔ)應(yīng)用絕對(duì)定位absolute絕對(duì)定位通常發(fā)生父子標(biāo)簽中，脫離標(biāo)準(zhǔn)文檔流，不保留原本的位置如果父元素有定位，那么子元素就會(huì)以父元素為基準(zhǔn)進(jìn)行定位。<divclass="father"><divclass="son"></div></div>.father{ width:100px; height:100px; background-color:skyblue;position:absolute;}

.son{ left:100px;top:100px;bottom:0;right:0px; width:50px; height:50px; background-color:

溫馨提示

  • 1. 本站所有資源如無(wú)特殊說(shuō)明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

評(píng)論

0/150

提交評(píng)論