移动ios上的背景图像模糊
这可能是一个菜鸟问题,但我似乎无法找到任何解决方案,我有问题。在我的网站上,我有一张背景图片,可以在任何屏幕尺寸的桌面上呈现完美的图像,但在移动设备上查看时会变得模糊不清。我看到了几个类似的问题,要么没有答案,要么解决方案对我不起作用,我们将不胜感激。
Here is the website
以下是我所经历的一些截图。 这里是我的代码。移动ios上的背景图像模糊
<div class="jumbotron"> <h1 class="text-center" id="head">Kyle Goode</h1> <p class="text-center" id="header">Full Stack Web Developer</p> </div> </div>
.home {
background: url(http://mrg.bz/VN5LDd) fixed no-repeat center;
background-attachment: fixed;
background-size: cover !important;
max-width: 100%;
height: 900px;
border-top: 1px solid black;
border-bottom: 1px solid black;
}
编辑:瓦伦蒂诺Kožinec是正确的。似乎是一个固定和封面的iOS问题。
变化。家里这样:
.home {
background: url(http://mrg.bz/VN5LDd) no-repeat center;
,并删除
background-attachment: fixed;
看来工作。
你有Doctype和头标签,然后在你的身体里你有他们。这可能会导致你的问题。值得一看。
这被复制,并从您的网站粘贴在这里:
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>Portfolio </title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<!DOCTYPE html>
<html lang="en">
<head>
<!--Meta -->
<title>Goode Web Development</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
<link rel="stylesheet" href ="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link href='https://fonts.googleapis.com/css?family=Montserrat:700,400' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Roboto:300italic' rel='stylesheet' type='text/css'>
<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
</head>
有堆栈上类似的答案已经,
你可能有背景位置问题:在使用它们一起盖:固定和背景大小。尝试删除第一个,看看问题是否仍然存在。
您可能比为.home类制作媒体查询并放置裁剪图像或其他解决方法。
感谢您看看华伦天奴!我已经读过你提到的问题,但我使用的是后台附件,而不是定位。我使用的唯一背景位置是Hemchand建议的中心位置。移除背景附件对我背景图像的模糊没有影响。 – kgoode517
非常感谢杰森!这一点解决了,谢谢你指出头声明! – kgoode517
没问题。很高兴我能帮上忙! –