::^喬喬^::明鏡臺::原創空間::C#.NET2.0,C++技術BLOG
人最重要的是心境,一顆平靜安穩的心才能更好的進步,保持自己的心態.成為夢想中的高手QQ群:8664695
首頁
新隨筆
新文章
聯系
聚合
管理
posts - 17,comments - 32,trackbacks - 0
<
2015年12月
>
日
一
二
三
四
五
六
29
30
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
1
2
3
4
5
6
7
8
9
努力地去完善自己,堅持每天學習編程10小時,5年就18250個小時,也就是說起碼要5年我才能成為大蝦.......
常用鏈接
我的隨筆
我的評論
我參與的隨筆
留言簿
(6)
給我留言
查看公開留言
查看私人留言
隨筆分類
(18)
c#(8)
c++(2)
CSS+DIV(1)
IDE系列(1)
Jquery學習筆記(2)
Lua學習筆記(4)
隨筆檔案
(17)
2009年7月 (2)
2009年6月 (4)
2009年5月 (11)
文章檔案
(3)
2009年5月 (1)
2008年8月 (1)
2008年7月 (1)
收藏夾
(2)
C++朋友(2)
最新隨筆
1.?Oxite解讀 ----- (1) ------- 概述
2.?如何學習編程
3.?ADO.NET Entity Framework 隨筆
4.?面向對象---繼承
5.?面試雜錦
6.?Jquery學習筆記(二)---- 強大的選擇器
7.?Jquery學習筆記(一)---- 前言
8.?CSS+DIV布局心得
9.?Microsoft Visual Studio 心情記錄
10.?lua學習之入門(三)----函數
搜索
積分與排名
積分 - 51594
排名 - 444
最新隨筆
1.?Oxite解讀 ----- (1) ------- 概述
2.?如何學習編程
3.?ADO.NET Entity Framework 隨筆
4.?面向對象---繼承
5.?面試雜錦
6.?Jquery學習筆記(二)---- 強大的選擇器
7.?Jquery學習筆記(一)---- 前言
8.?CSS+DIV布局心得
9.?Microsoft Visual Studio 心情記錄
10.?lua學習之入門(三)----函數
最新評論
1.?re: lua學習之入門(二)----基礎語法1
高中如何學習?
--峰,少白
2.?re: lua學習之入門(一)----環境搭建
路漫漫其修遠兮,吾將上下而求索。。。。。
--梁喬峰
3.?re: lua學習之入門(一)----環境搭建
@梁喬峰
--梁喬峰
4.?re: Boost 多線程源代碼解讀
我對此表示很暈
--crax
5.?re: 自定義審核流程(一)[未登錄]
321
--123
閱讀排行榜
1.?lua學習之入門(二)----基礎語法2(8693)
2.?lua學習之入門(二)----基礎語法1(4700)
3.?lua學習之入門(一)----環境搭建(4203)
4.?自定義審核流程(一)(3162)
5.?Oxite解讀 ----- (1) ------- 概述(3087)
CSS+DIV布局心得
CSS+DIV布局
已經變成白菜一樣了,到處都是CSS+DIV布局,去面試一個做網頁的公司,肯定會問,你會CSS+DIV布局不。到底啥是CSS+DIV布局呢?傳統上都是以用TABLE布局的,TABLE布局的要點是有兩個,第一:適當的地方合并行和列,第二:懂TABLE嵌套Table。
而且還可以直接在頁面上控制Table的高度長度。TABLE布局最大的缺點,除了沉長的TR,TD之外,言論最多的就是SEO里對Table布局的鄙視。大部分SEO人都會覺得Table布局不利于SEO優化。這點。。到真是有點關系,我試過兩個完全一樣的網站,一個是用Table布局的,我是用CSS+DIV布局的,并適當的使用了H標記,在GOOGLE搜索上,我CSS+div布局的網站要比Table布局的要靠前。。。至于為什么,那個不是本文的重點。。忽略掉。
??
CSS+DIV布局
最大的特點就是HTML文件里的代碼相對比較少,但是也造成了瀏覽器布局問題。。網上很多人都在說,我布局在IE里顯示正常,在FF下全部變形了。其實造成這樣問題的原因是你寫的CSS并不標準,可以說你寫的CSS都是根絕IE的標準來寫的,而不是CSS2.0的國際標準,無論是IE還是FF(3.0版前的我沒留意)都是支持CSS2.0的,但是在技術上,IE有寫模糊功能,可以令到非標準的CSS布局也能正確解析,一下是我寫CSS代碼的五個習慣,我不敢說我這五個習慣都是好習慣,至少我寫的CSS布局不會產生不良效果,也就是我寫的CSS有跨l瀏覽器能力。
第一:容器類DIV必須要有5個東西{margin,padding,width,height,overflow},什么叫容器類,就是這個DIV只是用來放內部的DIV的,也可以說是一個定位的div..例如:我們經常使用居中,一般是這樣做的
body
{
}
{
????font-size
:
?12px
;
????margin
:
?0px
;
????padding
:
?0px
;
????height
:
?100%
;
????????width
:
?100%
;
????overflow
:
?auto
;
????text-align
:
?center
;
????display
:
?block
;
}
/**/
/*
---body我是作為最頂層容器的---所以它具備了我需要的所有東西,實現的效果是居中,我加上了display:?block;雖然這個是一個默認屬性,但是我們不能保證所有瀏覽器都是默認,(如果是所有瀏覽器都默認的,我自己寫個瀏覽器的默認為none的給你耍)
*/
#body_Div
{
}
{
????margin
:
?0px?auto
;
????padding
:
?0px
;
????text-align
:
?left
;
????width
:
?1003px
;
????height
:
100%
;
????overflow
:
auto
;
}
/**/
/*
這個是核心層,多有的元素基本都是在這個層里的,這個層也具備了我想要的屬性,text-align:?left;?因為在上層我把文本對齊成為居中,所以這個層我要把它還原為左對齊margin:?0px?auto;?一般IE的CSS編寫者不會有這個auto值的,在IE會自動,但是在FF如果少了auto你將會發現FF里你的核心部分不是居中的。所以要做到通用,我們就必須要加上auto值,IE也支持auto值
*/
第二:浮動對象,都擁有獨立的父DIV;關于這點。。有意見的人可能不少,持有的觀點就是,“你這樣做只會令DIV過分的多,過于復雜”,其實,我也不想這樣做,但是- -!IE對于浮動對象的{margin,padding}存在BUG所以為了減少一切可能的出錯,我唯有多花費一點代碼,說實在的我只是想它更健康。這個父DIV主要作用其實就是令到內部浮動對象更可控制,這個父DIV就是一個單純的容器DIV
第三:所有的浮動都需要閉合;這個有經驗的人都知道。。用完浮動你肯定需要把它閉合掉的,不閉合,可能不同瀏覽器在解析的時候會把你的浮動變成向下默認,(可以這樣解析:就是元素內部的子元素都默認具有浮動屬性)
第四:一個行向浮動如果超過3個那么請使用UL來實現浮動
第五:靈活使用類選擇,我個人的做法是,所有的id選擇器都是用于布局的,類選擇器都是用于呈現效果的,這樣做的好處就是,當你想要的效果出現問題的時候,更快速地找到錯誤。這個是我有意識的把“架構”和“內容”分離。
明鏡臺
posted on 2009-05-25 14:22
^喬喬^
閱讀(2077)
評論(0)
編輯
收藏
引用
所屬分類:
CSS+DIV
只有注冊用戶
登錄
后才能發表評論。
【推薦】100%開源!大型工業跨平臺軟件C++源碼提供,建模,組態!
網站導航:
博客園
IT新聞
BlogJava
博問
Chat2DB
管理
Copyright ©2025 ^喬喬^ Powered By
博客園
模板提供:
滬江博客
久久久久亚洲av无码专区
|
天天综合久久久网
|
久久综合亚洲色HEZYO社区
|
日日狠狠久久偷偷色综合96蜜桃
|
久久香蕉国产线看观看猫咪?v
|
午夜精品久久影院蜜桃
|
精品永久久福利一区二区
|
99精品久久久久久久婷婷
|
久久久久久国产a免费观看黄色大片
|
久久久久99精品成人片三人毛片
|
99精品久久久久久久婷婷
|
亚洲国产综合久久天堂
|
久久香蕉国产线看观看精品yw
|
久久综合狠狠综合久久激情
|
国产成人精品久久二区二区
|
久久精品国产精品亜洲毛片
|
精品久久久久久无码中文字幕一区
|
99久久综合国产精品二区
|
精品久久久久成人码免费动漫
|
中文字幕久久波多野结衣av
|
国产呻吟久久久久久久92
|
午夜人妻久久久久久久久
|
久久精品国产福利国产琪琪
|
国产情侣久久久久aⅴ免费
|
精品国产日韩久久亚洲
|
三级韩国一区久久二区综合
|
青青热久久综合网伊人
|
国产精品一久久香蕉国产线看观看
|
国产精品成人久久久
|
四虎影视久久久免费观看
|
国产99久久九九精品无码
|
精品久久久久久国产91
|
久久er99热精品一区二区
|
亚洲午夜久久久久妓女影院
|
久久99热只有频精品8
|
中文字幕久久精品无码
|
久久久久精品国产亚洲AV无码
|
久久精品极品盛宴观看
|
日产精品久久久久久久
|
久久久无码精品亚洲日韩京东传媒
|
久久青青草原综合伊人
|