前沿拓展：

超鏈接圖標(biāo)

1、電腦打開PPT2019版本。

2、打開PPT之后，先輸入喜歡的文字，第二選中文字點(diǎn)擊鼠標(biāo)右鍵，選中超鏈接。

3、點(diǎn)擊插入超鏈接后，選擇要插入的東西或者鏈接。

4、插入鏈接后，文字就會變成帶下劃線的藍(lán)色。

5、進(jìn)入播放頁面，點(diǎn)擊插入鏈接的文字，超鏈接頁面，輸入地址或者選第二確定就可以了。

自從伊?！ゑR科特創(chuàng)造“響應(yīng)式網(wǎng)頁設(shè)計(jì)”這個(gè)詞以來，已經(jīng)過去了三年。這曾經(jīng)是一個(gè)革命性的新想法，但現(xiàn)如今已經(jīng)變成了一種常見的設(shè)計(jì)。響應(yīng)式網(wǎng)頁設(shè)計(jì)（RWD）不再是一種趨勢，它是如今最好的設(shè)計(jì)表現(xiàn)。

我想說的是，響應(yīng)式網(wǎng)頁設(shè)計(jì)很快就會像css和html的分離一樣明顯。這不是是否使用它的問題。這是一個(gè)你是否能正確實(shí)現(xiàn)它的問題。

我們生活在后PC時(shí)代。移動設(shè)備，以及最近十分流行的可穿戴設(shè)備變得越來越重要，我們別無選擇，只能接受我們的網(wǎng)站需要為不同的屏幕分辨率提供最好的體驗(yàn)這一事實(shí)。如今，越來越多的互聯(lián)網(wǎng)流量將來自智能手機(jī)和平板電腦。在去年銷售的電視中，就有超過25%是具有互聯(lián)網(wǎng)連接的智能電視。是的，只有響應(yīng)式網(wǎng)頁設(shè)計(jì)才能讓您輕松為這些設(shè)備及其所有者提供服務(wù)。

設(shè)計(jì)人員需要對響應(yīng)式網(wǎng)站進(jìn)行原型設(shè)計(jì)，而編碼人員必須對它們進(jìn)行編碼。這就是新的現(xiàn)實(shí)。準(zhǔn)備好了嗎？歡迎來到響應(yīng)式設(shè)計(jì)時(shí)代。

什么是響應(yīng)式網(wǎng)頁設(shè)計(jì)？

響應(yīng)式網(wǎng)頁設(shè)計(jì)當(dāng)然不是一個(gè)不言自明的術(shù)語（盡管它很接近），所以我想我們需要定義它。響應(yīng)式網(wǎng)頁設(shè)計(jì)是一種設(shè)計(jì)方法，可以讓網(wǎng)站響應(yīng)某些設(shè)備的屏幕分辨率。這意味著由于響應(yīng)式網(wǎng)頁設(shè)計(jì)，設(shè)計(jì)師能夠在手機(jī)，平板電腦，大屏幕等設(shè)備上打開網(wǎng)站時(shí)自由地控制網(wǎng)站的外觀。

以下是一些響應(yīng)式網(wǎng)站的截圖，可以幫助您更好地理解響應(yīng)式網(wǎng)頁設(shè)計(jì)：

您還可以測試設(shè)計(jì)的網(wǎng)站的響應(yīng)能力。調(diào)整窗口大小，并觀察它如何巧妙地塑造不同屏幕分辨率的體驗(yàn)。

響應(yīng)式網(wǎng)頁設(shè)計(jì)更像是一種設(shè)計(jì)理念，而不是一種單一的、定義明確的方法。響應(yīng)式網(wǎng)頁設(shè)計(jì)是一種設(shè)計(jì)思維模式，迫使設(shè)計(jì)人員考慮不同設(shè)備上的體驗(yàn)。

響應(yīng)式網(wǎng)頁設(shè)計(jì)面臨的挑戰(zhàn)

前面我們已經(jīng)了解到了什么是響應(yīng)式網(wǎng)頁設(shè)計(jì)，現(xiàn)在我們討論一下它面臨的挑戰(zhàn)。

響應(yīng)式網(wǎng)頁設(shè)計(jì)要求設(shè)計(jì)人員和開發(fā)人員具有多角度設(shè)計(jì)思維過程。你必須考慮你的網(wǎng)站在不同設(shè)備上實(shí)際的瀏覽體驗(yàn)。這通常意味著您需要完全改造界面才能使其易于使用。每個(gè)主要分辨率都必須是一個(gè)斷點(diǎn)，用于重塑界面。

您需要記住的一件事是，響應(yīng)式網(wǎng)頁設(shè)計(jì)并不是要縮小所有內(nèi)容來適應(yīng)iPhone的屏幕。設(shè)計(jì) 響應(yīng)式網(wǎng)站就是要提供出色、連續(xù)、跨渠道的體驗(yàn)。

聽起來很復(fù)雜嗎？是的！這就是我們過著艱難的生活。

想象一下，如果沒有將網(wǎng)頁上的部件仔細(xì)調(diào)整到較小的屏幕分辨率，每個(gè)網(wǎng)站最重要的組件之一可能會在移動設(shè)備上完全亂掉，其結(jié)果將是致命的。如果沒有正確設(shè)計(jì)導(dǎo)航，您的網(wǎng)站將在其他設(shè)備上成為一種無法使用的體驗(yàn)和痛苦的根源。

雖然我所知道的大多數(shù)響應(yīng)式網(wǎng)站都有適應(yīng)性強(qiáng)的導(dǎo)航組件，但它們通常設(shè)計(jì)得很差。像 觸摸屏設(shè)備在導(dǎo)航方面有不同的要求和習(xí)慣；大屏幕會提供更多空間去實(shí)現(xiàn)網(wǎng)站清晰度等，這是你設(shè)計(jì)響應(yīng)式網(wǎng)站時(shí)應(yīng)始終牢記的事情。要設(shè)計(jì)一個(gè)連續(xù)的、跨渠道的體驗(yàn)，就意味著要仔細(xì)考慮每個(gè)渠道、設(shè)備是否以相同的精度提供服務(wù)。

麻煩的響應(yīng)式網(wǎng)站導(dǎo)航是我想詳細(xì)討論的事情。為了幫助你更好地理解我所說的，下面每個(gè)導(dǎo)航組件都已重新還原為原型。這應(yīng)該可以讓您更好了解響應(yīng)式解決方案的結(jié)構(gòu)和含義。

在每個(gè)示例下方，您還可以找到一些鏈接，這些鏈接可讓您在設(shè)計(jì)中重用這些模式。

現(xiàn)在 – 讓我們處理響應(yīng)式網(wǎng)站上使用的流行導(dǎo)航模式。

收縮和隱藏

我最喜歡的一個(gè)響應(yīng)式網(wǎng)站導(dǎo)航的例子是“Done Done”。對于標(biāo)準(zhǔn)的1224px屏幕寬度，Done Done在頂部菜單中有一個(gè)簡單的鏈接列表，這里有兩個(gè)高明的設(shè)計(jì)：一個(gè)用于“計(jì)劃&定價(jià)”的按鈕和一個(gè)單獨(dú)的“登錄”鏈接。在這兩種情況下，“Done Done”的設(shè)計(jì)者為他們認(rèn)為至關(guān)重要的導(dǎo)航欄提供了視覺上的區(qū)別。這可能并不是什么特別新奇的設(shè)計(jì)，但它肯定是一項(xiàng)適當(dāng)?shù)脑O(shè)計(jì)。

