文鏈接：How to Hide Title for Selective WordPress Posts and Pages
原文標題：How to Hide the Title for Selective WordPress Posts and Pages
由遼觀進行翻譯整理。

Do you want to hide the title for selective WordPress posts and pages?
您想要隱藏特定的WordPress文章和頁面的標題嗎？

Titles can be helpful for both search engines and visitors, but not every page needs to display a title depending on its design.
標題對于搜索引擎和訪問者都很有幫助，但并非每個頁面都需要根據其設計顯示標題。

In this article, we will show you how to hide the title for specific WordPress posts and pages.
在這篇文章中，我們將向您展示如何隱藏特定的WordPress文章和頁面的標題。

Why Hide the Title on Specific WordPress Posts or Pages? 為什么要在特定的WordPress文章或頁面上隱藏標題呢？

When you create a WordPress page or post the first thing you’ll see is an ‘Add title’ field where you will type your title.
當您創建WordPress頁面或文章時，您首先會看到一個“添加標題”的字段，您可以在其中鍵入標題。

Most WordPress themes show this title at the top of the page or post. A descriptive, relevant title can let visitors know they’re in the right place and what to expect from this page.
大多數WordPress主題會在頁面或文章的頂部顯示這個標題。一個描述性的、相關的標題可以讓訪問者知道他們來到了正確的地方，并且可以對這個頁面有所期待。

Titles may be helpful, but not every page or post needs a title. Your website’s homepage is one common example.
標題可能是有幫助的，但并不是每個頁面或文章都需要標題。您網站的首頁就是一個常見的例子。

At other times you may want to show the page’s title in a different area. For example you might start your landing page with an eye-catching banner, and then show the title further down the page.
在其他情況下，您可能希望在不同的區顯示頁面的標題。例如，您可能會在引人注目的橫幅上開始您的登陸頁面，然后在頁面下方顯示標題。

In this guide, we’ll be covering three different methods to hide the post or page title in WordPress. Simply click the links below to jump to the method you prefer.
在本指南中，我們將介紹三種在WordPress中隱藏帖子或頁面標題的不同方法。只需點擊面的鏈接，跳轉到您喜歡的方法。

• Method 1: Remove All Post Titles in the Full Site Editor
  方法1：在全站編輯器中刪除所有帖子標題
• Method 2. Hide Titles on Specific Posts or Pages Using CSS
  方法2：使用CSS隱藏特定帖子或頁面的標題
• Method 3. Hiding Selective WordPress Titles Using a Plugin
  方法3：使用插件隱藏選擇性的WordPress標題
• Method 4. Hiding Selective WordPress Titles in Custom Page Designs
  方法4：在自定義頁面設計中隱藏選擇性的WordPress標題

Method 1: Remove Post Title Using Full Site Editor方法1：在全站編輯器中刪除所有帖子標題

If you’re using WordPress 5.9 or later, and have aWordPress themethat supports full site editing, then you can use this method to remove the title from all posts or all pages.
如果您使用的是WordPress 5.9或更高版本，并且擁有一個支持全站編輯的WordPress主題，那么您可以使用這種方法來刪除所有帖子或頁面的標題。

Not sure if your theme support full site editing?
不確定您的主題是否支持全站編輯？

If it does, then you’ll see the menu optionAppearance ? Editoravailable in your WordPress dashboard.
如果支持全站編輯，您將在WordPress儀表板中看到菜單選項“外觀 ? 編輯器”。

After clicking on ‘Editor’, the full site editor will launch.
點擊“編輯器”后，將啟動全站編輯器。

From here, you’ll need to select thetemplateyou want to edit by clicking on the dropdown at the top of the page, and then clicking on ‘Browse all templates’.
在這里，您需要通過點擊頁面頂部的下拉菜單，并點擊“瀏覽所有模板”，來選擇您想要編輯的模板。

In this example, we’ll edit the Single Post template so that we can hide all our blog post titles.
在這個例子中，我們將編輯單篇文章模板，以便隱藏所有博客文章的標題。

To hide the title, first you’ll need to click on the blog post title. Then, simply click on the three dots options menu and select the ‘Remove Post Title’ option at the bottom.
要隱藏標題，首先需要點擊博客文章的標題。然后，只需點擊三個點的選項菜單，并在底部選擇“刪除文章標題”選項。

Don’t forget to click the Save button at the top of the screen after you’re done customizing the template.
在您完成對模板進行自定義后，不要忘記點擊屏幕頂部的保存按鈕。

