CSS

最近在學習CSS，做個小結，以便以後溫故而知新。一、CSS的出現帶來的好處：css最大的作用就是消除冗餘的樣式代碼。由於消除了冗餘樣式代碼，帶來下面幾點極大的好處：1、大大減少編碼工作量，不必再為每個標籤分別設定樣式。2、樣式代碼獨立，大大提高樣式代碼的可重用性3、實現集中控制、當需要修改代碼時，只修改一處即可，從而大大提高代碼可維護性。4、樣式代碼變少，代碼檔案就變小，從而減少傳輸到用戶端的檔案容量，節省網路流量、降低伺服器壓力，提高使用者瀏覽速度。二、css樣式的三種存在方式：1、外部樣式表

from http://veerle.duoh.com/blog/comments/a_css_styled_table/  Further to my article about the creation of a CSS calendar the thought crossed my mind to show you an example on how you can style a table using CSS. The data of tables can be boring so

一、html初步開發階段，必須先分析好整個網頁的內容結構：即，先總體的給網頁內容分類，比如nav content foot等等，每一類要有一個專門的div二、常用css標籤和屬性：   1、width：寬度，它的取值可以是：     (1)auto，寬度==父標籤的寬度     (2)xx%,當前標籤的寬度是父標籤的XX%     (3)px,定死標籤的大小     (4)inherit，繼承父標籤的值     注意：auto和100%的區別：auto取得的寬度為內容寬度+margin的寬度；1

圖解CSS的padding,margin,border屬性margin:邊緣，所以他在整體結構的最外邊border：邊界，什麼的的邊界？是margin和padding的邊界padding：填充，填充這個動作顯然是往裡填的動作，所以增加padding的值後，padding會向裡增大W3C組織建議把所有網頁上的對像都放在一個盒(box)中，設計師可以通過建立定義來控制這個盒的屬性，這些對像包括段落、列表、標題、圖片以及層。盒模型主要定義四個地區：內容(content)、邊框距(padding)、邊界

超連結的時候會使用到的：A:visited { COLOR: #414141; TEXT-DECORATION:none;}A:hover { COLOR: #ff0000; TEXT-DECORATION: none;}A:active { COLOR: #414141; TEXT-DECORATION: none;}A:link { COLOR: #414141; TEXT-DECORATION: none;}  固定寬度且置中：body{  margin: 0px 0px 0px 0px;

咱們這節主要講解CSS如何製作網頁中採用的菜單，其中包括項目列表、無需表格的菜單、菜單的橫豎裝換以及流行的Tab菜單。我們首先看項目列表：列表的符號；我們看看代碼：<html><head><title>項目列表</title><style><!--body{background-color:#c1daff;}ul{font-size:0.9em;color:#00458c;list-style-type:decimal;/*

一直都想寫一個CSS+DIV系列的文章，但是總想找個合適點時間，整理整理。再寫個系列，但是現在覺得什麼事都不要推，有些東西，能當天做完就當天做完，要不過了，你也許不想做了，或許有一種錯覺覺得意義就不大了，所以這個css+div控制網頁樣式與布局，我覺得我要是再不寫，過兩天就真寫不出來了。送大家一句話：當天能做完的事情，絕不留給第二天。我們從最基礎，一點點的深入，然後結合例子，慢慢分析，希望對大家有所協助。通常我們在學習CSS時，應該盡量的參照其他網站的編寫CSS。我們看看百度的：通過學習其他網站

表格和表單是網頁中非常重要的兩個元素，我們這次來說說CSS如何設定表格和表單樣式。我們先來看看CSS如何控製表格。首先表格中的標記：我們看一下代碼：<html><head><title>年度收入</title><style><!--table{caption-side:bottom;}--></style> </head><body> <table summary="This

在寫css代碼時

1、新的DOCTYPE和字元集HTML5的一項準則就是化繁為簡，Web頁面的DOCTYPE被極大的簡化。<!DOCTYPE html> 同時字元集聲明也被簡化了：<meta

非原創，來源網路。感謝原作者奉獻如此精彩文章。原文地址： http://bbs.blueidea.com/thread-2856346-1-1.html 容    器：container/box 頭    部：header 主 導 航：mainNav 子 導 航：subNav 頂 導 航：topNav 網站標誌：logo 大 廣 告：banner 頁面中部：mainBody 底    部：footer 菜    單：menu 菜單內容：menuContent 子 菜

通過背景實現的圓角效果方法:<html><head><title>CSS圓角效果</title><meta http-equiv="content-type" content="text/html; charset=gb2312"><style

<style>body { font:verdena; font-size:14px; color:#000 }h1{ font:verdena; font-size:22px; color:#000 }h2{ font:verdena; font-size:15px; color:#000; text-align:left }div#main { margin:30 }/*關鍵代碼開始*/a.info { position:relative; z-index:0;

 轉自部落格園ylm's space div+css構建模板技巧收藏 因為firefox和ie在構造box的時候，有一定偏差主要體現在border以及padding首先是border:如果你的box構造為：寬100,高100,邊框1如果在ie內觀看，應該大小是100*100因為border在內但是firefox觀看卻是102*102border在外解決方案是用!important設定兩個寬度，一個給ie讀，一個給firefox比如：width:98px

CSS，主要用來顯示，和HTML分開，可以更好的顯示，HTML負責結構；CSS負責顯示，各司其職。使用法1：選擇符{屬性：屬性值} <head標籤內><style> <!-- div{width:200; filter:blur(add=true,direction=135,strengh=20); } 　--> </style>這樣，出現div的地方，都是這種顯示.法2：<body內><p style="font-size:48

1. 集合類對象問題 現有代碼中許多集合類對象取用時使用 ()，IE 能接受，Firefox 不能。 解決方案：改用 [] 作為下標運算。如：document.forms("formName") 改為 Js代碼

網頁切圖過程中div+css命名規則　　內容：content/container 導航：nav 側欄：sidebar 　 　　　欄目：column 標誌：logo 頁面主體：main 　　　　廣告：banner 熱點：hot 新聞：news　　下載：download 子導航：subnav 菜單：menu　　搜尋：search 頁尾：footer 滾動：scroll　　著作權：copyright 友情連結：friendlink 子功能表：submenu　　內容：content 標籤頁：tab

demo.html<html><head><title>這是個css體驗例子</title><!--引入CSS--><link rel = "stylesheet" type = "text/css" href = "my.css"/></head><div class = "style"><img src =

 common selector(通用選擇子)    element/type selector:      p,h1,a{color:#444; padding:3px;}    Descendant selectors(後代選擇子)   li a{color:#444; } 此樣式只對 li下的 a 有效。這兩種表示方法一般是對整個頁面中的元素設定樣式。    對於只設定部分樣式的情況用class和id，class可以被任意多的元素使用，而id一般只針對某一個元素，整個頁面唯一。   ID

最近看了很多頁面最佳化方面的文章，集合多篇文章，整理總結如下：1、樣式放頭上，指令碼放腳下。不內嵌，只外鏈。使用 引用樣式表，而不是通過 @import 匯入。 * 不贊成：<p style=”font-size: 14pt ;”>Home</p>* 建議用：<link href="style.css" rel="stylesheet"