| 网站首页 | 模板 | 资料 | 源码 | 工具 | 开发 | 设计 | 安全 | 项目 | 网络 | 图片 | 系统 | 数据库 | 博客 | 会员中心 | 小说 | 
MYFTP 精品资料下载
网络学院
学习资料
源码模版
您现在的位置: 精品下载 >> 开发 >> 网站开发 >> CSS技术 >> 文章正文 用户登录 新用户注册
使用CSS的基础实例            【字体:
使用CSS的基础实例
作者:佚名    文章来源:不详    点击数:    更新时间:2007-12-18

  我们现在设计网页都要使用CSS了,今天在这个教程中给大家以实例的形式教给大家如何使用CSS,通过四个例子来说明CSS的使用!通过这个教程中的四个实例让大家理解在HTML中加入CSS之后,CSS在什么时候起作用?以及不加CSS会如何显示。激起你学习CSS的兴趣。

  首先我们先建立一个CSS文件,打开我们的记事本,然后输入下面的内容:

  p
  {
    color: #ff0000;
    background: transparent;
  }

  然后保存为style1.css(在这个CSS文件中我们定义p标签的的风格为红色、背景透明)

  实例1:把下列文件保存为.htm文件,注意要和style1.css保存在同一目录中。

  <html>
  <head>
    <title>网页教学网实例教程1</title>
    <link href="style1.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
      p
      {
        color:#00ff00;
        background:transparent;
      }
    </style>
  </head>
  <body>
    <p style="color:#0000ff;background:transparent;">兰色文本显示  </p>
  </body>
  </html>

  实例2:

  <html>
  <head>
    <title>网页教学网CSS实例2</title>
    <link href="style1.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
      p
      {
        color:#00ff00;
        background:transparent;
      }
    </style>
  </head>
  <body>
    <p>绿色文本显示</p>
  </body>
  </html>

  实例3:

  <html>
  <head>
    <title>网页教学网CSS实例3</title>
    <link href="style1.css" rel="stylesheet" type="text/css" />
  </head>
  <body>
    <p>红色文本显示</p>
  </body>
  </html>

  实例4:

  <html>
  <head>
    <title>网页教学网CSS实例4</title>
  </head>
  <body>
    <p>默认的浏览器显示的文本</p>
  </body>
  </html>

  通过以上四个实例大家理解CSS的定义,在什么地方起作用等问题。

文章录入:chqnet    责任编辑:chqnet 
  • 上一篇文章:

  • 下一篇文章:
  • 最新热点 最新推荐 相关文章
    点击单选框就直接激活链接的
    CSS让网页中的内容自动换行的
    用css实现文字的自动隐藏
    在CSS样式表里使用JavaScrip
    CSS实现导航条图片的翻转菜单
    CSS样式表:链接好还是嵌入好
    CSS自动实现网页打印版本
    使用html表格和CSS进行混合网
    常用CSS缩写语法总结
    认清CSS的类class和标识id选
      网友评论:(只显示最新10条。评论内容只代表网友观点,与本站立场无关!)