您現在的位置是:電腦技術吧?>? 編程技術 ??>??css3flexbox布局,css3flexbox使用場景??>??正文詳情

css3flexbox布局,css3flexbox使用場景

姚晶霞2019-11-15 23:50:39 人圍觀
簡介css flex這背后有一個悲傷的故事,所以我選了一個有點像黨的標題的標題。我不會說什么具體的。很長一段時間以來,人們都知道CSS3中有這樣一個東西,并且隨著規范的改變,它的版c

這個背后有一個悲傷的故事,所以就取了個這么有點像標題黨的標題,具體什么我就不說了。

很早之前就知道css3里面有這么個東西,而且隨著規范的改變,它的版本也改了幾次。

也就是因為這個flexbox伸縮盒布局太強大了,以至于我沒在意它也是display的一個屬性。

要想解決這個布局問題,我們還是先了解一些基礎的問題。

先回顧下display有哪些屬性吧: none:隱藏對象。

與visibility屬性的hidden值不同,其不為被隱藏的對象保留其物理空間 inline:指定對象為內聯元素。

block:指定對象為塊元素。

list-item:指定對象為列表項目。

inline-block:指定對象為內聯塊元素。

(CSS2) table:指定對象作為塊元素級的表格。

類同于html標簽table(CSS2) inline-table:指定對象作為內聯元素級的表格。

類同于html標簽table(CSS2) table-caption:指定對象作為表格標題。

類同于html標簽caption(CSS2) table-cell:指定對象作為表格單元格。

類同于html標簽td(CSS2) table-row:指定對象作為表格行。

類同于html標簽tr(CSS2) table-row-group:指定對象作為表格行組。

類同于html標簽tbody(CSS2) table-column:指定對象作為表格列。

類同于html標簽col(CSS2) table-column-group:指定對象作為表格列組顯示。

類同于html標簽colgroup(CSS2) table-header-group:指定對象作為表格標題組。

類同于html標簽thead(CSS2) table-footer-group:指定對象作為表格腳注組。

類同于html標簽tfoot(CSS2) run-in:根據上下文決定對象是內聯對象還是塊級對象。

(CSS3) box:將對象作為彈性伸縮盒顯示。

(伸縮盒最老版本)(CSS3) inline-box:將對象作為內聯塊級彈性伸縮盒顯示。

(伸縮盒最老版本)(CSS3) flexbox:將對象作為彈性伸縮盒顯示。

(伸縮盒過渡版本)(CSS3) inline-flexbox:將對象作為內聯塊級彈性伸縮盒顯示。

(伸縮盒過渡版本)(CSS3) flex:將對象作為彈性伸縮盒顯示。

(伸縮盒最新版本)(CSS3) inline-flex:將對象作為內聯塊級彈性伸縮盒顯示。

(伸縮盒最新版本)(CSS3)可以看到,目前最新的版本是display:flex ;當然要是用以前過度版本的估計還有用,但我們還是跟著最新的規范來。

我們再了解下伸縮盒的定義和一些概念的東西吧:Flexbox(伸縮布局盒) 是 CSS3 中一個新的布局模式,為了現代網絡中更為復雜的網頁需求而設計。

雖然現在我們可以使用 Flexbox 輕松創建布局,而不會像以前那樣難以理解,但我們仍然需要花一些時間去熟悉到底如何使用 Flexbox。

新的術語和概念可能會是我們使用 Flexbox 時的一個障礙,所以讓我們先來了解以下它們。

Flexbox 由 伸縮容器 和 伸縮項目 組成。

通過設置元素的 display 屬性為 flex 或 inline-flex 可以得到一個伸縮容器。

設置為 flex 的容器被渲染為一個塊級元素,而設置為 inline-flex 的容器則渲染為一個行內元素。

Flexbox 規范的相關工作已經進展了3年。

不同的瀏覽器也實現了不同的實驗版本。

在2012年9月,Flexbox 語法的第三個主要修訂版本進入到候選推薦階段。

這意味著 W3C 認為當前的語法是穩定的,并鼓勵瀏覽器開發商去實現它。

總之,伸縮盒布局,是我見過的最操蛋的規范,從2009發布到去年最終定下來,更弦換轍了三次。

Flexbox 規范時間表: 2009年7月 工作草案 (display: box;) 2011年3月 工作草案 (display: flexbox;) 2011年11月 工作草案 (display: flexbox;) 2012年3月 工作草案 (display: flexbox;) 2012年6月 工作草案 (display: flex;) 2012年9月 候選推薦 (display: flex;)Flexbox 已經被瀏覽器快速支持。

