Css打造乙個簡單的靜態七巧板

2022-06-17 15:36:12 字數 456 閱讀 4143

偶然在微博上看到用css寫乙個七巧板,正好也有一些源**,於是就試著敲了敲。

主要是利用了css3的transform,實現平移,旋轉,變形,直接用看到的**敲出來之後有些問題,因為寬度上下面綠色的三角形和右邊藍色的三角形沒有做限制,所以我做出來看到的效果是這樣的:

之後自己做了稍微的調整,調整之後的效果是這樣的:

這裡直接將板子的位置放在了瀏覽器的左上角,利用了border-top和border-right來進行位置的控制,下面是**:

html**:

css**:

.warp

.t.t1

.t2.t3

.t4.t5

.t6.t7

乙個簡單的PHP留言板

如果你已經有一定程式設計基礎請自行出門左轉 接下來我們就直接開始。首先構建乙個進入的主頁面 這是首頁 此處混編 接下來就是書提交到資料庫,此處對資料進行驗證一下,看是否提交了空資料 展示介面就是將已經寫好的資料,從資料庫中迴圈出來即可。include conn.php perpagenum 5 定義...

PHP MySql實現乙個簡單的留言板

跟著書學的,不是自己寫的,但是都能理解,有時間自己去寫個好看一點的吼吼吼 不熟練花了一天的時間 留言板是接觸web開發的基礎,寫乙個留言板需要知道前端的一些基礎標籤,對資料庫有乙個了解會基礎sql語言,php基礎知識,前段基礎 資料庫基礎 php基礎 留言板。前方高能哇 介面真的是吃藕誒 先建乙個資...

乙個簡單的靜態郵箱登入介面

已上傳至github 使用者名稱是tom,密碼是123,當輸入錯誤時 賬號密碼為空 輸入正確的賬號密碼時跳 首先是css,我隨便寫的,沒有和原網頁一致,差不多就好 top all all first login,all first pas all second number all second p...