對于較小的分辨率，則會像變魔術(shù)一樣。當(dāng)您開始調(diào)整窗口大小時(shí)，您會注意到第一它們使導(dǎo)航鏈接變?。ǖ匀灰子陂喿x，例如在iPad Mini上），第二在720px下隱藏導(dǎo)航鏈接。在 Done Done 網(wǎng)站上工作的設(shè)計(jì)人員明白，他們不能繼續(xù)無限期地縮小導(dǎo)航中的字體大小，因此他們利用了現(xiàn)在流行的移動應(yīng)用程序?qū)Ш侥Ｊ健ｋ[藏在方便菜單中的導(dǎo)航鏈接在屏幕頂部具有固**置。這意味著在向下滾動網(wǎng)站時(shí)，您可以持續(xù)訪問導(dǎo)航。

這種策略的另一個(gè)例子是響應(yīng)過程中的網(wǎng)站。對于較小的屏幕分辨率，它們會縮小并移動導(dǎo)航鏈接，以提供持續(xù)的導(dǎo)航便利性體驗(yàn)。如果您在智能手機(jī)上打開該頁面，您會注意到它們“固定”了導(dǎo)航的位置，就像“Done Done”一樣有意思。但是，新版本的網(wǎng)站遇到了一個(gè)小問題?！鞍l(fā)現(xiàn)”鏈接位于iPhone上網(wǎng)站的徽標(biāo)下方。這時(shí)候又改怎么做才能做得更好呢？很簡單。例如，他們可以隱藏“Done Done”樣式菜單中的鏈接。

最后，說說我最喜歡的例子 – Skinny Ties。這個(gè)制作精美的網(wǎng)站很好地處理了網(wǎng)站在不同的設(shè)備上的呈現(xiàn)。第一，它們的頂部導(dǎo)航大小會根據(jù)屏幕大小進(jìn)行調(diào)整（它還會稍微改變位置以創(chuàng)建一致的布局）。對于較小的屏幕，設(shè)計(jì)師大膽地隱藏了購物車、搜索和登錄/注冊鏈接。這是一個(gè)絕佳的選擇，因?yàn)樗瓜吕斜砉δ荦R全（請注意，下拉列表的內(nèi)容也會根據(jù)屏幕的大小進(jìn)行調(diào)整），同時(shí)節(jié)省了寶貴的空間。 Skinny Ties的響應(yīng)式網(wǎng)站在任何地方都絕對是一個(gè)亮眼的存在，我相信無論是誰都絕對會喜歡它的。

移動和隱藏

并非每個(gè)導(dǎo)航都適合收縮和隱藏鏈接。如果導(dǎo)航有許多層，比如復(fù)雜的信息結(jié)構(gòu)、層層疊連的鏈接、或者只是不適合使用小字體的排版，總而言之，您必須考慮這些情況下該如怎么做。比較流行的一種做法是對中等尺寸屏幕的導(dǎo)航鏈接重新排序，并將其隱藏在較小屏幕（智能手機(jī)）的菜單中。

The Next Web 已經(jīng)掌握了移動/隱藏導(dǎo)航鏈接的藝術(shù)。他們在寬屏幕上的響應(yīng)式網(wǎng)站呈現(xiàn)出復(fù)雜的導(dǎo)航模式。兩個(gè)下拉列表‘’圖標(biāo)，五個(gè)鏈接，隱藏的搜索……這是一個(gè)會發(fā)生各種意外的組合，但是，The Next Web 的網(wǎng)頁設(shè)計(jì)師做到了。如果您將窗口大小調(diào)整為800px，您會注意到它們重新組織了整個(gè)網(wǎng)站的頂部?；諛?biāo)已縮小到適合頂部菜單。整個(gè)“所有頻道”列都隱藏在屏幕左側(cè)的菜單中。結(jié)果很棒，這是一個(gè)清晰明了的網(wǎng)站，我想他們正確地使用了流行的響應(yīng)式網(wǎng)頁設(shè)計(jì)模式（盡管菜單中的“所有頻道”在某種程度上仍然很奇怪）。

如果您將窗口大小調(diào)整為768px及以下，或者只是在iPad / iPhone上打開它，則五個(gè)導(dǎo)航鏈接將會從屏幕上消失，這增加了整體形式的清晰度。我想吐槽的是，如果鏈接根本不那么重要，為什么它們會第一出現(xiàn)在更寬的屏幕上呢？看起來它似乎是整個(gè)導(dǎo)航中不必要的，只是為了好看擠到網(wǎng)業(yè)上，也許只是因?yàn)樗m合寬屏幕呢？

在《**ashing Magazine》的網(wǎng)站上，已經(jīng)避免了將其他信息強(qiáng)制放入更寬屏幕的失敗做法 – 這是高度復(fù)雜導(dǎo)航的另一個(gè)例子。粉碎雜志共有三個(gè)級別的導(dǎo)航：

主要分類： 書籍， 圖書室， 活動， 工作板主題類別： 編碼， 設(shè)計(jì)， 移動， 圖形， 用戶體驗(yàn)設(shè)計(jì)， 字壓特定于每個(gè)主題類別的子類別

