首頁 > web前端 > js教程 > 主體

基於jquery DOM寫的類似微博發布的效果_jquery

WBOY
發布: 2016-05-16 17:48:55
原創
1199 人瀏覽過
複製代碼代碼如下:





微博發布jq版




/* 重置{*/
html{color:#000;background:#fff;}
body,div,ul,li ,h1,input,button,textarea{padding:0;margin :0;}
img{border:0;}
li{list-style:none;}
/*} 重設*/
h1{margin:20px auto 0;font-size :30px;寬度:200px;文字對齊:中心;顏色:藍色;}
#outer{位置:相對;寬度:400px;邊距:自動;邊距:20px 自動10px;}
#test1{顯示:block;寬度:400px;高度:70px;}
.error{背景:#f00;寬度:400px;高度:50px;位置:絕對;左:1px;頂部:10px;不透明度:0.6;過濾器:alpha (不透明度=60);}
#test2{顯示:塊;margin-left:800px;寬度:60px;高度:30px;字體大小:20px;}
.test3{margin:10px auto;寬度:400px;}
#test3{邊框:1px #444 實體;寬度:400px;最小高度:300px;_height:300px; bottom:10px;顏色:藍色;浮動:左;}
.測試{border-bottom:1px藍色虛線;寬度:383px;padding:10px 5px 5px 10px;float:left;}
.inf {margin-top:15px;float:right;color:#555;}
.con{margin-left:16px;display:inline;width:304px;float:left;word-break:break-all;}break:break-all;}
.bu{margin-left:6px;display:inline;}
.imgs{寬度:60px;高度:60px;浮動:左;}
.imgInf{寬度:120px;背景:#f0f ;顏色:#fff;位置:絕對;z-index:2;左:- 65px;頂部:62px;不透明度:0.5;過濾器:alpha(不透明度=50);}
.finish{背景:綠色;寬度:300px;高度:50px;顏色:#ff0;字體大小:30px;文字-align:center;line-height:50px;position:absolute;left:50px;top:10px;opacity:0.6;filter: alpha(opacity=60);}
.imgOut{position:relative;}

樣式>
頭>

微博發佈










腳本>
身體>


相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!