新的一年，新的开始！网页教学网与各位共勉！本文写给CSSer同仁——请不要做浮躁的人
不要被对象、属性、方法等词汇所迷惑；最根本的是先了解最基础知识；
不要放过任何一个看上去很简单的小问题--他们往往并不那么简单，或者可以引伸出很多知识点；不会举一反三你就永远学不会；
知道一点东西，并不能说明你会全部，需要经验积累；
看再多的书是学不全的，要多实践；
把时髦的技术挂在嘴边，还不如把过时的技术记在心里；
学习的最好方法之一就是多练习；
在任何时刻都不要认为自己手中的书已经足够了；
看得懂的书，请仔细看；看不懂的书，请硬着头皮看；
别指望看第一遍书就能记住和掌握什么——请看第二遍、第三遍……；
请把书上的例子亲手到电脑上实践，即使配套光盘中有源文件；
把在书中看到的有意义的例子扩充；并将其切实的运用到自己的工作中；
不要漏掉书中任何一个练习——请全部做完并记录下思路；
别心急，写代码确实不容易；水平是在不断的实践中 ......
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<TITLE>无刷新变换样式表</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<link href="jsfile/imagesa35/css1.css" rel="stylesheet" type="text/css" id="css">
</HEAD>
<script type="text/javascript">
function change(a){
var css=document.getElementById("css");
if (a==1)
css.setAttribute("href","jsfile/imagesa35/css1.css");
if (a==2)
css.setAttribute("href","jsfile/imagesa35/css2.css");
if (a==3)
css.setAttribute("href","jsfile/imagesa35/css3.css");
}
</script>
<BODY>
<div id="chs">
<a href="#" onClick="change(1)">使用样式表1</a>
<a href="#" onClick="change(2)">使用样式表2</a>
<a href="#" onClick= ......
1.position的absolute属性表示该块已经完全脱离文本流了。也就是不再占用空间位置
。完全靠top,button,right,left来进行定位。
这个必须能够完全理解。同时为减少错误在设置absolute后，一定至少指定top,buttom,right,left中的一个。
2.如果块设置了absolute属性，其定位的原点和父块的position有关。
如果父块设置有position属性则已父块确定原点，若父块无position属性则已窗口确定原点。 ......
一：css的概念
CSS是层叠样式表（Cascading Style Sheets）用来定义网页的现实效果。可以解决html代码对样式定义的重复，提高了后期样式代码的可维护性，并增强了网页的现实效果功能。简单一句话：CSS将网页内容和显示样式进行分离，提高了显示功能。
二：css的优点
样式表定义如何显示 HTML 元素，就像 HTML 3.2 的字体标签和颜色属性所起的作用那样。样式通常保存在外部的 .css 文件中。通过仅仅编辑一个简单的 CSS 文档，外部样式表使你有能力同时改变站点中所有页面的布局和外观。由于允许同时控制多重页面的样式和布局，你可以为每个 HTML 元素定义样式，并将之应用于你希望的任意多的页面中。如需进行全局的更新，只需简单地改变样式，然后网站中的所有元素均会自动地更新。
三：css和html的结合方式
1.style属性方式：
利用标签中style属性来改变每个标签的显示样式。
例：
<p style="background-color:#FF0000; color:#FFFFFF">
p标签段落内容。
</p>
该方式比较灵活，但是对于多个相同标签的同一样式定义比较麻烦，适合局部修改
&nbs ......
1.全部的代码均在一个DIV容器(我暂时这样称呼) Head里面,我们来看看Head的写法
#Head{
text-align:center;
}
为什么Head前面有一个"#"号呢?
而有的却是在前面加一个"．"比如 "．Head",有时候写css的时候干脆什么也不加,比如 td,body,他们有什么区别,具体怎么用,如果仔细你就会发现在HTML代码的DIV容器里面,有的是 <div id="Head"></div> 而有的是这样 <div class="HackBox"></div>
从id和class字面上的意思,我们也已经了解了,id具有唯一性,而class是一个类,适用于可多次重复使用的容器,而前面什么也不带的,便是 CSS里默认的通用于HTML代码的描叙,即对HTML里的代码起全局作用,比如 td,便是对HTML表格里面的全部列起作用,text-align:center是指在此容器里面的文字全部居中对齐,我们注意到,行后面还有一个分号 ";",
语法 text-align : left | right | center | justify
取值说明：
left : 默认值。左对齐
right : 右对齐
center : 居中对齐
justify : 两端对齐
2.HeadTop
#Head #HeadTop{
position:relative; ......
我们把它分为如下图所示块
具体的HTML,DIV+CSS排版样式为
我们一行一行分析,
1.全部的代码均在一个DIV容器(我暂时这样称呼) Head里面,我们来看看Head的写法
#Head{
text-align:center;
}
为什么Head前面有一个"#"号呢?
而有的却是在前面加一个"．"比如 "．Head",有时候写css的时候干脆什么也不加,比如 td,body,他们有什么区别,具体怎么用,如果仔细你就会发现在HTML代码的DIV容器里面,有的是 <div id="Head"></div> 而有的是这样 <div class="HackBox"></div>
从id和class字面上的意思,我们也已经了解了,id具有唯一性,而class是一个类,适用于可多次重复使用的容器,而前面什么也不带的,便是 CSS里默认的通用于HTML代码的描叙,即对HTML里的代码起全局作用,比如 td,便是对HTML表格里面的全部列起作用,text-align:center是指在此容器里面的文字全部居中对齐,我们注意到,行后面还有一个分号 ";",
语法 text-align : left | right | center | justify
取值说明：
left : 默认值。左对齐
right : 右对齐
center : 居中对齐
justify : 两端对齐
2.HeadTop
#Head #HeadTop{
position:rel ......
最新文章 : css