欢迎来到酱油妹!织梦模板,dede模板下载,织梦cms模板,免费网站模板下载站

酱油妹

CSS3达成分栏布局

企业模板

column-count 栏目列数

column-width 栏目宽度

column-rule 栏目间隔线

column-gap 栏目距离

all 所有媒体

媒体种类

embossed 盲文打印机

braille 盲文触觉设施

projection 打印预览

print 手持设施

speech '听觉'类似的媒体种类

screen 彩屏设施

tv 电视

tty 不适用像素的设施

and

关键词

only only用来定某种特定的媒体种类

not not关键词是用来排除某种拟定的媒体种类

(max-width:600px)

媒体特质

(orientation:portrait) 竖屏

(max-device-width: 480px) 设施输出宽度

(-webkit-min-device-pixel-ratio: 2) 像素比

(orientation:landscape) 横屏

window.devicePixelRatio = 物理像素 / dips

devicePixelRatio 设施像素比

<link rel="stylesheet" href="css/index.css" media="print" />

样式引入

@media screen{ }

@import url("css/demo.css") screen;

<link rel=”stylesheet” media=”all and (orientation:landscape)”href=”landscape.css”>

<link rel=”stylesheet” media=”all and (orientation:portrait)” href=”portrait.css”>

样式引入

@media screen and (min-width:360px) and (max-width:500px) {}

<link rel="stylesheet" type="text/css" href="indexB.css" media="screen and (min-width: 600px) and (max-width: 800px)">

<link rel="stylesheet" type="text/css" href="indexA.css" media="screen and (min-width: 800px)">

手机

<link rel="stylesheet" type="text/css" href="indexC.css" media="screen and (max-width: 600px)">

width [pixel_value | device-width(设施宽度)]

<meta name="viewport" content="" />

user-scalable 是不是允许手工缩放 (no||yes)

height [pixel_value | device-height(设施高度)]

minimum-scale 允许缩放的最小比率

initial-scale 初始比率

target-densitydpi [dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi]

maximum-scale 允许缩放的最大比率

<meta name="viewport" content="" />

手机

height [pixel_value | device-height(设施高度)]

width [pixel_value | device-width(设施宽度)]

initial-scale 初始比率

user-scalable 是不是允许手工缩放 (no||yes)

maximum-scale 允许缩放的最大比率

minimum-scale 允许缩放的最小比率

target-densitydpi [dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi]


希望以上内容可以解决您的问题!
如有其他问题欢迎大家一起交流学习!
作者:酱油妹 来源:www.jiangyoumei.com 关注: 时间:2021-03-25 02:54
版权声明:凡注明来源为www.jiangyoumei.com的均为本站原创,转载请注明来源。
本文网址:http://www.jiangyoumei.com/HTML/HTML5/20210325/11843.html
凡本站提供教程均已验证教程的准确性。
相关教程
在线客服

织梦模板 整站模板 新手教程 使用技巧