這三層導(dǎo)航迫使《**ashing Magazine》的設(shè)計(jì)師創(chuàng)建了一個(gè)復(fù)雜的響應(yīng)式網(wǎng)站。對于最寬的屏幕**ashing Magazine使用屏幕左側(cè)的兩個(gè)導(dǎo)航列。大小為 1224px 及更小的屏幕在網(wǎng)站頂部具有“主要類別”，在一列中包含“主題類別”和“子類別”。這是菜單結(jié)構(gòu)重組的合理選擇。

但是，最有趣的事情發(fā)生在較小的屏幕上。

如果您在 iPad 上以橫向視圖 （1024px） 打開 **ashing 雜志，您會注意到子類別消失了，而主題類別則被擠壓在“主要類別”下方。

最后，對于728px和更小尺寸的屏幕 – 所有導(dǎo)航鏈接都隱藏在設(shè)計(jì)精美的菜單中。在**ashing的模式中，唯一可能成為問題的事情是移動設(shè)備上缺少菜單的固**置。畢竟大多數(shù)用戶用移動設(shè)備訪問該網(wǎng)站是為了瀏覽最新文章，而不是瀏覽類別，不是嗎。

sony則為他們的網(wǎng)站創(chuàng)造了一個(gè)優(yōu)雅的圖案。雖然1224px和400px之間的導(dǎo)航幾乎沒有任何變化，但它們在320px中將它們的五個(gè)導(dǎo)航鏈接精美地隱藏在屏幕右側(cè)的菜單中。此模式使網(wǎng)站在 iPhone 上仍然瀏覽體驗(yàn)極佳。我只能說干得漂亮。

微軟 使用與 Sony導(dǎo)航類似的模式。微軟設(shè)計(jì)師在屏幕右側(cè)的整潔菜單中隱藏智能手機(jī)的導(dǎo)航鏈接。不幸的是，它沒有固定的位置，而且整體上太復(fù)雜了，每個(gè)類別都有下拉列表（嘗試在iPhone上使用它真的是一場無休止?jié)L動的噩夢）。他們是這樣辯護(hù)的：他們確實(shí)在頁腳中重復(fù)了導(dǎo)航鏈接，這有助于滾動到頁面底部，并且?guī)椭鷽]有找到他們但需要查找內(nèi)容的用戶。這種重復(fù)的導(dǎo)航鏈接是一種極好的模式。

全面重組

在響應(yīng)式網(wǎng)站上導(dǎo)航的最后一個(gè)流行的解決方案是完全重組。規(guī)則很簡單：如果它不合適那就改掉它，是的，簡單暴力。

UXlondon使用了一個(gè)簡單而優(yōu)雅的解決方案。對于寬屏設(shè)備，導(dǎo)航鏈接是水平放置的，對于較小的設(shè)備，它們以垂直平面重新組織鏈接。導(dǎo)航仍然可用，盡管它使用相當(dāng)多的垂直空間，迫使用戶進(jìn)行一些可靠的滾動以到達(dá)內(nèi)容。

全面重組的另一個(gè)例子是Food Sense的網(wǎng)站。在寬屏幕上，導(dǎo)航是垂直組織的，所有鏈接都附有圖標(biāo)。對于768px屏幕，導(dǎo)航將更改為垂直順序。最后，對于320px智能手機(jī)，導(dǎo)航會轉(zhuǎn)到頂部而不顯示圖標(biāo)（這是一個(gè)不錯(cuò)的選擇，可以為小屏幕帶來更清晰的信息）。

麗晶學(xué)院的網(wǎng)站也有類似的導(dǎo)航模式。對于寬屏幕，導(dǎo)航整齊地放置在網(wǎng)站的頂部。在主要類別下方，有幾個(gè)其他鏈接。對于較小的設(shè)備，主要類別被重新分組到一種兩行網(wǎng)格中，而其他鏈接則隱藏在模糊的“更多鏈接”按鈕下（但我覺得這并不高明，這不是你應(yīng)該**的模式…）。

那么我們該如何設(shè)計(jì)完美的導(dǎo)航

如你所見，所有方法都有其缺陷和優(yōu)點(diǎn)。總而言之，這是關(guān)于在特定設(shè)備/設(shè)備類型上不斷思考的特定用例。響應(yīng)式設(shè)計(jì)完全致力于多渠道思維。設(shè)備和用例的矩陣應(yīng)該引導(dǎo)您完成設(shè)計(jì)的蜿蜒曲折。這通常意味著您將需要混合，收縮，移動，重新組織和隱藏這些設(shè)計(jì)元素以創(chuàng)建更好的結(jié)構(gòu)。

我想說，用戶先于方法——這才是我們應(yīng)該記下來的事情。

讓我們花幾分鐘時(shí)間關(guān)注一個(gè)簡單的導(dǎo)航模式。頂部，水平菜單，4個(gè)鏈接，以及一個(gè)登錄/注冊鏈接。想象SaaS登錄頁面的一個(gè)非常標(biāo)準(zhǔn)的導(dǎo)航設(shè)計(jì)，我已經(jīng)開始從最大的屏幕尺寸（在我的情況下是1224px）設(shè)計(jì)它。一種方法是“移動優(yōu)先”，但我總是發(fā)現(xiàn)，從最大尺寸開始到最小尺寸設(shè)計(jì)，更簡單，服務(wù)更**。

我的下一步是為1024px添加一個(gè)響應(yīng)式節(jié)點(diǎn)，并指定設(shè)計(jì)在稍微窄的屏幕上應(yīng)該是什么樣子。在原型制作工具中，我從頂部菜單中添加了一個(gè)響應(yīng)式斷點(diǎn)，指定我希望從1224px版本**我的設(shè)計(jì)。

多虧了這個(gè)簡單的選項(xiàng)，我只需要通過幾個(gè)動作將我的設(shè)計(jì)調(diào)整到更小的屏幕尺寸。我還決定縮小內(nèi)容，以很好地適應(yīng)我的項(xiàng)目的新版本。

當(dāng)1024px的版本完成之后，我將為768px添加一個(gè)節(jié)點(diǎn)（因?yàn)檫@是iPad屏幕大小 – 這是一個(gè)重要的節(jié)點(diǎn)）。通常，這是我們開始更多地使用導(dǎo)航的那一刻。但是就我而言，我比不喜歡這么做。隱藏任何鏈接或更改導(dǎo)航模型會帶來不必要的復(fù)雜性。這將會是一場繁瑣的工作，但我們應(yīng)該尋找更簡單明了的方法，而不是一開始就幻想結(jié)局有多美好。

話雖如此，我只是稍微移動了一下導(dǎo)航，同時(shí)我還刪除了整個(gè)右列，并將其內(nèi)容放在主要內(nèi)容下方。這是我認(rèn)為很有效的一個(gè)方法。記住，如果不是什么重要的日子，就不要無緣無故去尋找盛開的煙花。讓你的用戶不是因?yàn)槟愕脑O(shè)計(jì)感到驚訝。相信我，用戶會驚訝于簡單解決方案的易用性。

最后，最棘手的節(jié)點(diǎn) – 320px——智能手機(jī)。嘗試使導(dǎo)航鏈接變小既困難又有風(fēng)險(xiǎn)。對于移動用戶來說，最后的體驗(yàn)可能是一場難以捉摸的噩夢。所以我決定激進(jìn)一點(diǎn)。我已將導(dǎo)航移動到右側(cè)的經(jīng)典移動菜單，并將“登錄”和“創(chuàng)建帳戶”鏈接放在網(wǎng)站頂部 – 以便于訪問（這對于普通用戶尤其重要）。

由于這個(gè)小技巧，該網(wǎng)站可以在小屏幕上完全使用導(dǎo)航功能，并且在設(shè)計(jì)的清晰度上沒有任何損失。

記住了，對于320px屏幕，這種模式非常必要的。

最后

我肯定響應(yīng)式網(wǎng)頁設(shè)計(jì)將會繼續(xù)存在并在未來越來越流行，這絕對是現(xiàn)代網(wǎng)頁設(shè)計(jì)的主要模式之一。我真誠地希望看完本文后，您可以了解到設(shè)計(jì)一個(gè)在任何設(shè)備都完全可導(dǎo)航的網(wǎng)站并非易事，任何屏幕尺寸設(shè)計(jì)都是令人驚嘆的。

拓展知識：

超鏈接圖標(biāo)

插入-插入對象-由文件創(chuàng)建-勾選顯示為圖標(biāo)，第二點(diǎn)瀏覽選中要鏈接的文件。

