html - How is the meta viewport tag used, and what does it do?

Question

asked Oct 17, 2021 in Technique[技术] by 深蓝 (71.8m points)

If anyone could answer this it would be a great help to newbies learning

<meta="viewport">

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…

1 Answer

深蓝 · Answer 1 · 2021-10-17T00:28:52+0000

The viewport browser support is a little bit across the board. I'll point you to the Quirksmode page for viewport browser support for the full details.
You use the viewport meta tag like any other meta tag. Put the code block straight up in the <head>.
Pretty much, but again, a little bit of a mouthful to say here. I'd advise reading some articles, reading the W3 mobile best practices for web design, or the current W3 draft specifications on the viewport attribute for the <meta> tag.

In short, adding this line to a website that should implement viewport scaling should fix most problems. (copied from WebDesignTuts+'s "Quick Tip: Don't Forget the Viewport Meta Tag" article)

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

P.S. Quirksmode also has a rather wonderful article describing the issue that's worth reading to understand why this might be helpful.