个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
26
4
我已经添加了这张小 pig 的图像，所以它会在文本旁边，但是当我尝试添加水平线和文本时，它不会显示在图像和文本下方，而是与图像保持在一起。 Screenshot
HTML:
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title>Sími portfólio</title>
<link rel="stylesheet" type="text/css" href="pokus1.css" />
</head>
<body>
<div id="hlavni">
<h1 id="nadpis"> XXXXXXXXXXXXXX </h1>
<p id="text"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
In dapibus augue non sapien. Mauris suscipit, ligula sit amet pharetra semper, nibh ante cursus purus, vel sagittis velit mauris vel metus. Aliquam ornare wisi eu metus.
Duis viverra diam non justo. Etiam posuere lacus quis dolor. Pellentesque arcu. Curabitur ligula sapien, pulvinar a vestibulum quis, facilisis vel sapien. Nulla est.
Phasellus faucibus molestie nisl. Curabitur ligula sapien, pulvinar a vestibulum quis, facilisis vel sapien. Nam sed tellus id magna elementum tincidunt.
Fusce tellus odio, dapibus id fermentum quis, suscipit id erat. Integer tempor. Pellentesque arcu. </p>
</div>
<img src="tučík.png" alt="prasátko" id="prasatko">
<hr>
<p> . Mauris suscipit, ligula sit amet pharetra semper, nibh ante cursus purus, vel sagittis velit mauris vel metus. Aliquam ornare wisi eu metus.
Duis viverra diam non justo. Etiam posuere lacus quis dolor. </p>
</div>
</body>
</html>
CSS:
body {
display:block;
width: 800px;
margin-top: 10px;
margin-left: 550px;
margin-right: 550px;
background-image: url("pozadi.png");
overflow: hidden;
}
#hlavni {
clear: both;
overflow: hidden;}
#nadpis {
display:block;
background-color: grey;
font-size: 50px;
font-family: Garamond;
font-style: italic;
padding: 8px;
overflow: hidden;}
#text {
line-height: 30px;
font-size: 20px;
float: right;
clear: right;
width: 55%;
overflow: hidden;
}
#prasatko {
height: 300px;
width: 300px;
position: relative;
right: 60px;
bottom: 50px;
float: left;
clear: left;
overflow: hidden;
}
感谢您的帮助，我试过 overflow: hidden 或 clear: both 但都没有用
最佳答案
你多了一个DIV。
也只是这样做:
<hr style="clear:both">
#hlavni {
clear: both;
overflow: hidden;
}
#nadpis {
display:block;
background-color: grey;
font-size: 50px;
font-family: Garamond;
font-style: italic;
padding: 8px;
overflow: hidden;}
#text {
line-height: 30px;
font-size: 20px;
float: right;
clear: right;
width: 55%;
overflow: hidden;
}
#prasatko {
height: 300px;
width: 300px;
position: relative;
right: 60px;
bottom: 50px;
float: left;
clear: left;
overflow: hidden;
} <div id="hlavni">
<h1 id="nadpis"> XXXXXXXXXXXXXX </h1>
<p id="text"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
In dapibus augue non sapien. Mauris suscipit, ligula sit amet pharetra semper, nibh ante cursus purus, vel sagittis velit mauris vel metus. Aliquam ornare wisi eu metus.
Duis viverra diam non justo. Etiam posuere lacus quis dolor. Pellentesque arcu. Curabitur ligula sapien, pulvinar a vestibulum quis, facilisis vel sapien. Nulla est.
Phasellus faucibus molestie nisl. Curabitur ligula sapien, pulvinar a vestibulum quis, facilisis vel sapien. Nam sed tellus id magna elementum tincidunt.
Fusce tellus odio, dapibus id fermentum quis, suscipit id erat. Integer tempor. Pellentesque arcu. </p>
<img src="tučík.png" alt="prasátko" id="prasatko" style="background:red">
<hr style="clear:both">
<p> . Mauris suscipit, ligula sit amet pharetra semper, nibh ante cursus purus, vel sagittis velit mauris vel metus. Aliquam ornare wisi eu metus.
Duis viverra diam non justo. Etiam posuere lacus quis dolor. </p>
</div>关于html - float :left image includes other elements under it，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46040936/
26
4
0
当我调用 png.Decode(imageFile) 时，它返回类型 image.Image。但我找不到将其转换为 image.NRGBA 或 image.RGBA 的记录方式，我可以在其上调用 At
image/jpeg 和 image/png 包有 Decode 和 Encode 函数，可以读取和写入 jpeg 和 png 图像，但 image/gif 包没有 - 只有 Decode 和 Dec
我正在尝试从一系列任意的非调色板图像创建动画 GIF。为了创建调色板图像，我需要以某种方式想出一个调色板。 // RGBA, etc. images from somewhere else var f
我在今年夏天的空闲时间使用 Go 镜像包进行一些练习。 package main import ( "os" "image" "image/png" "image/co
关闭。这个问题需要debugging details .它目前不接受答案。 想改进这个问题？将问题更新为 on-topic对于堆栈溢出。 1年前关闭。 Improve this question 今天
我正在尝试在 TilePane 中列出图像。当我尝试创建图像 new ImageView("address"); 时出现错误，地址如下: "file:D:/Chrysanthemum.jpeg/" 以
我有一个用于为画廊选择图像的表单，我希望允许用户仅选择 jpg、gif 和 png 图像格式。 现在，为了测试，我将图像的扩展名更改为 .bmp，例如“image1.bmp”，当我在输入文件中单击以选
我有创建图像的代码:(m_img 是 javafx.scene.image.Image) Image m_img = new Image("file:" + p_Fil.getAbsoluteFile
假设我有一个这样的 8 位灰度图像: var pixels []byte = ... width := 100 height := 100 如何将其转换为实现 image.Image 的东西? 最佳答
这段代码是我在localhost:8088 URL上的索引/主页的一部分，如果我想将用户发送到url localhost:8088/image/1，我应该写href='image/{{$image->
我正在尝试对图像进行简单的裁剪。这是代码 from PIL.Image import Image def get_image_half(image, half="upper"): if hal
我在这个问题上花了一整天，但在堆栈溢出中没有看到答案! 我试过了但是没用: >> pil_image = Image.frombytes('RGBA', wand_image.size, wa
所以，我是那些以始终使用最新版本的浏览器而自豪的人之一(当然 Internet Explorer 除外 - 我说的不是那个浏览器)。 我遇到了 this awesome CSS3 website详细介
如果 image_tag 无法从 url 加载图像，我想呈现默认图像: 因此，如果 image_tag 无法从 url 加载图像: 然后呈现默认值: 这将生成结果 HTML: 关于image -
我正在创建一个类似横幅的组件，并将图像设置为组件的背景，但我无法让它工作。我尝试了网上发布的不同建议，但没有成功，目前我不确定我的错误是否在 react 代码中，或者是 webpack 没有正确加载文
如何解决 Dart 中的这种歧义错误。 import 'dart:io'; import 'package:flutter/material.dart'; import 'package:camera
Center( child: CachedNetworkImage( imageUrl: "http:/ sosme link he
设置 www.website.com/sds/(index.htm) 以便鼠标悬停在不同位置时显示图像。 出于某种原因，当您将鼠标悬停在蓝色气球上时，图像 2.jpg 和 3.jpg(在蓝色气球上来回
社交网络在共享 URL 时可以很好地从网站中提取标题和描述，但对于图像，仍然需要创建自定义元标记:property="og:image" name="twitter:image" itemprop="
我正在尝试写一个简短的，它将读取一个 PNG 文件，并将一个 channel 与另一个 channel (R,G,B) 交换作为可能的选择。 但是，我无法找到如何从 image.At(x,y) 返回的
我是一名优秀的程序员,十分优秀！