微軟的OFFICE是最為流行的辦公軟件，主要有OFFICE2010和OFFICE2007兩個(gè)版本。Office 2000是第三代辦公處理軟件的代表產(chǎn)品，可以作為辦公和管理的平臺，以提高使用者的工作效率和決策能力。Office 2000中文版有4種不同的版本：標(biāo)準(zhǔn)版、中小企業(yè)版、中文專業(yè)版和企業(yè)版。

在Office 2000中各個(gè)組件仍有著比較明確的分工：一般說來，Word主要用來進(jìn)行文本的輸入、編輯、排版、打印等工作；Excel主要用來進(jìn)行有繁重計(jì)算任務(wù)的預(yù)算、財(cái)務(wù)、數(shù)據(jù)匯總等工作；PowerPoint主要用來制作演示文稿和幻燈片及投影片等；Access是一個(gè)桌面數(shù)據(jù)庫系統(tǒng)及數(shù)據(jù)庫應(yīng)用程序；Outlook是一個(gè)桌面信息管理的應(yīng)用程序；FrontPage主要用來制作和發(fā)布因特網(wǎng)的Web頁面。

Microsoft Office XP是微軟有史以來所發(fā)行的Office版本中最重要的版本，而且也被認(rèn)為是迄今為止功能最強(qiáng)大、最易于使用的Office產(chǎn)品。新版Office放棄了以往以產(chǎn)品發(fā)布年命名的慣例！產(chǎn)品名稱中的XP，是英文Experience（體驗(yàn)）的縮寫，代表著新版Office在包容覆蓋廣泛設(shè)備的Web服務(wù)之后，將給用戶帶來豐富的、充分?jǐn)U展的全新體驗(yàn)。

除核心的 Office XP 程序 — Microsoft Word、Excel、Outlook和 PowerPoint— 外，Office XP 專業(yè)版 中包含 Microsoft Access 2002，它是 Office XP 數(shù)據(jù)庫解決方案，可幫助用戶存儲、訪問和分析數(shù)據(jù)。

本回答被網(wǎng)友采納

超鏈接圖標(biāo)

在Word中創(chuàng)建超鏈接有三種方法：
1、拖放編輯法：第一保存文檔，第二拖動鼠標(biāo)選**定的詞、句或圖像作為超級鏈接的目標(biāo)，第二點(diǎn)擊鼠標(biāo)右鍵，把選定的目標(biāo)拖到需要鏈接到的位置，釋放鼠標(biāo)按鍵，在快捷菜單中選擇“在此創(chuàng)建超級鏈接”選項(xiàng)即可。
2、拷貝粘貼法：利用鼠標(biāo)拖放法創(chuàng)建超鏈接很方便，但是有時(shí)超級鏈接的起點(diǎn)和終點(diǎn)在文檔中相距較遠(yuǎn)，使用拖放式編輯的方法是很不方便的。這時(shí)可以選擇超級鏈接的目標(biāo)詞、句或圖像，按下Ctrl+C**選定內(nèi)容，把光標(biāo)移動到需要加入鏈接的位置，第二執(zhí)行菜單“編輯→粘貼為超鏈接”即可。
3、 使用書簽法：除了以上兩種方法以外，我們也可以通過使用書簽來實(shí)現(xiàn)。第一保存文檔，選擇特定的詞、句或圖像作為超級鏈接的目標(biāo)，選擇菜單“插入→書簽”，插入書簽時(shí)，需要為書簽命名，命名后單擊“添加”按鈕，把光標(biāo)移到需要添加超級鏈接的位置，選擇“插入→超級鏈接”，在“編輯超鏈接”對話框中單擊“書簽”按鈕，并在“在文檔中選擇位置”對話框中選擇特定的書簽，單擊“確定”按鈕即可。

超鏈接圖標(biāo)

插入-插入對象-由文件創(chuàng)建-勾選顯示為圖標(biāo)，第二點(diǎn)瀏覽選中要鏈接的文件。

本回答被提問者采納

超鏈接圖標(biāo)

1.找到“插入”，在下拉菜單找到“超鏈接”，或者按快捷鍵ctrl+k。
2.根據(jù)提示填寫相應(yīng)內(nèi)容。
3.單擊“確定”。
注：版本不同可能功能有區(qū)別，主要在第2步。