That’s it, you’ve hidden the title on all your blog posts.
完成了！您已經在所有博客文章中隱藏了標題。

If you’d like a way to hide the title only on specific posts or pages, the next method should work for you.
如果您想要僅在特定的文章或頁面上隱藏標題，下一種方法可能適合您。

Method 2: Hiding Selective WordPress Titles Using CSS方法2：使用CSS隱藏特定帖子或頁面的標題

You can hide a page or post’s title by adding custom CSS code to theWordPress Customizer. This method simply hides the title from your visitors, but it still loads in the page’s HTML code.
您可以通過向WordPress自定義器添加自定義CSS代碼來隱藏頁面或文章的標題。這種方法只是從訪客的視野中隱藏標題，但它仍然會在頁面的HTML代碼中加載。

This means that search engines can still use the title to help them understand your page’s contents, which is good for yourWordPress website’s SEOand can help you get more traffic.
這意味著搜索引擎仍然可以使用標題來幫助它們理解您頁面的內容，這對于您的WordPress網站的SEO非常有益，可以幫助您獲得更多的流量。

We’ll show you how to hide the title on specific posts or pages, or on all your posts and pages.
我們將向您展示如何在特定的文章或頁面上隱藏標題，或者在所有文章和頁面上都隱藏標題。

2.1 How to Hide the Title on a Specific WordPress Post or Page With CSS如何使用CSS在特定的WordPress文章或頁面上隱藏標題

To hide a page or post’s title using CSS, you just need to know its ID.
要使用CSS隱藏頁面或文章的標題，您只需要知道它的ID。

In your WordPress dashboard, either go toPosts ? All Posts, orPages ? All Pages. Then find the page or post where you want to hide the title.
在WordPress儀表板中，要么轉到“文章” ? “所有文章”，要么轉到“頁面” ? “所有頁面”。然后找到您想要隱藏標題的頁面或文章。

You can now open this post or page for editing.
您現在可以打開此文章或頁面進行編輯。

Now simply take a look at the URL in your browser’s address bar.
現在只需查看瀏覽器地址欄中的URL。

You should see a ‘post=’ section followed by a number. For example ‘post=100.’
您應該看到一個由數字跟隨的“post=”部分。例如，“post=100”。

This is your post’s ID. Make a note of this number, as you’ll be using it in your CSS code.
這是您的文章的ID。請記下這個數字，因為您將在CSS代碼中使用它。

You can now go to Appearance ? Customize.
現在您可以轉到“外觀” ? “自定義”。

This launches the WordPress Customizer.
這將啟動WordPress自定義器。

In the sidebar, simply click on Additional CSS.
在側邊欄中，只需單擊“附加CSS”。

Now scroll to the bottom of the sidebar.
現在滾動到側邊欄底部。

You should now see a small text editor. This is where you’ll type your CSS code.
您現在應該看到一個小型文本編輯器。這是您輸入CSS代碼的地方。

If you want to hide the title for a post, you’ll need to use the following code.
如果您想隱藏文章的標題，您需要使用以下代碼。

Just make sure you replace the ‘100’ with the post ID you got in the previous step.
只需確保將“100”替換為您在前一步驟中獲得的文章ID。

.postid-100 .entry-title {
display: none;
}

If you want to hide a page’s title, you’ll need to use some slightly different code.
如果您想隱藏頁面的標題，您需要使用略有不同的代碼。

Once again make sure you replace the ‘100’ with your real page ID.
如果您想隱藏頁面的標題，您需要使用略有不同的代碼。

.page-id-100 .entry-title {
display: none;
}

Next, just scroll to the top of the page.
接下來，將頁面滾動到頂部。

You can then click on the blue Publish button.
然后，您可以點擊藍色的“發布”按鈕。

Now if you check this page or post, the title should have disappeared.
現在，如果您檢查此頁面或文章，標題應該已經消失了。

Is the title still there?
標題還在嗎？

If this method hasn’t worked for you, your WordPress theme may be using a different CSS class. This means your page or post ID will be different from the number shown in its URL.
如果這種方法對您不起作用，那么您的WordPress主題可能正在使用不同的CSS類。這意味著您的頁面或文章ID將與其URL中顯示的數字不同。

To get the correct ID, you’ll need to use your browser’s developer console.
要獲取正確的ID，您需要使用瀏覽器的開發者控制臺。

To start, head over to the page or post on your WordPress website. You can then open your browser’s developer console.
首先，轉到WordPress網站上的頁面或文章。然后，您可以打開瀏覽器的開發者控制臺。

This step will vary depending on which web browser you’re using. For example, if you have Chrome then you can use the Control+Shift+J keyboard shortcut on Windows, or the Command+Option+J shortcut on Mac.
這一步驟會根據您使用的Web瀏覽器而有所不同。例如，如果您使用的是Chrome瀏覽器，您可以在Windows上使用Control+Shift+J鍵盤快捷鍵，或者在Mac上使用Command+Option+J快捷鍵。

Chrome users can also Control+click anywhere on the page or post, and then select Inspect.
Chrome用戶還可以在頁面或文章的任何位置Control+點擊，然后選擇”Inspect“。

If you’re unsure how to open the developer console, you can always check your browser’s website or official documentation for more information.
如果您不知道如何打開開發者控制臺，您可以隨時查看瀏覽器的網站或官方文檔以獲取更多信息。

In the developer console, click on the three dotted icon. You can then select ‘Search.’
在開發者控制臺中，點擊三個點的圖標。然后，您可以選擇“搜索”。

You should now see a search bar towards the bottom of the developer console.
現在，您應該會在開發者控制臺的底部看到一個搜索欄。

In this bar, type <body class, then simply press the Enter key on your keyboard.
在此欄中，鍵入<body class，然后只需按下鍵盤上的Enter鍵。

If you’re looking at a WordPress page, you should see something similar to the following.
如果您正在查看一個WordPress頁面，您應該會看到類似以下的內容。

<body class="page-template-default page page-id-78 logged-in admin-bar 
no-customize-support wp-embed-responsive is-light-theme no-js singular">

In the sample code above, you can see that the ‘page-id’ value is 78.
在上面的示例代碼中，可以看到"page-id"的值為78。

If you’re inspecting a WordPress post, the console should show something like:
如果您在檢查WordPress文章，控制臺應該顯示類似以下內容：

<body class="post-template-default single single-post postid-100 single-format-standard logged-in admin-bar no-customize-support wp-embed-responsive is-light-theme no-js singular">

In that example, the ‘postid’ value is 100. You can now use this value with the CSS code we provided in the previous step.
在這個示例中，"postid"的值為100。您現在可以將這個值與我們在上一步中提供的CSS代碼一起使用。

Simply add this code to your website using the WordPress Customizer, following the process described above.
只需按照上述描述的過程，使用WordPress自定義器將此代碼添加到您的網站上即可。

You can now take a look at the page or post. The title should have vanished.
您現在可以查看頁面或文章。標題應該已經消失了。

2.2 How to Hide the Title on All Posts or Pages with CSS如何使用CSS隱藏所有帖子或頁面的標題

To hide the titles for all your pages and posts, copy/paste the following into the text editor.
要隱藏所有頁面和帖子的標題，請將以下內容復制/粘貼到文本編輯器中。

.entry-title {
display: none;
} 

Do you want to hide the titles for all your pages, but not your posts? To hide all the page titles, copy/paste the following into the small text editor.
您想要隱藏所有頁面的標題，但不隱藏帖子的標題嗎？為了隱藏所有頁面的標題，請將以下內容復制/粘貼到小文本編輯器中。

.page .entry-title {
display: none;
} 

Another option is hiding the title for all of your posts. You can do this using the following CSS.
另一個選擇是隱藏所有帖子的標題。您可以使用以下CSS代碼來實現。

.post .entry-title {
display: none;
} 

Sometimes you may want to hide the titles for all your posts and pages.
有時候您可能希望隱藏所有頁面和帖子的標題。

To do that, add the following.
要做到這一點，請添加以下代碼。

.entry-title {
   display: none; 
}

Method 3: Hiding Selective WordPress Titles Using a Plugin第三種方法：使用插件隱藏選擇性的WordPress標題

You can easily hide the title for selective posts and posts using Hide Page And Post Title. This free plugin lets you hide the title of any page, post, or even custom posts types.
您可以使用Hide Page And Post Title輕松地隱藏選擇性的頁面和帖子的標題。這個免費插件允許您隱藏任何頁面、帖子，甚至自定義帖子類型的標題。

譯者注：請注意，隱藏標題后，頁面或帖子的標題將不再顯示在前臺，但標題仍然存在于后臺編輯界面，您可以隨時修改和恢復標題的顯示。

First you’ll need to install and activate the Hide Page And Post Title plugin. If you need help, you can follow our tutorial on how to install a WordPress plugin.
首先，您需要安裝并激活Hide Page And Post Title插件。如果需要幫助，您可以按照我們的WordPress插件安裝教程進行操作。

Upon activation, open the page, post or custom post you want to edit.
在激活插件后，打開您想要編輯的頁面、帖子或自定義帖子。

Now simply scroll to the bottom of the right sidebar.
現在只需要向右邊欄的底部滾動。

Here you’ll find a new ‘Hide Page and Post Title’ box.
在這里，您會找到一個名為“隱藏頁面和帖子標題”的新框。

譯者注：請注意，這個框可能在編輯頁面或帖子的不同位置，具體取決于您的主題或其他插件的設置。通常，您可以在編輯頁面或帖子的右側邊欄或編輯器中找到該框。

To hide the title, just click to select the ‘Hide the title’ checkbox. You can then update or publish this post as normal.
要隱藏標題，只需點擊選擇“隱藏標題”復選框。然后，您可以像正常編輯頁面或發布帖子一樣更新或發布。

That’s it! If you visit the page you’ll notice that the title has disappeared.
就是這樣！如果您訪問該頁面，您會注意到標題已經消失了。

At some point you may need to restore this page or post’s title.
在某些時候，您可能需要恢復該頁面或帖子的標題。

This is easy. Just open the page or post for editing. Then click to deselect the same ‘Hide the title’ checkbox.
這很簡單。只需打開要編輯的頁面或帖子。然后點擊取消選擇相同的“隱藏標題”復選框。

Don’t forget to click on the Update button at the top of the screen. Now if you visit this page, the title should have reappeared.
不要忘記點擊屏幕頂部的“更新”按鈕。現在，如果您訪問此頁面，標題應該已經重新出現。

Method 4: Hiding Selective WordPress Titles Using SeedProd方法四：使用SeedProd隱藏選擇性的WordPress標題

Another option is to hide the title using a page builder plugin.
另一個選項是使用頁面構建器插件隱藏標題。

SeedProd is the best WordPress page builder plugin in the market. You can use this plugin to easily creating custom pages or even create your own WordPress theme.
SeedProd是市場上最好的WordPress頁面構建器插件。您可以使用這個插件輕松創建自定義頁面，甚至創建自己的WordPress主題。

This means you can easily hide the title on a custom page design or your theme.
這意味著您可以輕松地在自定義頁面設計或您的主題中隱藏標題。

SeedProd comes with a template library with over 150+ templates you can use as a starting point for your page designs. Let’s see how easy it is to remove the title from one of these theme templates.
SeedProd附帶了一個模板庫，其中包含150多個模板，您可以用作頁面設計的起點。讓我們看看如何從其中一個主題模板中刪除標題。

In your WordPress dashboard go to SeedProd ? Template Builder. You can then click on the Themes button.
在WordPress儀表板中，轉到SeedProd ? 模板構建器。然后，您可以點擊主題按鈕。

This launches the SeedProd template library. You can now browse through all of the different designs.
這將啟動SeedProd模板庫。您現在可以瀏覽所有不同的設計。

To take a closer look at a template simply hover your mouse over it. Then click on the magnifying glass icon.
要仔細查看模板，只需將鼠標懸停在其上，然后點擊放大鏡圖標。

This will open the template in a new tab.
這將在一個新標簽中打開模板。

When you find a template that you want to use, hover your mouse over that template. Then simply click on the checkmark icon.
當您找到一個要使用的模板時，將鼠標懸停在該模板上。然后只需點擊復選標記圖標即可。

This adds all of this template’s designs to your WordPress dashboard.
這將把這個模板的所有設計添加到您的WordPress儀表板中。

There are usually different designs for different types of content.
通常針對不同類型的內容有不同的設計。

You can use these templates to hide the title for the different content types. For example, many SeedProd templates have a separate design for the homepage.
您可以使用這些模板來隱藏不同內容類型的標題。例如，許多SeedProd模板都有一個專門的設計用于首頁。

To hide the title for your homepage, you would simply need to edit the Homepage template.
要隱藏首頁的標題，您只需要編輯首頁模板即可。

To hide the title for all your posts, you’ll typically need to edit the Single Post template.
要隱藏所有文章的標題，通常需要編輯Single Post模板。

Meanwhile if you want to hide the title from your pages you’ll usually edit SeedProd’s Single Page template.
而如果您想隱藏頁面的標題，則通常需要編輯SeedProd的Single Page模板。

To edit a template hover your mouse over it.
要編輯模板，請將鼠標懸停在模板上。

You can then go ahead and click on the Edit Design link.
然后，您可以點擊“編輯設計”鏈接進行編輯。

This opens this design in the SeedProd drag and drop editor. To hide the title, find either the Post or Page Title.
這將在SeedProd的拖放編輯器中打開此設計。要隱藏標題，請找到“文章標題”或“頁面標題”。

Once you spot this title, give it a click. SeedProd’s sidebar will now show all of the settings for the selected area.
一旦找到標題，請點擊它。SeedProd的側邊欄將顯示所選區域的所有設置。

At the top of this panel you should see either Post Title or Page Title.
在這個面板的頂部，您應該看到“文章標題”或“頁面標題”。

After confirming that you’ve selected the right area, hover over the Post Title or Page Title in the main SeedProd editor.
確認選擇了正確的區域后，在主SeedProd編輯器中將鼠標懸停在“文章標題”或“頁面標題”上。

You should now see a row of controls.
現在您應該看到一行控件。

To remove the title from this design just click on the Trash icon.
要從此設計中刪除標題，只需點擊垃圾桶圖標。

SeedProd will ask whether you really want to delete the title. To go ahead and remove it, simply click on ‘Yes, delete it!’
SeedProd將詢問您是否真的要刪除標題。要繼續刪除，請點擊“是，刪除它！”

The title will now disappear from your design.
標題現在將從您的設計中消失。

To see how this will look on your website click on the Preview button.
要查看它在您的網站上的效果，請點擊“預覽”按鈕。

When you’re happy with your design click on the Publish button.
當您對設計滿意時，請點擊“發布”按鈕。

Depending on how your site is set up, you may need to remove the title from some additional templates. For example you might want to hide the title for all your posts and pages. In this case, you would typically need to edit both the Single Post and Single Page templates.
根據您的網站設置，您可能需要從一些額外的模板中刪除標題。例如，您可能希望隱藏所有文章和頁面的標題。在這種情況下，您通常需要編輯單篇文章和單頁模板。

If you’re unsure then it may help to review all the designs that make up your theme. To do this simply go to SeedProd ? Theme Builder.
如果您不確定，可以檢查一下組成您主題的所有設計。只需轉到SeedProd ? 主題構建器。

You should now see a list of all your different designs. You can now edit any of these templates following the same process described above.
您現在應該可以看到所有不同設計的列表。您現在可以按照上面描述的相同步驟編輯任何這些模板。

FAQs About Hiding the Title for Selective Pages and Posts有關選擇性隱藏頁面和文章標題的常見問題

Before hiding your page or post titles, there are some effects you should think about, such as the impact this action will have on your website’s SEO.
在隱藏頁面或文章標題之前，您應該考慮一些影響，比如此操作對您的網站SEO的影響。

That being said, here are some of the most frequently asked questions about hiding the page and post title.
話雖如此，以下是關于隱藏頁面和文章標題的一些常見問題：

Why can’t I just leave the ‘Add title’ field blank?為什么我不能只是將“添加標題”字段留空？

When it comes to hiding the title there seems like an easy fix. As you’re creating your page, just leave the title field blank.
在隱藏標題方面，似乎有一個簡單的解決方法。在創建頁面時，只需將標題字段留空即可。

At first this does seem to fix the problem. WordPress will display this post to visitors without a title. However, there are a few problems.
起初，這似乎解決了問題。WordPress將在沒有標題的情況下向訪問者顯示此頁面或文章。然而，確實存在一些問題。

Firstly, this page or post will appear as ‘(no title)’ in your WordPress dashboard. This makes it more difficult to keep track of your pages.
首先，在WordPress儀表板中，該頁面或文章將顯示為“(no title)”（無標題）。這使得跟蹤頁面變得更加困難。

If you create lots of different ‘(no title)’ posts, then how do you know which is your contact us page? And which page is your homepage?
如果您創建了許多不同的“(no title)”文章，那么您如何知道哪個是您的聯系我們頁面？哪個是您的首頁？

WordPress also uses the title to create the page’s URL.
WordPress還使用標題來創建頁面的URL。

If you don’t provide a title, then by default WordPress uses a number instead, such as ‘www.mywebsite/8.’
如果您不提供，WordPress默認使用一個數字，“wwwwebsite/8”。

Visitors often use the URL to help them understand where they are on your WordPress website, so ‘www.mywebsite/8’ isn’t particularly helpful.
訪問者通常使用URL來幫助他們理解自己在WordPress網站上的位置，“www.mywebsite/8”并不特別有幫助。

This vague URL is not an SEO-friendly permalink, so search engines may have a harder time understanding what your content is about and including it in the relevant search results.
這種模糊的URL不是一個友好的SEO永久鏈接，所以搜索引擎可能很難理解您的內容是關于什么，并將其包含在相關的搜索結果中。

Will hiding the page or post title affect my SEO?隱藏頁面或文章標題可能會對您的SEO產生影響。

If you prefer to hide a page or post’s title, you’ll want to spend some extra time fine-tuning the rest of your WordPress SEO, including setting an SEO title. This will help ensure that the search engines understand your page’s content, even without the title.
如果您希望隱藏頁面或文章的標題，您需要額外花費一些時間來優化您的WordPress SEO，包括設置SEO標題。這樣可以確保搜索引擎即使沒有標題也能理解頁面的內容。

Here you’ll need a good SEO plugin, since WordPress doesn’t let you do this by default.
在這里，您將需要一個好的SEO插件，因為WordPress默認情況下不允許您這樣做。

We recommend using AIOSEO, the best SEO plugin for WordPress in the market. This beginner friendly SEO toolkit is used by over 3 million websites.
我們推薦使用AIOSEO，這是市場上最好的WordPress SEO插件。這個適合初學者的SEO工具包被超過300萬個網站使用。

If you need help getting started, then please refer to our guide on how to properly set up All in One SEO in WordPress.
如果您需要幫助入門，請參考我們的指南，了解如何正確設置WordPress中的All in One SEO。

To make sure your titles are optimized, you can see our guide on how to use the headline analyzer in AIOSEO.
為了確保您的標題被優化，您可以參考我們的指南，了解如何使用AIOSEO中的標題分析器。

We hope this article helped you learn how to hide the title for selective WordPress posts and pages. You can also go through our guide on how to choose the best web design software, and the best WordPress landing page plugins.
我們希望本文能幫助您學習如何隱藏選擇性WordPress文章和頁面的標題。您還可以閱讀我們的指南，了解如何選擇最佳的網頁設計軟件和最佳的WordPress落地頁插件。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
如果您喜歡這篇文章，請訂閱我們的YouTube頻道，觀看WordPress視頻教程。您也可以在Twitter和Facebook上找到我們。

、 通過style屬性中的 display : none { 這種是最常用方式之一 }

display : none

這兩種方式的區別是: display 設置為 none之后, 該元素不占用文檔流

visibility 設置為 hidden之后, 該元素仍然占用文檔流, 只不過是看不見了而已

2 、通過style屬性中的 visibility : hidden { 這種也是最常用的方式之一 }

visibility : hidden

3 、通過相對定位移動當前元素到屏幕左側

div{     
    position: relative;     
    left: -100%
}

但是要記住:

1 元素仍然占用標準文檔流 2 百分比是相對父元素的寬度和高度的, 并不是相對可視區寬度偏移的

4 、通過元素內文本對齊將子元素移動到父元素右側, 配合超出后不顯示

.div{    
    text-indent: 100%;    
    white-space: nowrap;    
    overflow: hidden;
}

注意點: 此時子元素仍然占用文檔流, 只是我們隱藏了超出部分

5 、設置元素的寬度和高度為0, 元素直接消失

.div{    
    width: 0px;    
    height: 0px;
}

注意點:

1 標準文檔流是相對于一個容器來說的, 每一個容器有自己的文檔流, 我們只關心當前元素所在的文檔流 2 高度和寬度都設置為0后, 我們就可以認為此元素不再占用其父元素的標準文檔流了, 但是這個容器仍然存在, 這個容器也存在一個標準文檔流, 供其子元素使用; 其子元素不會消失, 仍然會正常顯示, 但是不會占用其父元素所在的標準文檔流( 即子元素顯示不會受其影響, 此元素占用文檔流的大小也不會受其子元素的影響 )

6 、設置元素透明度為 0

div{    
  opacity: 0;
}

這個感覺有點傻乎乎的, 掩耳盜鈴, 不過這個經常用來做動畫變換

7、 旋轉元素, 使與當前頁面垂直

div{    
  transform: rotateX(90deg);
}

注意點: 這個只是顯示上的變換, 仍然會占用原元素大小和位置的文檔流, 其它各種變換也是如此。

8 、縮小元素尺寸到自身的0倍

div{    
  transform: scale(0);
}

注意點: 同上

9 、其它 transform 使其假不可見