auyeung_anne的专栏

欢迎大家学习《十天学会web标准》，也就是我们常说的DIV+CSS。不过这里的DIV+CSS是一种错误的叫法，建议大家还是称之为web标准。学习本系列教程需有一定html和css基础，也就是指您之前做过网页，会用表格布局。如果您刚开始学习网页制作，不知道什么是表格布局及html和css，建议您先去充电，否则学习本教程会非常吃力或者根本就听不懂。由于时间关系，本教程只讲解一些基础知识，让您从

我们首先要了解，所有的html元素，都要么是block(块元素)、要么是inline(内联元素)。下面了解一下block、inline各自的特点：　　block元素的特点：　　总是在新行上开始；　　高度，行高以及顶和底边距都可控制；　　宽度缺省是它的容器的100%，除非设定一个宽度。　　inline元素的特点： 　　和其他元素都在一行上；　　高，行高及顶和底边距不可改变

当一行文字超过DIV或者Table的宽度的时候，浏览器中默认是让它换行显示的，如果我们不想让他换行显示那要怎么办呢？看到这个标题很容易就会想到截断文字加“...”的做法。一般的文字截断(适用于内联与块)：==============CSS================ .text-overflow{display:block;/*内联对象需加*/width:31e

Untitled Page          body  {    background: #b6b7bc;    font-size: .80em;    font-family: "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;    mar

前几天做网站使用到二级菜单，想也没想就在网上当了几个，不过大多都不太满意，只有《CSS二级菜单》看上去似乎好一点，就使用了那个。]但在《CSS二级菜单》中，如果一级菜单中的超链接是#，那么只要单击该一级菜单，那么与这个一级菜单对应的二级菜单就会一直显示在网页中，不能隐藏，是一个小小的bug。后来仔细的想了一想，其实，无论是什么样的二级菜单，原理都是一样的： 1、每一个一

今天我们开始学习《十天学会web标准(div+css)》的下拉及多级弹出菜单，包含以下内容和知识点：带下拉子菜单的导航菜单 绝对定位和浮动的区别和运用 css自适应宽度滑动门菜单 一、带下拉子菜单的导航菜单下拉菜单在一些企业网站应用尤为广泛，它存在使用方便，占用空间小等特点。之前纵向导航教程中已使用过二级导航，今天制作下横向导航菜单的二级菜单，方法和纵向一样，只不过由纵向改变为

第三天 二列和三列布局　　今天学习《十天学会web标准(div+css)》的二列和三列布局，将涉及到以下内容和知识点二列自适应宽度 二列固定宽度 二列固定宽度居中 xhtml的块级元素(div)和内联元素(span)float属性 三列自适应宽度 三列固定宽度 三列固定宽度居中 IE6的3像素bug 　一、两列自适应宽度　　下面以常见的左列固定右列自适应为例，因为div为块

有了上边的基础，下面的任务就是要利用html和css制作完成一个完整的网页了。先从头部开始，第三小节时我们已经把整体框架给搭建好了，就像盖房子一样，整体结构已经出来了，下面就需要填砖分割空间了。先分析下头部：分为两部分，一个是logo靠左侧显示，一个是搜索靠右侧显示，那么布局时插入两个div，一个向左浮动，一个向右浮动的方式来完成。另外还有很多种实现方法，比如logo用h1标签，搜索用span，或

今天我们开始学习《十天学会web标准(div+css)》的css表单设计，包含以下内容和知识点：■改变文本框和文本域样式■用图片美化按钮■改变下拉列表样式■用label标签提升用户体验一、改变文本框和文本域样式如果前边几章学习的比较扎实的话，本节教程就相当容易了。下边先说一下文本框，文本框和文本域都是可以用css进行美化的。比如改变边框精细，颜色，添加背景色、背景图像等。请

1、(盒子)布局排版类float - 浮动：设置块元素的浮动效果。可选常用到参数left、right ；width - 宽：确定盒子本身的宽度，可以使盒子的宽度不依靠它所包含的内容多少。height - 高 ：确定盒子本身的高度；clear - 清除 ：用于清除设置的浮动效果，常用参数both 、left、right；margin - 边距：控制围绕边框　的边距大小。其中包含4

今天我们开始学习《十天学会web标准(div+css)》的html列表，包含以下内容和知识点：　　1、横向列表菜单　　2、用图片美化的横向导航　　3、CSS Sprites　　一、横向列表菜单　　前边学习过纵向导航菜单，又学习了float属性，那么要实现横向导航菜单是不是很简单了，只需要把li横向排列就可实现了。把第四节的代码拿过来直接用，修改后的代码如下：

《十天学会web标准(div+css)》之第六天：html列表　　今天我们开始学习《十天学会web标准(div+css)》的html列表，包含以下内容和知识点：　　1、ul无序和ol有序列表　　2、改变项目符号样式或用图片定义项目符号　　3、横向图文列表　　4、浮动后父容器高度自适应　　5、IE6的双倍边距bug　　一、ul无序和ol有序列表

《十天学会web标准(div+css)》之第五天：超链接伪类　　今天我们开始学习《十天学会web标准(div+css)》超链接伪类，包含以下内容和知识点：　　1、链接的四种样式　　2、将链接转换为块状　　3、用css制作按钮　　4、首字下沉　　一、超链接的四种样式　　本来计划这节课放到第九章中讲解，但下边的章节都涉及到了，所以提前来学习一下，

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml" >    无标题页                                     body { font-family: Verdana; font-size: 12px; line-heig

一、纵向列表纵向列表或称为纵向导航，在网站的产品列表中应用比较广泛，如淘宝网左侧的淘宝服务，今天我们就学习一下纵向导航的制作先新建一个页面，然后插入一个ID为menu的div，然后在设计视图中选中文字，点击工具栏的ul图标，即会自动插入ul和li，然后修改文字内容为你需要的内容。"menu">首页网页版式布局div+css教程div+css实例

网页设计中常用布局方式布局设计有：DIV+CSS和table两种布局方式,框架。DIV+CSS布局div高效先进，科学，但难学，兼容性不及table布局。表格布局兼容性较好，基本不要考虑浏览器兼容问题，但是一些高级效果，表格是无法做出的，表格布局的代码偏长，简单说就是：低效、稳定、控制难度低。框架适用于后台管理界面，一般顶部或左侧是功能菜单，右侧是内容显示页面，框架不灵活，用的也比