首 页 ┆ 源码下载 ┆ IT学院 ┆ 字体下载 ┆ 模板下载 ┆ 源码发布 ┆ 广告合作 ┆ 网站地图 ┆ 虚拟主机 ┆ 中文域名
► 设为首页
► 加入收藏
► 联系我们
源码下载 >> ASP源码 | PHP源码 | ASP.net源码 | JSP源码 | CGI源码 | VC/C++源码 | VB源码 | Delphi源码 | Flash源码
文章学院 >> 网络编程 | 网页设计 | 图形图象 | 数据库 | 服务器 | 网络媒体 | 网络安全 | 操作系统 | 办公软件 | 软件开发 | 黑客知识
字体下载 >> 精制字体 | 非英字体 | 艺术字体 | 著名字体 | 哥特式 | 简单字体 | 手写体 | 节假日 | 图案字体 | 精度像素 | 中文字体
模板下载 >> 企业门户 | 数码网络 | 休闲娱乐 | 影视音乐 | 旅游名胜 | 文化艺术 | 电子商务 | 个性展示 | 登陆导航 | Flash模板
►►您当前的位置:源码园 → IT学院 → 网页设计 → Html/Css → 文章内容

学习网页技术CSS应用在特定场合的规则

作者:佚名  来源:网上收集  发布时间:2007-5-22 2:33:58

  At-rules分装不同的CSS规则,应用在特定场合。

  Importing

  import@规则引用另外的样式。例如,如果你想添加另外样式到现在的样式,可以这样:
  @import url(addonstyles.css);
  这很像使用link元素连接CSS到HTML,本质上说有一个内容样式像下面:
  <style type="text/css" media="all">@import url(monkey.css);</style>
  这是为了照顾老版本浏览器,比如Netscape4不支持@规则所以不能链接样式表,已经构建好标签的HTML页面会失去样式表提供的功能。

  Media types

  media@规则应用内容使用特定媒体,比如打印,例如:

@media print {
    body {
        font-size: 10pt;
        font-family: times new roman, times, serif;
    }
    #navigation {
        display: none;
    }
}

  媒体形式:

  all,所有媒体。
  aural,言语合成器。
  handheld,移动设备
  print,打印
  projection,投影
  screen,电脑屏幕
  你还可以使用braille,embossed,tty或者tv。
  注意:说了这么多,IE只支持all,screen和print。

  Charachter sets 字符设定

  charset@规则简单设定外部样式里的编码。它出现在样式的最上面例如@charset "ISO-8859-1";

  Font faces 字体外观

  font-face@规则用来详细描述字体,可以在CSS里嵌入外部字体。

  它需要font-family描述符引用字体,它的值可以是字体的名称或是新命名一个。嵌入一个字体,使用src描述符。其他添加到font-face@规则里的描述符将影响正在使用的内含字体,例如如果你添加font-weight: bold粗体到@规则,font-family的src只能运用到带有font-family属性的选择器里,而且选择器里font-weight属性同样设置成bold。

  看下面例子:

@font-face {
    font-family: somerandomfontname;
    src: url(somefont.eot);
    font-weight: bold;
}
p {
    font-family: somerandomfontname;
    font-weight: bold;
}

  如上面的例子,段落里的字体将是somefont的字体(如果p选择器没有font-weight: bold,那字体就不是somefont)

  嵌入字体还凑合着用,因为Mozilla浏览器不支持也没有计划添加这个功能。只有IE有分寸的支持,但这也不是说可以直接使用,IE浏览器嵌入字体,你还需要微软WEFT软件,它提供Truetype字体转换成压缩的OpenType字体(只有这个你才能使用URI指定)。由于这个限制(显得非常复杂)兼容性,最好不要使用系统没有的字体。

  Pages

  page@规则服务页面媒体,是个高级方式应用于打印媒体样式。它定义了页面块,在盒模型上扩展,所以你可以定义单一页面的大小和表现。

  应用page@规则有许多规定,比如没有padding和border,而且也不上我们说的电脑屏幕,所以pixels和ems单位不被允许使用。

  有许多特定属性可以使用,比如size,可以设定portrait纵向,landscape横向,auto自动或长度。marks属性可以用来定义裁剪标志

@page {
    size: 15cm 20cm;
    margin: 3cm;
    marks: cross;
}

  页面媒体里的伪标签

  有三种伪标签用来链接特定page@规则,如下形式:@page :pseudo-class {stuff}。

  :first应用到页面媒体里的第一页

  :left和:right应用到左边和左边页面。这可能用在指定有非常大margin的左边页面和有非常大margin的右边页面。

  还有一些页面@规则,比如page-breaks页面中断和named pages页面命名,但这些@规则在浏览器里很难工作,你也许浪费了许多时间阅读这篇文章,不过这些都是不错的想法。


[] [返回上一页] [打 印]
  • 上一篇文章:新手来简单学习CSS的display属性
  • 下一篇文章:CSS解决表格或图片内容将页面撑开的办法

  • 相关文章:
  • 深入学习网页技术CSS中选择符的应用
  • 学习网页技术CSS应用在特定场合的规则
  • [图文]了解学习网页中背景图片CSS实现方法
  • 详细学习网页制作技术CSS的属性单位
  • 初学:认真学习网页技术CSS的选择符
  • 新手来学习网页技术CSS的语法基础
  • 学习网页Web标准:DOCTYPE(文档类型)基础知识
  • [图文]学习网页技术CSS样式表整理的20个技巧
  • 详细学习网页制作技术CSS的文本属性
  • [图文]学习网页应知:HTML标签和属性的语义化
  • [图文]实例学习网页制作中常用的网页表单的应用
  • 学习网页技术CSS高级教程之CSS 伪元素
关于本站 - 网站帮助 - 广告合作 - 下载声明 - 友情连接 - 网站地图 - 源码发布
Copyright © 2003-2009 Ymyasp.Com. All Rights Reserved .
备案序号:粤ICP备07029071号