隐藏移动设备的边框

我想隐藏小宽度设备的右边框。隐藏移动设备的边框

请检查片段。

@media screen and (max-width: 480px) { 
 
    #d { 
 
    border-right: none; 
 
    } 
 
}

<div style="text-align:center; border-right:solid #8d989a 1px;height:230px;" id="d"> 
 
    <img src="vector-smart-object1.png"> 
 
</div>

来源

2017-08-08 Batoul

@media screen and (max-width: 480px) { 
 
    #d { 
 
    border-right: none; 
 
    } 
 
}

<div style="text-align:center; border-right: 1px solid #8d989a;height:230px;" id="d"> 
 
    <img src="https://www.w3schools.com/css/paris.jpg"> 
 
</div>

的变化：右边框：固体＃8d989a 1px的; ====> border-right：1px solid＃8d989a; 在编辑您的问题之前，id关键字之前添加了空格。

来源

2017-08-08 14:02:39 anu

首先你的border-right属性的语法是错误的。您应该像这样更改它：border-right : 1px solid #8d989a;，因为目前即使屏幕较大也不会显示边框。

请谨慎使用CSS中的参数顺序。

来源

2017-08-08 14:03:25

我会感谢你的 – Batoul

我与它合作了一下，想通了它只需要@media屏幕。

@media only screen and (min-width: 480px) { 
 
    #d { 
 
    border-right: 1px solid #8d989a; 
 
    } 
 
}

<div style="text-align:center;height:230px;" id="d"> 
 
    <img src="vector-smart-object1.png"> 
 
</div>

这里是示出该工作的代码笔。

https://codepen.io/anon/pen/ayWVQG

干杯

来源

2017-08-08 14:04:46

它不工作 – Batoul

你想查看它在什么设备？ –

我只想隐藏小宽度屏幕的边框 – Batoul

可以使用http://mobiledetect.net检测移动设备。并改变border-right:solid #8d989a 1px;到border-right:1px solid #8d989a;

 <div style="text-align:center;<?php if (!$detect->isMobile()) {echo'border-right:1px solid #8d989a;';}?> height:230px;"id="d"> 
    <img src="vector-smart-object1.png" >  
</div>

来源

2017-08-08 14:05:44

隐藏移动设备的边框

回答

相关问题