人人IT網

人人IT網

當前位置: 主頁 > JAVA編程 > ANT >

Web前端學習小建議

時間:2016-12-03 12:01來源:Internet 作者:Internet 點擊:
這裏给大家分享一些css小技巧: 1、使用reset.css 火狐和IE這兩種不同的瀏覽器,在繪制CSS样式方法上截然不同。這種情況下,使用reset.css重置所有的基本样式會讓你得到一個全新的空
這裏给大家分享一些css小技巧:

1、使用reset.css
火狐和IE這兩種不同的瀏覽器,在繪制CSS样式方法上截然不同。這種情況下,使用reset.css重置所有的基本样式會讓你得到一個全新的空样式表。(可以去網上找一下,很多的)

2、CSS縮寫
CSS縮寫簡化了你的CSS代碼,更重要的是,它讓你的代碼更加整潔易懂。
不是像這样創建CSS
.header {
  background-color: #fff;
  background-image: url(image.gif);
  background-repeat: no-repeat;
  background-position: top left;

}

而是像這样創建CSS

.header {
  background: #fff url(image.gif) no-repeat top left
}
3、理解class和id
這兩個選擇器總是讓初學者感到迷惑。在CSS中,Class和ID分別用點“.”和井號“#”來標識。簡單來說id就是用來標識那些單獨不重复的样式,而class是可以重复使用的。

4、實用的<li>
< li>也叫鏈接列表,在與<ol>或<ul>正確搭配的時候非常好用,尤其是用在導航菜單样式上。

5、少用<table>多用<div>
CSS最大的優勢之一是使用<div>達到样式上的靈活多變。不同於<table>,<div>裏的內容不會 被锁在單元格<td>中。可以說幾乎所有的表格布局都可以在<div>和样式的正確使用下完成。當然,有大量表格內容時,還是用 <table>吧。

6、CSS調試工具
在設計CSS時,能夠得到頁面布局的預覽對於優化CSS样式和糾錯是很有幫助的。這裏有一些免費的CSS調試工具推薦给你,你可以把它裝在瀏覽器上:比如FireFox Web Developer、DOM Inspector、Firebug等


7、!Important
所有被!important 標記的样式,即使它後來被重寫,瀏覽器也只會采用被標記的那條。


比如上面的例子,因为background-color:blue 被標記为!important ,即使後來有把背景改成紅色的語句,也只采用被標記的那條。!important 用來強制使一個样式避免在之後的編碼中被修改,遺憾的是IE不支持。

牢記以上小技巧,也許你的css技能突然就起飛了呢?關於javascript的一些小技巧,下次我再整理给大家~一次性看太多,大家是不是也有點暈?

學習前端需要方法,更需要一顆平常心,不要把前端想的多難,需要吃什麼苦。。。既然學習這麼痛苦,为什麼不快樂一點學呢?anyway~希望大家可以成为一個優秀的前端er!

交流群103791667
From:ITEYE
頂一下
(0)
0%
踩一下
(0)
0%
------分隔線----------------------------
發表評論
請自覺遵守互聯網相關的政策法規,嚴禁發布色情、暴力、反動的言論。
評價:
表情:
驗證碼:點擊我更換圖片
欄目列表
推薦內容