韩顺平html+css+javascript-----div+css笔记资源-CSDN下载

需积分: 9 129 浏览量 2012-12-07 21:50:51 上传评论 1 收藏 1.02MB DOCX 举报

韩顺平HTML+CSS+JavaScript笔记 - DIV+CSS详解本笔记主要介绍了DIV+CSS的基本概念和应用，涵盖了DIV的介绍、CSS的基本语法、CSS的分类、使用CSS统一网站风格、使用滤镜等内容。 DIV+CSS是什么？ ---------------- DIV是HTML中的一个元素，用于存放HTML元素、文字、图片、视频等内容。CSS是层叠样式表，用于指定DIV中的内容样式。 DIV+CSS的快速体验 ------------------- 以下是一个简单的DIV+CSS示例： ```html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>DIV+CSS入门案例</title> <link href="my.css" type="text/css" rel="stylesheet"/> </head> <body> <div class="style1"> <table> <tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> </tr> </table> </div> </body> </html> ``` 在上面的代码中，我们使用了一个DIV元素，并将其class设置为"style1"。然后，我们在my.css文件中定义了style1的样式： ```css .style1{ width:300px; height:200px; border:1px solid red; margin:100px 0px 0px 200px; } .style1 table{ border:1px solid black; width:298px; height:190px; } .style1 table td{ border: 1px solid black; text-align:center; } ``` CSS的基本语法 ---------------- CSS的基本语法是通过选择器、属性和值来定义样式的。例如： ```css 元素名 { 属性名：属性值；属性名：属性值2； } ``` 使用CSS可以统一网站的风格 ------------------------- CSS可以将网站的风格统一起来，使得网站的布局和样式更加一致。例如，我们可以使用CSS来定义网站的字体、颜色、布局等样式。 CSS的分类 ------------- CSS可以分为内部CSS和外部CSS。内部CSS是写在HTML文件中的CSS代码，而外部CSS是写在独立的CSS文件中的CSS代码。使用滤镜 --------- CSS也可以使用滤镜来实现一些特殊的效果，例如将图片变成黑白色： ```css img { filter:gray; } ``` 本笔记涵盖了DIV+CSS的基本概念和应用，包括DIV的介绍、CSS的基本语法、CSS的分类、使用CSS统一网站风格、使用滤镜等内容。

资源推荐

资源详情

资源评论