一、前端設計面臨的最大問題
1、瀏覽器不相容
html5特效在ie8及以下版本不顯示，排版錯位
2、分辯率不同
排版錯位
二、瀏覽器不相容解決辦法
1、針對不同瀏覽器加**
除ie外都可識別
所有的ie可識別
僅ie6可識別
ie6以及ie6以下版本可識別
ie6以及ie6以上版本可識別
僅ie7可識別
ie7以及ie7以下版本可識別
ie7以及ie7以上版本可識別
例：如何讓 ie9及其以下版本瀏覽器識別html5標識及特效
透明層ie8css**：
background-color:#053361;opacity:1;filter:alpha(opacity=85);
透明層html5**：
background: rgba(255,255,255,0.8);
1、網頁頭、網頁主體、網頁腳放在乙個層或**中，並且居中，最外層寬度為100%。
下面的布局可以用div,也可以用table
網頁內容
網頁內容
2、盡量不用絕對定位，用相對定位。
3、針對不同分辯率用不同的css樣式
高分辯率下字型、加大
@media screen and (判斷屬性)
css**示例：
.abc
@media screen and (min-width: 1201px)
}/* css注釋：設定了瀏覽器寬度不小於1201px時 abc 顯示1200px寬度 */
@media screen and (max-width: 1200px)
}/* 設定了瀏覽器寬度不大於1200px時 abc 顯示900px寬度 */
@media screen and (max-width: 901px)
}/* 設定了瀏覽器寬度不大於901px時 abc 顯示200px寬度 */
@media screen and (max-width: 500px)
}/* 設定了瀏覽器寬度不大於500px時 abc 顯示100px寬度 */
需要注意是css**順序，由大到小排版css（判斷瀏覽器寬度越大越放前），這樣是因為邏輯關係，@media 判斷css排錯將導致判斷失效。
前端SEO技巧
文章出處 前幾天在慕課網上學習了 seo在網頁製作中的應用 覺得挺好 挺有用的，今天，特此做了乙個小小的筆記，也算是對學習過後的乙個總結。一 搜尋引擎工作原理 二 seo簡介三 前端seo 1 結構布局優化 盡量簡單 開門見山，提倡扁平化結構。2 網頁 優化 第一行文字內容 第二行文字內容 第三行文...
前端常用技巧
1.擷取字串,從第一位開始,擷取6位 provider name val substr 0,6 2.許可權設定 3.通過尋找父級取值 向上尋找找到class detailshearid的父級的id obj closest detailshearid parents attr id 4.live動態註...
前端小技巧
1 形成如下效果 文字居於框中 一般給span標籤加框框，會比較貼合緊密，不好看 font size 1.3rem border 1px solid 337ab7 padding 0 10px height 20px line height 20px 加完之後行高與高度一樣 框就會高一點，如果單憑想...