中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

CSS響應視頻的方法

發布時間:2022-03-05 16:57:18 來源:億速云 閱讀:193 作者:iii 欄目:web開發

這篇文章主要講解了“CSS響應視頻的方法”,文中的講解內容簡單清晰,易于學習與理解,下面請大家跟著小編的思路慢慢深入,一起來研究和學習“CSS響應視頻的方法”吧!

1、響應視頻

響應視頻CSS技巧是在tjkdesign.com發現的,能夠使得視頻嵌入并從全角擴大到邊界。

.video {

position: relative;

padding-bottom: 56.25%;

height: 0;

overflow: hidden;

}

.video iframe,

.video object,

.video embed {

position: absolute;

top: 0;

left: 0;

width: 100%;

height: 100%;

}

2、最小和最大寬度

可以設置元素的最大寬度,目的是防止元素超出邊界。

智能社 撰稿,交流加扣裙:533319658

?最大寬度

下面示例中,我們用800 px的容器,規定不超過邊界寬度的90%。

.container {

width: 800px;

max-width: 90%;

}

?響應式圖片

你可以設置最大寬度:100%,高度:默認,自動調整圖像的最大寬度邊界。

img {

max-width: 100%;

height: auto;

}

上面的響應圖像只能在CSS IE7和IE9中適用,但在IE8不起作用。要使用的話,需設置寬度:自動,你也可以專門為IE8申請一個特殊CSS條件,或使用如下的IE hack:

@media screen {

img {

width: auto; /* for ie 8 */

}

}

?最小寬度

最小寬度和最大寬度是相對的,在下面的示例中,最小寬度用于在輸入文本字段時,防止輸入值按比例縮小時非常小。

3、相對值

在響應設計中,知道何時使用相對值可以簡化CSS,最大化設置好布局結果,下面是一些例子。

?相對邊距

下面是一個關于commentlist的例子,相對左邊距適當空出用于評論區,用百分比值設置一個子列表。如左側所示的屏幕截圖,內容框的列表變得非常小。

?相對字體

相對值(如em或%),字體大小,行高和邊距都可以調整,例如,可以對所有父元素中的子元素簡單改變字體大小。

?相對比例填充

下面的屏幕截圖顯示,最好使用相對比例填充,而不是固定像素填充。左邊框顯示了使用像素填充而導致不平衡的填充空間,右邊框填充比例顯示內容區域的最大化。

4、Overflow: hidden技巧

這個技巧非常有用,可以從前面元素中清除浮動并保持集合內的內容通過Overflow:hidden運行。

5、word-break

即自動換行屬性,可以使用unbreaking文本(如長URL文本)包裝而不是只在一行運行。

.break-word {

word-wrap: break-word;

}

感謝各位的閱讀,以上就是“CSS響應視頻的方法”的內容了,經過本文的學習后,相信大家對CSS響應視頻的方法這一問題有了更深刻的體會,具體使用情況還需要大家實踐驗證。這里是億速云,小編將為大家推送更多相關知識點的文章,歡迎關注!

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

css
AI

建始县| 若尔盖县| 高密市| 尼勒克县| 汨罗市| 赫章县| 台江县| 东源县| 定远县| 崇义县| 苏尼特左旗| 三江| 万山特区| 浦江县| 惠来县| 吴江市| 习水县| 锡林浩特市| 安化县| 岳普湖县| 乐安县| 秦安县| 延吉市| 邻水| 吴忠市| 唐海县| 邢台县| 汪清县| 泗洪县| 南汇区| 新绛县| 外汇| 甘肃省| 措美县| 大理市| 东明县| 福海县| 安多县| 郎溪县| 乌拉特中旗| 保亭|