媒体类型@media

媒体类型允许你指定文件将如何在不同媒体呈现。该文件可以以不同的方式显示在屏幕上，在纸张上，或听觉浏览器等等。

@media 规则允许在相同样式表为不同媒体设置不同的样式。
浏览器屏幕上显示一个14像素的Verdana字体样式。但是如果页面打印，将是10个像素的Times字体。请注意，font-weight在屏幕上和纸上设置为粗体：

<html>
<head>
<style>
@media screen{p.test {font-family:verdana,sans-serif;font-size:14px;}}
@media print{p.test {font-family:times,serif;font-size:10px;}}
@media screen,print{p.test {font-weight:bold;}}
</style>
</head><body>
....
</body>
</html>

媒体类型@media相关推荐

教你玩转CSS 媒体类型
目录 CSS 媒体类型媒体类型 @media 规则其他媒体类型 CSS 媒体类型媒体类型允许你指定文件将如何在不同媒体呈现.该文件可以以不同的方式显示在屏幕上,在纸张上,或听觉浏览器等等. 媒体 ...
Java中printmax的调用形式_媒体类型和响应式设计
一.媒体类型: 常用的三种为:all,print和screen 二.媒体类型引用方法:link标签,xml方式,@import和css3新增的@media四种 link方法: link方法引入媒体类型 ...
媒体查询Media Queries详解
@media 标签可以说是响应式网页的开发基础.其主要由媒体类型(Media Type)和媒体特性(Media Query)两部分组成. Media Type 设定后面规则生效的展示类型,包括all ...
css3的媒体查询(Media Queries)
css3的媒体查询(Media Queries) 我今天就总结一下响应式设计的核心CSS技术Media(媒体查询器)的用法. 先看一个简单的例子: <link rel="stylesh ...
CSS媒体类型基本知识
1.媒体类型 @media @media 规则允许在相同样式表为不同媒体设置不同的样式.例如同一页面在浏览器屏幕上展示和打印在纸张上字体大小.背景色等属性会有区别,这是因为不同的媒体类型需要的样式 ...
媒体查询(media)
目录媒体查询介绍 Media Queries具体使用一.最大宽度Max Width 二.最小宽度Min Width 三.多个Media Queries使用四.设备屏幕的输出宽度Device Wi ...
CSS3的媒体查询(Media Queries)与移动设备显示尺寸大全
文章目录媒体查询介绍 Media Queries具体使用一.最大宽度Max Width 二.最小宽度Min Width 三.多个Media Queries使用四.设备屏幕的输出宽度Device ...
CSS基础之媒体类型（@media）样式
定义使用 @media,可以针对不同的媒体类型定义不同的样式. 使用 @media, 可以针对不同的屏幕尺寸设置不同的样式当你重置浏览器大小的过程中,页面也会根据浏览器的宽度和高度重新渲染页面. ...
media属性和媒体类型
一.media属性当设定样式的时候,可以指定此样式应用于何种媒体,例如: <link rel="stylesheet" href="basic.css" ...

媒体类型@media

媒体类型@media相关推荐

最新文章

热门文章