Chrome 22 , Opera 12.1 , 和 Opera Mobile 12.1 已經支持了本文中所描述的 Flexbox。

Firefox 18 和 Blackberry 10 也很快就會實現。

我推薦大家使用已經支持的瀏覽器來閱讀本文和查看例子。

雖然如此,但是很多瀏覽器廠商都高了一個私有前綴,所以特別麻煩:div{ display: -webkit-box; display: -moz-box; display: -o-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;}我們再來看看它有哪些屬性:Properties屬性 CSS Version版本 Inherit From Parent繼承性 Description簡介flex CSS3 無 復合屬性。

設置或檢索伸縮盒對象的子元素如何分配空間。

flex-grow CSS3 無 設置或檢索彈性盒的擴展比率。

flex-shrink CSS3 無 設置或檢索彈性盒的收縮比率flex-basis CSS3 無 設置或檢索彈性盒伸縮基準值。

flex-flow CSS3 無 復合屬性。

設置或檢索伸縮盒對象的子元素排列方式。

flex-direction CSS3 無 設置或檢索伸縮盒對象的子元素在父容器中的位置。

flex-wrap CSS3 無 設置或檢索伸縮盒對象的子元素超出父容器時是否換行。

align-content CSS3 無 設置或檢索彈性盒堆疊伸縮行的對齊方式。

align-items CSS3 無 設置或檢索彈性盒子元素在側軸(縱軸)方向上的對齊方式。

align-self CSS3 無 設置或檢索彈性盒子元素自身在側軸(縱軸)方向上的對齊方式。

justify-content CSS3 無 設置或檢索彈性盒子元素在主軸(橫軸)方向上的對齊方式。

order CSS3 無 設置或檢索伸縮盒對象的子元素出?的?序。

1:flex取值:none:none關鍵字的計算值為: 0 0 auto[ flex-grow ]:定義彈性盒子元素的擴展比率。

[ flex-shrink ]:定義彈性盒子元素的收縮比率。

[ flex-basis ]:定義彈性盒子元素的默認基準值。

這里flex-grow,flex-shrink,flex-basis可以單獨使用例如:flex-grow:1,也可以幾個在一起縮寫使用,例如:flex:1 1 100px;表示不擴展也不伸縮,設置寬度為100px。

看一個DEMO:這里面一開始定義了每個Box 400px,所以第一個每個小塊都是133px.第二個box(box2)由于每個塊都設置了擴展和伸縮比率還有基準值100px。

這里我們可以計算得:100 100 100=300px,但是因為它的ID設置了寬度為400px,所以會空出100px,但是它還有設置了擴展比率,所以計算得:100*1 100*2 100*3=600px;,最后我們可以算出每個小塊將要增加的寬度:第一個:1*100/600*100約等于17px;第二個小塊:2*100/600*100約等于33px;第三個小塊:3*100/600*100等于50px也就是說box2里第一塊區域的寬度為117px,第二小塊的寬度為133px,第三個小塊的寬度為150px;同樣的算法你可以去試試box3的各個寬度。

2.flex-flowflex-flow是個復合屬性,接受這兩類值:[ flex-direction ] [ flex-wrap ]。

要不我們先熟悉下flex-direction和flex-wrap吧flex-direction用來定義彈性盒子元素的排列方向。

語法:flex-direction:row | row-reverse | column | column-reverse默認值是row,無繼承性。

row:橫向從左到右排列(左對齊),默認的排列方式。

row-reverse:反轉橫向排列(右對齊,從后往前排,最后一項排在最前面。

column:縱向排列。

row-reverse:反轉縱向排列,從后往前排,最后一項排在最上面。

看一個DEMO再來看看:flex-wrap:nowrap | wrap | wrap-reverse 表示定義彈性盒子元素溢出父容器時是否換行。

默認值為nowrap。

可取值:nowrap:當子元素溢出父容器時不換行。

wrap:當子元素溢出父容器時自動換行。

wrap-reverse:反轉 wrap 排列。

看一個DEMO:現在flex-flow的屬性搞清楚了,我們可以結合兩個來寫一個DEMO:3.再看看align-content屬性吧:align-content:flex-start | flex-end | center | space-between | space-around | stretch用于多行的彈性盒模型容器各個屬性值的意思:flex-start: 各行向彈性盒容器的起始位置堆疊。

彈性盒容器中第一行的側軸起始邊界緊靠住該彈性盒容器的側軸起始邊界,之后的每一行都緊靠住前面一行。

flex-end: 各行向彈性盒容器的結束位置堆疊。

彈性盒容器中最后一行的側軸起結束界緊靠住該彈性盒容器的側軸結束邊界,之后的每一行都緊靠住前面一行。

center: 各行向彈性盒容器的中間位置堆疊。

各行兩兩緊靠住同時在彈性盒容器中居中對齊,保持彈性盒容器的側軸起始內容邊界和第一行之間的距離與該容器的側軸結束內容邊界與第最后一行之間的距離相等。

(如果剩下的空間是負數,則各行會向兩個方向溢出的相等距離。

)space-between: 各行在彈性盒容器中平均分布。

如果剩余的空間是負數或彈性盒容器中只有一行,該值等效于flex-start。

在其它情況下,第一行的側軸起始邊界緊靠住彈性盒容器的側軸起始內容邊界,最后一行的側軸結束邊界緊靠住彈性盒容器的側軸結束內容邊界,剩余的行則按一定方式在彈性盒窗口中排列,以保持兩兩之間的空間相等。

space-around: 各行在彈性盒容器中平均分布,兩端保留子元素與子元素之間間距大小的一半。

如果剩余的空間是負數或彈性盒容器中只有一行,該值等效于center。

在其它情況下,各行會按一定方式在彈性盒容器中排列,以保持兩兩之間的空間相等,同時第一行前面及最后一行后面的空間是其他空間的一半。

stretch: 各行將會伸展以占用剩余的空間。

如果剩余的空間是負數,該值等效于flex-start。

在其它情況下,剩余空間被所有行平分,以擴大它們的側軸尺寸。

看一個DEMO:4.align-items語法:align-items:flex-start | flex-end | center | baseline | stretch每個值的意思:flex-start: 彈性盒子元素的側軸(縱軸)起始位置的邊界緊靠住該行的側軸起始邊界。

flex-end: 彈性盒子元素的側軸(縱軸)起始位置的邊界緊靠住該行的側軸結束邊界。

center: 彈性盒子元素在該行的側軸(縱軸)上居中放置。

(如果該行的尺寸小于彈性盒子元素的尺寸,則會向兩個方向溢出相同的長度)。

baseline: 如彈性盒子元素的行內軸與側軸為同一條,則該值與flex-start等效。

其它情況下,該值將參與基線對齊。

stretch: 如果指定側軸大小的屬性值為auto,則其值會使項目的邊距盒的尺寸盡可能接近所在行的尺寸,但同時會遵照min/max-width/height屬性的限制。

DEMO:5.align-selfalign-self:auto | flex-start | flex-end | center | baseline | stretch默認值:auto適用于:彈性盒模型子元素繼承性:無取值:auto: 如果align-self的值為auto,則其計算值為元素的父元素的align-items值,如果其沒有父元素,則計算值為stretch。

flex-start: 彈性盒子元素的側軸(縱軸)起始位置的邊界緊靠住該行的側軸起始邊界。

flex-end: 彈性盒子元素的側軸(縱軸)起始位置的邊界緊靠住該行的側軸結束邊界。

center: 彈性盒子元素在該行的側軸(縱軸)上居中放置。

(如果該行的尺寸小于彈性盒子元素的尺寸,則會向兩個方向溢出相同的長度)。

baseline: 如彈性盒子元素的行內軸與側軸為同一條,則該值與flex-start等效。

其它情況下,該值將參與基線對齊。

stretch: 如果指定側軸大小的屬性值為auto,則其值會使項目的邊距盒的尺寸盡可能接近所在行的尺寸,但同時會遵照min/max-width/height屬性的限制 DEMO木有了 6.justify-content 用于設置或檢索彈性盒子元素在主軸(橫軸)方向上的對齊方式。

當彈性盒里一行上的所有子元素都不能伸縮或已經達到其最大值時,這一屬性可協助對多余的空間進行分配。

當元素溢出某行時,這一屬性同樣會在對齊上進行控制。

語法: justify-content:flex-start | flex-end | center | space-between | space-around 默認值:flex-start 適用于:彈性盒模型容器 繼承性:無 取值: flex-start: 彈性盒子元素將向行起始位置對齊。

該行的第一個子元素的主起始位置的邊界將與該行的主起始位置的邊界對齊,同時所有后續的伸縮盒項目與其前一個項目對齊。

flex-end: 彈性盒子元素將向行結束位置對齊。

該行的第一個子元素的主結束位置的邊界將與該行的主結束位置的邊界對齊,同時所有后續的伸縮盒項目與其前一個項目對齊。

center: 彈性盒子元素將向行中間位置對齊。

該行的子元素將相互對齊并在行中居中對齊,同時第一個元素與行的主起始位置的邊距等同與最后一個元素與行的主結束位置的邊距(如果剩余空間是負數,則保持兩端相等長度的溢出)。

space-between: 彈性盒子元素會平均地分布在行里。

如果最左邊的剩余空間是負數,或該行只有一個子元素,則該值等效于flex-start。

在其它情況下,第一個元素的邊界與行的主起始位置的邊界對齊,同時最后一個元素的邊界與行的主結束位置的邊距對齊,而剩余的伸縮盒項目則平均分布,并確保兩兩之間的空白空間相等。

space-around: 彈性盒子元素會平均地分布在行里,兩端保留子元素與子元素之間間距大小的一半。

如果最左邊的剩余空間是負數,或該行只有一個伸縮盒項目,則該值等效于center。

在其它情況下,伸縮盒項目則平均分布,并確保兩兩之間的空白空間相等,同時第一個元素前的空間以及最后一個元素后的空間為其他空白空間的一半。

DEMO; 7.order 用于設置或檢索彈性盒模型對象的子元素出?的?序。

用法:order:integer integer:用整數值來定義排列順序,數值小的排在前面。

可以為負值。

DEMO:上文介紹了flexbox的基本語法和一些屬性的使用,這里我們通過實戰來更了解這個伸縮盒布局(彈性盒)我們知道CSS3 彈性盒,是一種當頁面需要適應不同的屏幕大小以及設備類型時確保元素擁有恰當的行為的布局方式。

對于很多應用來講,彈性盒在兩個方面相對于盒模型進行了提升,它既不使用浮動,也不會導致彈性盒容器的外邊距與其內容的外邊距之間發生塌陷。

現在我們再來回顧下彈性盒的概念:彈性盒布局的定義中,它可以自動調整子元素的高和寬,來很好的填充任何顯示設備中的可用顯示空間,收縮內容防止內容溢出。

不同于盒布局的基于垂直方向以及行內布局的基于水平方向,彈性盒布局的算法是方向無關的。

雖然盒布局在頁面中工作良好,但是其定義不足以支持那種需要根據用戶代理從豎直切換成水平等變化而進行方向切換、大小調整、拉伸、收縮的引用組件。

不同于將要出現的網格布局針對目標為大比例布局,彈性盒布局更適用于應用組件和小比例布局。

這兩種都是CSS工作組為了能與不同用戶代理、不同書寫模式和其他彈性需要進行協作而做出的努力。

我們可以用display:flex和display:inline-flex來創建彈性盒。

flex 值表示彈性容器為塊級。

inline-flex 值表示彈性容器為原子行級元素 。

里面的元素就稱為彈性子元素彈性子元素的注意事項包含在彈性容器內的文本自動成為匿名的彈性子元素。

然而,只包含空白的彈性子元素不會被渲染,就好像它被設定為 display:none 一樣。

彈性容器的絕對定位的子元素會被定位,因此其靜態位置會根據它們的彈性容器的主起始內容盒的角落上開始。

目前由于一個已知的問題,在彈性子元素上指定 visibility:collapse會導致其好像被指定了 display:none 一樣,但該操作的初衷是使元素具有好像被指定了 visibility:hidden 一樣的效果。

在該問題被解決之前建議使用visibility:hidden ,其效果在彈性子元素上等同于 visibility:collapse 。

相鄰的彈性子元素不會發生外邊距合并。

使用 auto 的外邊距會在垂直和水平方向上帶來額外的空間,這種性質可用于對齊或分隔臨近的彈性子元素。

W3C彈性盒子布局模型的 使用auto的外邊距進行對齊 部分有更多信息。

彈性盒子的對齊會進行真正的居中,不像CSS的其他居中方法。

這意味著即使彈性容器溢出,子元素仍然保持居中。

有些時候這可能有問題,然而即使溢出了頁面的 上沿,或左邊沿(在從左到右的語言如英語;這個問題在從右到左的語言中發生在右邊沿,如阿拉伯文),因為你不能滾動到那里,即使那里有內容!在將來的版本 中,對齊屬性會被擴展為有一個安全選項。

目前,如果關心這個問題,你可以使用外邊距來達到居中的目的,這種方式比較安全,在溢出的情況下會停止居 中。

在你想要居中的彈性子元素上應用自動外邊距代替align-屬性。

在彈性容器的第一個和最后一個子元素的外側應用自動外邊距來代替justify-屬性。

自動外邊距會伸縮并假定剩余空間,當有剩余空間時居中彈性子元素,沒有剩余空間時切換會正常對齊模式。

然而,如果你想要在多線彈性盒子中用基于外邊距的居中替換justify-content屬性,你可能就沒那么幸運了,因為你需要在每一線的第一個和最后一個元素上應用外邊距。

除非你能提前預測哪個元素是哪一線上的最后一個元素,否則你沒法穩定地在主軸上用基于外邊距的居中代替 justify-content 屬性。

說起雖然元素的顯示順序與源代碼中的順序無關,這種無關僅對顯示效果有效,不包括語音順序和基于源代碼的導航。

即使是 order 也不影響語言和導航序列。

因此開發者必須小心排列源代碼中的元素以免破壞文檔的可訪問性。

下面我們來看兩個例子:例子展示了如何對元素應用彈性布局以及在彈性布局中子元素的行為例子2這個例子適用于桌面瀏覽器網頁必須優化以適應于智能手機屏幕的場景。

不僅僅需要元素減小尺寸,它們排列的順序方式也必須改變。

彈性布局很容易實現這種需求。

版權聲明:本文由 姚晶霞 整理編輯。

原標題:css flexbox,flex是css3

轉載注明出處:http://www.dn9ww09s.icu/program/12654.html

文章評論

    共有條評論來說兩句吧...

    用戶名:

    驗證碼:

作者推薦

  • 對于目標系統文件,對于目標文件系統過大怎么辦

    對于目標系統文件,對于目標文件系統過大怎么辦 相關圖片系統文件過大對于目標文件系統文件太大的提示,通常在用戶傳輸一些大文件時出現。原因是什么?怎么解決?文件太大而無法傳輸的問題通常是目標存儲媒體格式的問題。當u盤或win...

  • form提交表單,js form表單提交

    form提交表單,js form表單提交 相關圖片ajax提交form表單數據一。基于struts標記,提交類型:HTML:Formaction=/loginmethod屬性可以忽略。原因是struts=post2的默認方法。基于非strform表單屬性...

  • 電腦老是自動關機,自動關機怎么設置

    電腦老是自動關機,自動關機怎么設置 相關圖片電腦自動關機維修有時我們需要設置自動關機。一些不知道如何設置的用戶只需下載第三方軟件進行設置,但一些定時關機軟件可能是病毒,這是不安全的,所以最好使用系統本身的自...

  • win10怎么默認英文輸入法,win10輸入法默認英文

    win10怎么默認英文輸入法,win10輸入法默認英文 相關圖片怎么讓輸入法默認英文對于一些需要與外貿行業的外國朋友打交道的外國朋友或用戶來說,中文輸入法并不方便。默認情況下,他們需要將輸入方法設置為英語。如果希望win10輸入法設置...

  • css div居中,css如何讓div居中

    css div居中,css如何讓div居中 相關圖片怎么讓div居中方法1:將一些div的顯示模式設置為tables,這樣就可以使用tables的vertical align屬性。其結構效果如下:CSS代碼如下:div?wrapdiv上下居中...

  • 無法正常啟動0xc0000022,0xc000007b無法正常啟動

    無法正常啟動0xc0000022,0xc000007b無法正常啟動 相關圖片電腦無法正常啟動當用戶打開電腦時,藍屏顯示,錯誤提示為0x0000007b,系統無法正常啟動。怎么了?0x0000007b電腦藍屏,0x0000007b無法正常啟動。如何解決這w7電腦藍屏0x0000007b...

  • css下拉菜單在線演示,css下拉菜單思路

    css下拉菜單在線演示,css下拉菜單思路 相關圖片css二級下拉菜單代碼如下:!DOCTYPE HTML public-//W3C//DTD XHTML 1.0 strict//en http://www.w3。Org/TR/Xcss實現下拉菜單的思路...

  • 電腦記事本亂碼怎么處理,記事本日文顯示亂碼

    電腦記事本亂碼怎么處理,記事本日文顯示亂碼 相關圖片文件用記事本打開是亂碼相信有些用戶在使用記事本時遇到過這種情況。以前記事本上記錄的文字信息是正常的,但后來打開發現記事本出了故障。這是什么原因?如何恢復記事本?大...

  • 表單類型,表單中的文本域類型

    表單類型,表單中的文本域類型 相關圖片表單新增類型有哪些搜索類型用于搜索域,如站點搜索或谷歌搜索。搜索字段顯示為常規文本字段。例如:inputtype=search placeholder=test search a表單的三個基本部分...

  • ios12正式版沒有推送,ios12.4正式版推送

    ios12正式版沒有推送,ios12.4正式版推送 相關圖片ios13沒有推送長期以來,在Android主版本更新中,one plus手機的后續速度絕對是最好的。今年8月,一加六的用戶可以下載并體驗基于Android P(9.0)的氫操作ios13何時推送...

熱評文章

  • steam一直無法連接網絡,steam登錄連接不上網絡

    steam一直無法連接網絡,steam登錄連接不上網絡 相關圖片steam登錄顯示無法連接網絡Steam是世界上著名的游戲平臺,許多玩家(以及中國的許多玩家)在這里購買、下載、討論、上傳和共享游戲和軟件。僅僅因為steam的服務器在國外,國內用戶...

  • office365激活碼,獲取office365激活碼

    office365激活碼,獲取office365激活碼 相關圖片office2016激活碼辦公軟件有多種,其中office365也有很多用戶。Office 365是一款訂閱式跨平臺辦公軟件,允許任何人使用任何設備隨時隨地創建和共享內容。想充分享受office365激活方法...

  • 紐約時報在線閱讀,如何閱讀紐約時報

    紐約時報在線閱讀,如何閱讀紐約時報 相關圖片《紐約時報》《紐約時報》有什么功能?在Firefox瀏覽器中打開《紐約時報》時,值得注意的是,此網站()提供了保存到計算機上供脫機使用的數據。從這句話很容易推斷這是一個離線...

  • 2.4g和5g要不要合并,2.4g頻段怎么設置

    2.4g和5g要不要合并,2.4g頻段怎么設置 相關圖片雙頻路由器關閉5g快今天的無線WiFi,我們發現有的標著2.4G,有的標著5g,2.4G和5g WiFi是什么意思?他們之間有什么區別?有人認為5g肯定比2.4G好,其實這是錯誤的2.4g能跑滿100m嗎...

  • 四個全面布局的意義,戰略布局的意義

    四個全面布局的意義,戰略布局的意義 相關圖片四個全面布局隨著Web2.0標準化設計理念的普及,國內許多大型門戶網站都采用了div CSS的方式,52css.com也成為學習CSS頁面布局技術的先鋒網站。從實際應用來看布局在銷售中的意義...

  • 怎么看window10的版本,surface pro怎么看幾代

    怎么看window10的版本,surface pro怎么看幾代 相關圖片win10歷史版本號當用戶想知道他們的win10系統是否是最新版本時,他們可以通過檢查版本號來判斷。有些用戶不知道如何查看win10。實際上,只要使用命令查看win10版本,就可以bios開機密...

  • 邊框圓角,圓角邊框怎么設置

    邊框圓角,圓角邊框怎么設置 相關圖片html圓角矩形邊框!DOCTYPE html PUBLIC-//W3C//DTD XHTML 1.0 Transitional//ENhttp://www.w3.org/TR/xps做圓角矩形邊框...

  • 蘋果定位功能有什么用,怎樣使用蘋果手機定位功能

    蘋果定位功能有什么用,怎樣使用蘋果手機定位功能 相關圖片蘋果手機的定位功能沒有網絡能用嗎當iPhone用戶丟失手機或想定位自己的手機時,可以通過icloud使用蘋果的定位功能。不過,icloud只能定位蘋果設備的大致位置,使用蘋果定位并不十分...

  • html音樂播放器代碼,html5音樂播放器源碼

    html音樂播放器代碼,html5音樂播放器源碼 相關圖片音樂播放器前端獲取htmlvideoelement和htmludioelement objects1//audio您可以直接通過new 2 media=newaudio(ht在線音樂播放器源碼...

  • 升級win10,怎么升級win10

    升級win10,怎么升級win10 相關圖片win8.1Win10是微軟主操作系統的最新版本。有些新功能只能在win10上體驗,所以很多舊版本系統的用戶也開始想升級自己的系統。本文將與您分享win8.1升級win10bwin...

關注微信

变脸官网查询