Hi there,
I haven't designed a web site using Dreamweaver for at least ten years. What I want to do is so simple, but I can't find a template for it. I just want to build a web site with a JPEG in the background that will look proportional on mobile devices and desktops. No text, no links—nothing except the image. Can anyone point me to a simple template that will accomplish that? Thank you!
meaghanm60433811 wrote
I just want to build a web site with a JPEG in the background that will look proportional on mobile devices and desktops. No text, no links—nothing except the image.
No content means it's invisible to search engines, screen readers and language translators. Apart from the obvious accessibility problems, a lack of real HTML content = no traffic to your website except what you pay for in keyword ads.
Copy & paste this code into a new, blank document in Code View.
SaveAs test.html and preview in browsers and mobile devices.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Background-Size Cover Demo</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<style>
body, html {
margin: 0;
padding: 0;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
body {
background: url(https://placeimg.com/900/900/nature) center center fixed;
background-size: cover
}
.container {
width: 40%;
margin: 0 auto;
padding: 5%;
background: rgba(255,255,255,0.8);
}
.center { text-align: center }
</style>
</head>
<body>
<div class="container">
<h2>Heading 2</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
<p class="center"><a href="https://example.com" class="button">CLICK HERE</a></p>
</div>
</body>
</html>
Already have an account? Login
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.
AdChoices