Question

我正在尝试使用内部样式表的media属性。我将media=print和media=handheld用于移动设备。但这不起作用。不确定为什么？

编辑：我想要得到的结果是，media =“print，test text = blue，图片是静态的.Media =”掌上电脑“，测试文字=红色，图片要响应/动态。

<html>
 <head>
<style media="print">

p.slide {
width:1040 px;
height:383 px;
color:#00F;
}

</style>
<style media="handheld">
p.slide {
width:20%;
height:10%;
color:#F00;
}
</style>
</head>
<body>
<div>

    <p class="slide">
     test
        <img src="https://hpva2w-ch3301.files.1drv.com/y4m3P0wDLAI8GVZl1qYwcsqB9AFNfl5mJCFQw_f3627uFXESiPUbkJmyrLNvzVaz4uIIA8vlEX3i11Frkm8p8VGDSwyW8Oempo79nFvc2xFJe5KuKOpVT6ZhNUSasTvPRfX7PBsdL6riiJf8aaSs7McYyZSc9gL0qQZPJEXAk3fjlV93b3bpoxtCBglvXHIQut7RTaM12d0vcrbEvzv-DtQ8A?width=1024&height=683&cropmode=none" >

    </p>
</div>
</body>

</html>

Answer 1

它工作正常，但你无法测试＆＃34; print＆＃34;和＃34;掌上电脑＆＃34;在jsfiddle。（它不接受媒体属性，你不能在CSS字段中定义<style media="">。

＆＃13;

<html>
 <head>
<style media="print">

p.slide {
width:1040 px;
height:383 px;
color:#00F;
}

</style>
<style media="handheld">
p.slide {
width:20%;
height:10%;
color:#F00;
}
</style>
</head>
<body>
<div>

    <p class="slide">
     test
        <img src="https://hpva2w-ch3301.files.1drv.com/y4m3P0wDLAI8GVZl1qYwcsqB9AFNfl5mJCFQw_f3627uFXESiPUbkJmyrLNvzVaz4uIIA8vlEX3i11Frkm8p8VGDSwyW8Oempo79nFvc2xFJe5KuKOpVT6ZhNUSasTvPRfX7PBsdL6riiJf8aaSs7McYyZSc9gL0qQZPJEXAk3fjlV93b3bpoxtCBglvXHIQut7RTaM12d0vcrbEvzv-DtQ8A?width=1024&height=683&cropmode=none" >

    </p>
</div>
</body>

</html>

＆＃13;

包含媒体属性

1 个答案: