這是一款使用純css3製作的超酷文章卡片ui設計效果。該文章卡片帶有陰影效果，當滑鼠滑過卡片時，文章的描述資訊會以滑動動畫的方式顯示在卡片中。
html結構
一張卡片的html結構如下：12
<h1>文章標題
<h2class="animate-text">文章子標題
<pclass="animate-text">文章的描述資訊
<divclass="dots">
<span>
<span>
<span>
css樣式
整個卡片包裹容器以flex進行布局。12
3456
7.wrap
每張卡片的寬度和高度都設定為380畫素。並使用box-shadow屬性為卡片設定乙個大陰影效果，同時為所有的動畫設定ease-out效果的過渡動畫。12
3456
78910
1112
1314
15.tile
卡片中的使用絕對定位，寬度和高度都為100%，佔據滿整個卡片。12
3456
789.tile img
卡片中的文字層頁採用絕對定位，通過z-index屬性將文字放置在之上。h2文字和p文字通過translatex函式移動了-200%，即將它們移動到卡片之外，初始不可見。12
3456
78910
1112
1314
1516
1718
1920
2122
2324
2526
2728
.tile .text
.tile h1
.tile h2
.tile p
.animate-text
在滑鼠滑過卡片的時候，卡片的陰影被修改，卡片被放大1.05倍。卡片中的的透明度被設定為0.2，文字一共會原來的位置，透明度設定為1。12
3456
78910
11.tile:hover
.tile:hover img
.tile:hover .animate-text
c 基礎資料型別（雖然很簡單，但是經常用到）
1.c 中，最常見的兩大資料型別是值型別和引用型別。值型別也可稱之為基礎資料型別，包含簡單型別，列舉型別，結構型別三種。引用型別包括字串型別，陣列型別，類型別，物件型別，介面型別和 型別。常見的值型別 int float double struct 引用型別 string arraylist has...
只狼手柄體驗，雖然死的多，但是真的爽
昨天，只狼 終於解鎖了 雖然經歷了一點小風波，但是很快就解決了 無數抖m和新入坑玩家都喜極而泣 很多也第一時間開啟了遊戲，拿起手柄肝了起來 一晚的成果大概就是這樣子吧 這次只狼有很多地方都和老賊的魂系列有著不一樣的地方。像沒有了一擊必殺的忍殺 取消綠條 可以上躥下跳 能飛簷走壁 落下傷害判定的改變 ...
雖然微不足道但是很有用的JAVA基礎 集合簡介
集合分為list，set，map 三種，但是只有list和set 是繼承了 collection map 則提供從key到value的對映，並且key不能重複，value則可以。1.list 分為arraylist 和 linkedlist 以及 vector arraylist 底層的實現方式為動...