Question

我将徽标的最大宽度设置为112，它非常适合台式机，对于移动版本则不是。这是我的网站http://mediagrafter.com/logistics/#的链接吗？

我尝试减小左页边距，但未在移动版本中进行调整（响应式）。

<pre>
    <img src="wp-content/uploads/2018/09/logo.png" alt="" style="
        max-width: 112%;
    ">
</pre>

我希望徽标可以在移动视图中进行调整（响应式），但它会显示徽标的一半。

Answer 1

我想您可以将宽度设置为100％，然后将 object-fit 属性设置为 contain

其他想法是设置

// create serial queue

let queue = DispatchQueue(label: "...")

// but not your own concurrent queue:
//
// let queue = DispatchQueue(label: "...", attributes: .concurrent)
//
// nor one of the global concurrent queues:
//
// let queue = DispatchQueue.global(qos: .default)
//

Answer 2

首先，尝试以下操作：

<pre>
    <img src="wp-content/uploads/2018/09/logo.png" alt="" style="
        device-width;
    ">
</pre>

或在文档的<head>部分中添加特定于meta标签的

<meta name="viewport" content="width=device-width, initial-scale=1">

如果它不起作用，请在样式表中添加以下内容：

@-ms-viewport{ width: device-width; }

阅读以获取更多信息

https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag

如何使您的网站徽标具有响应性？

2 个答案: