CSS的存在就是将网页的内容与内容展示的方式进行了分离。

使用CSS的方式有好几种,最常用的是通过引入外部CSS文件进行使用

HTML

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>链接外部CSS样式</title>
<link href="00_CSS使用示例.css" rel="stylesheet" type="text/css" />
</head>
<body>
<table>
<tr>
<td>疯狂Java讲义</td>
</tr>
<tr>
<td>轻量级Java EE企业开发实战</td>
</tr>
<tr>
<td>疯狂Ajax讲义</td>
</tr>
</table>
</body>
</html>

CSS

/* 设置整个表格的背景色 */
table {
background-color: #003366;
width: 400px;
}
/* 设置单元格的背景色、字体等*/
td {
background-color: #fff;
font-family: "楷体_GB2312";
font-size: 20pt;
text-shadow: -8px 6px 2px #333;
}

其他使用CSS样式表的方法

导入外部样式表

<style type="text/css">

  @import "outer.css";

  @import url("mycss.css");

</style>

使用内部样式

<style type="text/css">

   样式定义

</style>

使用内联样式

style="

  样式定义

"

CSS小结

CSS的学习其实就两块内容,1 选择器 2 样式设置

其他都是都如何设置样式,设置成什么样式进行使用

CSS使用示例的更多相关文章

  1. CSS初始化示例代码

    CSS初始化示例代码 /* css reset www.admin10000.com */ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code, ...

  2. JavaScript动态加载资源【js|css】示例代码

    在开发过程中会用到各种第三方的插件,或者自己写在单独文件中的js方法库或者css样式,在html头部总是需要写一大堆的script和link标签,如果想要自己实现动态的引入资源文件,可以使用开源的re ...

  3. css基础示例代码

    选择器 引入方式 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  4. 常用的CSS样式示例代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. CSS代码示例-背景属性(background)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. (转)雅虎工程师提供的css初始化示例代码

    body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,b ...

  7. 04.CSS动画示例-->烟花

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. 02.CSS动画示例-->鼠标悬停图片旋转

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. 雅虎工程师提供的CSS初始化示例代码

    body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,b ...

随机推荐

  1. SpringBoot学习10:springboot整合mybatis

    需求:通过使用 SpringBoot+SpringMVC+MyBatis 整合实现一个对数据库中的 t_user 表的 CRUD 的操作 1.创建maven项目,添加项目所需依赖 <!--spr ...

  2. Decrypt.java

    import java.io.PrintStream;import weblogic.security.internal.*;import weblogic.security.internal.enc ...

  3. Problem 1002-2017 ACM/ICPC Asia Regional Shenyang Online

    网络赛:2017 ACM/ICPC Asia Regional Shenyang Online 题目来源:cable cable cable Problem Description: Connecti ...

  4. nodejs 发送邮件(阿里云)

    1.下载  模块 2.  编辑文件 var nodemailer = require('nodemailer'); var sendEmail = function(emailinfo,callbac ...

  5. Java web--过滤器

    本文引自:https://www.cnblogs.com/dudududu/p/8505177.html 参考博客:http://www.cnblogs.com/coderland/p/5902878 ...

  6. 前端性能优化JavaScript篇

    关于前端性能优化的讨论一直都很多,包罗的知识也很多,可以说性能优化只有更好,没有最好.前面我写了一篇关于css优化的总结文章,今天再从javascript方面聊一聊. 1.从资源加载方面来说,浏览器的 ...

  7. array_unique() - 去除数组中重复的元素值

      array_unique() 定义和用法 array_unique() 函数移除数组中的重复的值,并返回结果数组. 当几个数组元素的值相等时,只保留第一个元素,其他的元素被删除. 返回的数组中键名 ...

  8. 在ubuntu上安装subline

    Sublime Text is a most popular, lightweight and smart cross-platform text and source code editor wit ...

  9. 判断移动端和pc端最简单的方法

    <!DOCTYPE html><html><head> <title></title> <script type="text ...

  10. VIM安装YCM插件

    折腾了两天,终于好了 1.配置VIM (1)下载相关插件 sudo apt-get install git sudo apt-get install build-essential cmake sud ...