網(wǎng)頁制作中分類的選項(xiàng)卡特效代碼

2022-06-17    分類: 網(wǎng)站建設(shè)

選項(xiàng)卡原身是Windows操作系統(tǒng)的一個(gè)創(chuàng)意,即通過交換選項(xiàng),讓很多項(xiàng)目信息輪替顯示在大小和位置都固定的小塊區(qū)域里。因此選項(xiàng)卡具有占用篇幅小,輻射內(nèi)容大的特點(diǎn)。一個(gè)典型的例子是你打開IE瀏覽器,依次點(diǎn)擊“工具”-“Internet選項(xiàng)”,這個(gè)表單就是一個(gè)選項(xiàng)卡典型布局。當(dāng)然了,這里所說的選項(xiàng)卡效果是要在Web頁面實(shí)現(xiàn)的,并非應(yīng)用程序里的菜單選項(xiàng),在網(wǎng)頁中應(yīng)用選項(xiàng)卡可以使網(wǎng)頁顯得更緊湊,結(jié)合AJAX技術(shù)可以使頁面在有限的空間內(nèi)展現(xiàn)更多的內(nèi)容。本文主要介紹一種簡(jiǎn)潔的選項(xiàng)卡效果的實(shí)現(xiàn),兼容性較好,方便大家直接使用。

以下是引用片段:
<style type="text/css">
body {
 margin:0px;
 text-align:center;
 font-size:12px;
}
#divall {
 margin:auto;
 margin-top:35px;
 width:300px;
 height:200px;
 background-color:#7DA7D9;
 border:0px;
}
#title {
 width:300px;
 height:20px;
 font-size:14px;
 margin-top:4px;
}
#table1 table {
 width:300px;
 height:30px;
 font-size:12px;
}
#table2 table {
 width:300px;
 height:30px;
 font-size:12px;
}
#content1,#content2,#content3,#content4,#content5,#content6,#msg1,#msg2 {
 margin:auto;
 height:110px;
 width:290px;
 background-color:#eee;
 position:relative;
}
#content1 div,#content2 div,#content3 div,#content4 div,#content5 div,#content6 div {
 position:absolute;
 bottom:3px;
 right:3px; 

網(wǎng)頁名稱:網(wǎng)頁制作中分類的選項(xiàng)卡特效代碼
當(dāng)前鏈接:http://www.bm7419.com/news0/168150.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供微信小程序、移動(dòng)網(wǎng)站建設(shè)品牌網(wǎng)站建設(shè)、小程序開發(fā)、ChatGPT營銷型網(wǎng)站建設(shè)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

成都網(wǎng)頁設(shè)計(jì)公司