如何在 Wordpress 上检测基于设备的 HTML 代码?
Posted
技术标签:
【中文标题】如何在 Wordpress 上检测基于设备的 HTML 代码?【英文标题】:How to detect HTML code based on device on Wordpress? 【发布时间】:2019-10-18 10:52:28 【问题描述】:我没有 html 方面的经验,并试图在 WordPress 上为自己制作一个小型网站。
我有以下自定义代码可以在我的网站上播放视频:
<video poster="video poster link" controls="controls" >
<source src="video link" type="video/mp4"></video>
视频播放器在桌面站点中完美显示。然而,当 WordPress 为平板电脑调整网站大小时,它确实延伸了很多。因此,我想更改代码在平板电脑/移动设备上显示时的大小。
为了检测我在网上找到了以下代码,但我无法让它工作:
<?php
if ( wp_is_mobile() )
/* Include/display resources targeted to phones/tablets here */
else
/* Include/display resources targeted to laptops/desktops here */
?>
谢谢。
【问题讨论】:
您需要为此使用CSS @media queries。 【参考方案1】:如果您在您的 wordpress 网站中没有对您的代码的编辑权限,您可以添加一个像 fitvids 这样的插件。 如果你有编辑权限,你可以添加一个媒体查询来检查设备宽度是否像这样
@media screen and (max-width: 768px)
video
max-width: 75%;
height:auto;
// iPad
@media screen and (max-width: 480px)
video
max-width: 45%;
height:auto;
//Phone
根据需要调整宽度..
希望对你有帮助
【讨论】:
以上是关于如何在 Wordpress 上检测基于设备的 HTML 代码?的主要内容,如果未能解决你的问题,请参考以下文章
Wordpress 403 禁止“您无权访问此服务器上的 /。”
如何为基于 wordpress 自定义主题的网站进行响应式设计?