我在Vs代码中创建了一个网页。然后我从google-font中选择一种字体并将其链接嵌入HTML 的 head 标签中。然后在 CSS 中添加字体系列。它工作正常。当我在实时服务器扩展中测试网页时。我注意到每当我在 CSS 中写一个字符时，页面 就会晃动很大。当我停止编写代码时，震动就会停止。在摇动过程中，字体无缘无故地变得更大、更小、更暗等，尽管我没有对字体做任何事情。这背后的问题是什么？如何停止这种晃动？body{font-family: 'Girassol', cursive;font-size:25px;}<!DOCTYPE html><html> <head> <title>Dropdown Menu design</title> <link href="https://fonts.googleapis.com/css2?family=Girassol&display=swap" rel="stylesheet" /> <link rel="stylesheet" href="indexstyle.css" /> <script src="try.js"></script> </head> <body> <p> The University was established as compensation for the annulment of the 1905 Partition of Bengal. The partition had established East Bengal and Assam as a separate province, with Dhaka as its capital. However, the partition was abolished in 1911. In 1913, public opinion was solicited before the university scheme was given its final shape, and the Secretary of State approved it in December 1913.[1] The first vice-chancellor of the university was Philip Joseph Hartog, who had been academic registrar of the University of London for 17 years.[ </p> </body></html>
1 回答
互换的青春
TA贡献1797条经验 获得超6个赞
是的，我观察到底部出现空白。这是因为 body 标签内的元素没有占用完整的可用 body 大小。
元素高度为 body- 722 header- 104 .showcase- 251 enter code here .info-bar- 201 .testimonials- ~71 footer- ~62
底部的空白区域是视口的剩余区域。如果你缩小浏览器，空白就会消失。
要解决此问题，您可以在正文中使用以下 css。
body {
font-family: Tahoma, Verdana, Segoe;
font-size: 15px;
line-height: 1.5;
padding: 0;
margin: 0;
background-color: #ffffff;
/* Add below lines*/
display: flex;
flex-direction: column;
align-items: stretch;
}
- 1 回答
- 0 关注
- 160 浏览
添加回答
举报
0/150
提交
取消