Web前端（四）-溢位設定、垂直對齊方式、顯示層級、視訊播放、圖片盜鏈、圖片問題多張圖合併在一起顯示問題

阿新 • • 發佈：2021-07-30

溢位設定overflow

hidden: 超出部分不顯示 ,可以解決高度識別為0 和粘連問題
visible: 超出部分顯示(預設)
scroll: 超出部分滾動顯示

行內元素的垂直對齊方式vertical-align

baseline:基線對齊(預設)
top:上對齊
middle:中間對齊
bottom:下對齊

元素的顯示層級z-index

z-index可以理解為z軸垂直於螢幕的一個朝向, 值越大離眼睛越近, 這樣元素顯示的位置就越靠前

視訊播放

<!--poster設定封面 loop迴圈播放 autoplay自動播放(必須設定靜音才能自動播放)
muted靜音 controls是否顯示控制元素-->
<video poster="https://ys.mihoyo.com/main/_nuxt/img/47f71d4.jpg"
    loop="loop" autoplay="autoplay" muted="muted"
    controls="controls">
  <!--source視訊源-->
  <source src="https://ys.mihoyo.com/main/_nuxt/videos/3e78e80.mp4">
</video>

圖片盜鏈問題

兩種情況
- 圖片標籤: 直接在圖片上右鍵複製圖片地址
- 背景圖片: 右鍵檢查從樣式中檢視，找到圖片路徑，在路徑上面右鍵 copy link address

圖片資源是多張圖合併在一起的問題

這種為了將展示頁面時多次檔案傳輸合併成一次傳輸

Web前端（四）-溢位設定、垂直對齊方式、顯示層級、視訊播放、圖片盜鏈、圖片問題多張圖合併在一起顯示問題

溢位設定overflow hidden: 超出部分不顯示 ,可以解決高度識別為0 和粘連問題 visible: 超出部分顯示(預設)

（四）c語言之位元組對齊方式

// 對齊原則：每一成員需對齊為後一成員型別的倍數 // 補齊原則：最終大小補齊為成員型別最大值的倍數

Web前端（九）-建立SpringBoot專案、web伺服器（WebServer、Servlet、Controller）、SpringBoot介紹（處理靜態、動態資源請求、客戶端發出請求的幾種方式、獲取客戶端傳遞引數的方式）

建立SpringBoot專案步驟第一步：新建一個工程/專案：File-->New-->Project，選擇Spring Initializr 預設選項即可, 如果下一步一直轉圈或顯示timeout超時，則使用下面備用的地址：https://start.springboot

【譯】ASP.NET Core Web APIs（四）：教程：使用ASP.NET Core 建立一個Web API

本教程將介紹使用ASP.NET Core建立一個Web API的基礎知識。在本教程中，你將學到如何：

web基礎（四）嚴格模式與混雜模式

web基礎（四）嚴格模式與混雜模式一、介紹 DOCTYPE 標籤是一種標準通用標記語言的文件型別宣告，它的目的是要告訴標準通用標記語言解析器，它應該使用什麼樣的文件型別定義（DTD）來解析文件。DOCTYPE 可宣告三種DT

java web開發（四）Servlet

>>> 一動態web技術開發動態web的技術，常見的有ASP，PHP，JSP和Servlet。基於java的動態web開發，Sun公司提供了Servlet和JSP兩種技術。

web面試（四）瀏覽器

1、如何實現瀏覽器內多個標籤頁之間的通訊實現瀏覽器內多個標籤頁之間的通訊

Spring（四）——Spring容器載入的三種方式講解

一、類路徑獲得配置檔案後面的路徑放到src路徑下的相對地址。程式碼打包會把src打包到class路徑下，類路徑，就是相對src的路徑。

CSS基礎行內元素/行內塊元素設定垂直對齊方式及常見使用案例

vertical-align 屬性值效果 baseline 基線對齊 top 頂部對齊 middle 中心對齊 bottom 底部對齊使用案例1：百度搜索框左邊和右邊底部沒有對齊

WEB前端第四十三課——jQuery框架（一）$()函式、新增事件監聽

1.前端進階之路　　菜鳥級：設計圖的還原，就是根據PSD檔案寫HTML和CSS；　　入門級：加頁面特效，輪播圖、選單、選項卡、無縫滾動等；

Web前端（十四）-VRD、首頁分類展示、輪播圖、登入、會話管理、Cookie和Session、Cookies記住使用者名稱和密碼、Session記住登入狀態

VRD 準備工作: 建立工程vrd 11改8 打3個勾把昨天工程5-2的application.properties裡面內容複製到新工程, 把裡面的weibodb改成vrddb

WEB前端第四十四課——jQuery框架（二）常用方法

1.css()方法　　用於更改jq物件的css樣式，本方法可讀可寫，相當於js中的style屬性

WEB前端第四十六課——jQuery框架（四）關係節點

1.children()方法　　該方法用於選中某一個元素的所有直接子元素。　　　　語法：$(\"selector\").children(\"subSelector\");

Web前端（十五）-後臺管理頁面（歡迎XXX登入和退出登入）、釋出作品功能

後臺管理頁面歡迎xxx和退出登入在admin.html頁面中建立vue物件管理header標籤,並在created裡面請求當前登入的使用者物件,在methods裡面宣告logout方法

【Python基礎知識】（四）比較運算子、邏輯運算子和if語句

比較運算子 1、檢查是否相等　　相等運算子（==）：用來判斷二者是否“相等”，注意與賦值運算子（=）區分。

五（四）、封裝性

面向物件的特徵一：封裝與隱藏；一、問題引入當我們建立一個類的物件以後，我們可以通過 “物件.屬性”的方式，對物件屬性進行賦值。這裡，賦值操作要受到屬性的數量型別和儲存範圍的制約。除此之外，沒

Solr專題（四）Solr安全設定

因為solr的admin介面預設只需要知道ip和埠就能直接訪問，如果被別有用心的人盯上就很容易給你的系統帶來重大的破壞，所以我們應該限制訪問。

（四）Springboot與web專案-靜態資源處理

1、建立新的工程 package com.hengqin.springbootwebdemo.controller; import org.springframework.stereotype.Controller;

前端程式設計師學好算法系列（四）連結串列

24. 兩兩交換連結串列中的節點給定一個連結串列，兩兩交換其中相鄰的節點，並返回交換後的連結串列。

【外掛開發】VSCode外掛開發全攻略（四）命令、選單、快捷鍵

文章轉載於：https://www.cnblogs.com/liuxianan/p/vscode-plugin-command-and-menu.html 命令我們在前面HelloWord章節中已經提到了命令寫法，這裡再重溫一下。

Web前端（四）-溢位設定、垂直對齊方式、顯示層級、視訊播放、圖片盜鏈、圖片問題多張圖合併在一起顯示問題

溢位設定overflow

行內元素的垂直對齊方式vertical-align

元素的顯示層級z-index

視訊播放

圖片盜鏈問題

圖片資源是多張圖合併在一起的問題

相關推薦