- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我目前正在制作我的学习元素页面。我希望它能够响应,因为它是它的一部分。但是,当屏幕尺寸为 head、section 和 body 中的小字时,它们会重叠。如果没有足够的空间容纳所有单词(整个句子),我无法将单词转到另一行。我试过使用断字,但没有用。有谁知道我可以做些什么来改变它?
<html lang="pl-PL">
<head>
<meta charset="UTF-8"/>
<link rel="stylesheet" type="text/css" href="css.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="My hobby page.">
<meta name="keywords" content="books, hobby">
<meta name="author" content="Bogna Gondek">
<link rel="stylesheet" href="css.css">
<script type="text/javascript" src="js.js"></script>
<title>Książki Moje Hobby | Witamy</title>
</head>
<body>
<header>
<h1>Książki Moje Hobby</h1>
<nav>
<ul>
<li><a class="aktywny" href="strona_główna.html">Strona Główna</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
</ul>
</nav>
</header>
<div id="wnętrze">
<section>
<h2>„Bajki są więcej niż prawdą: nie dlatego, że mówią nam, że smoki istnieją, ale dlatego, że mówią, że smoki można pokonać.”</h2>
<h3>― Neil Gaiman, „Coraline"</h3>
</section>
</div>
<footer>
Książki Moje Hobby, Copywright © 2019
</footer>
</body>
</html>
body
{
font-family: Times, Courier, Verdana, Comic, Arial;
font-size: 20px;
line-height: 2px;
padding:0;
margin: 0;
background-color: white;
}
header
{
width: 100%;
margin: auto;
overflow: hidden;
padding-top: 20px;
min-height: 70px;
background-color: #404040;
}
header h1
{
margin-left: 20px;
float:left;
color: #f2f2f2;
}
header nav
{
float:right;
margin-top:10px;
margin-right: 20px;
margin-bottom: 20px;
}
header li
{
float:left;
display:inline;
padding: 0 20px 0 20px;
}
header a
{
text-decoration: none;
color: #f2f2f2;
font-size: 22px;
}
header a:hover
{
font-weight: bold;
}
header .aktywny
{
color: #b3b3b3;
}
div#wnętrze
{
max-width:100%;
height: 100%;
margin: auto;
overflow: hidden;
background:url("obrazki/glownyobrazek.jpg") no-repeat 0;
color: #f2f2f2;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
section
{
background-color: red;
max-width: 80%;
word-wrap: break-all !important;
}
footer
{
padding: 20px;
margin-top: auto;
background-color: #404040;
text-align: center;
color: #f2f2f2;
}
最佳答案
问题是您在主体上设置的行高。
body
{
font-family: Times, Courier, Verdana, Comic, Arial;
font-size: 20px;
line-height: 1;
padding:0;
margin: 0;
background-color: white;
}
关于html - 屏幕尺寸太小时文本重叠,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58629910/
在我们的服务出现一些预期的增长之后,突然间一些更新花费了非常长的时间,这些过去非常快,直到表达到大约 2MM 记录,现在它们每个需要大约 40-60 秒。 update table1 set fiel
我在服务中实现了一个传感器事件监听器,只要采样周期和最大报告延迟低于 1 秒,该监听器就可以正常工作,但一旦我将采样周期增加到超过 1 秒,传感器就根本不会更新。 我希望采样周期为 10 秒(可能是
我使用 Tkinter GUI 来启动测量和分析过程,基本上只需单击一个按钮即可开始。由于这些测量可能需要一段时间,我尝试添加一个进度条,即这个: http://tkinter.unpythonic.
我正在尝试使用套接字发送数据包,但出现错误。 invalid conversion from ‘omnetpp::cPacket*’ to ‘inet::Packet*’ [-fpermissive]
我刚刚发现 String#split 有以下奇怪的行为: "a\tb c\nd".split => ["a", "b", "c", "d"] "a\tb c\nd".split(' ') => ["a
您好,我正在尝试 ClojureScript,我正在使用 Klipse作为我的 REPL 差不多。这可能不是它的预期用途,但因为我没有做任何太复杂的事情,所以现在没问题。 我遇到的一个问题是尝试设置计
根据下面的数据,ClockKit 会生成一次 future 的 CLKComplicationTimelineEntry 项,但对于过去的时间点,会进行 24 次调用!这是为什么? 更多详情: 我注意
我有一个 MySQL 表,这个表有一个名为 datetime_utc 的 DATETIME 列。如您所料,它是 UTC 日期和时间。在我的 Bookshelf 模型中,我定义了一个虚拟 getter,
大家好,我是二哥呀! 昨天,一位球友问我能不能给他解释一下 @SpringBootApplication 注解是什么意思,还有 Spring Boot 的运行原理,于是我就带着他扒拉了一下这个注解的源
我是一名优秀的程序员,十分优秀!