用 webkit box reflect製作倒影

1.只在webkit核心的瀏覽器上有效果

2.語法:

-webkit-box-reflect:

direction： 倒影偏移方向，有above、below、left和right四個值；

offset： 倒影偏移原元素邊框邊緣的距離,單位可為px或者%；

mask-box-image： 覆蓋倒影的遮罩。

3.下面是demo：

doctype html

>
<
html 
lang
="en"
>
<
head
>
<
meta 
charset
="utf-8"
>
<
title
>用-webkit-box-reflect 製作倒影
title
>
<
style
>
.photo-reflection
/*-webkit-box-reflect: 
*/.photo-reflection img
.text-reflection
style
>
head
>
<
body
>
<
div 
class
="photo-reflection"
>
<
img 
src="./qin_03.png"
>
<
div 
class
="text-reflection"
><
p>民族舞泛指產生並流傳於民
p>
div>
div>
body
>
html
>

用Margin還是用Padding

用margin還是用padding 何時應當使用margin 需要在border外側新增空白時。空白處不需要背景 色 時。上下相連的兩個盒子之間的空白，需要相互抵消時。如15px 20px的margin，將得到20px的空白。何時應當時用padding 需要在border內測新增空白時。空白處需要背...

用Margin還是用Padding

用margin還是用padding這個問題是每個學習css高階時的必經之路。css邊距屬性定義元素周圍的空間。通過使用單獨的屬性，可以對上 右 下 左的外邊距進行設定。也可以使用簡寫的外邊距屬性同時改變所有的外邊距。w3school 邊界 margin 元素周圍生成額外的空白區。空白區 通常是指其他...

用yaml寫用例

第一步 安裝yaml，在執行裡輸入 pip install pyyaml 檢驗是否安裝成功，在pycharm裡輸入 import yaml 第二步 建立乙個file，字尾寫yaml或yml 在yml檔案裡寫入單個使用者名稱和密碼 開啟yml檔案並以字典的形式列印出來 執行結果 在yml檔案裡寫入多個...