个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
27
4
这是我的代码:
body{
margin:0;
padding:0;
line-height: 1.5em;
background-image: url(http://fehlbelichtet.stefanwensing.de/wp-content/uploads/sites/6/2016/04/alte-strasse-endlos.jpg);
background-repeat:no-repeat;
background-attachment: fixed;
h1 {
color: #e29532;
margin: 0;
padding: 20px;
font-family:verdana;
font-size: 60px;
line-height: 50px;
letter-spacing: -2px;
font-weight: bold;
text-align:center;
}
h2 {
font-size:20px;
font-family:verdana;
color:#e29532;
}
p {
font-family:verdana;
}
b {
font-size: 110%;
}
#topsection{
background: #dddce1;
height: 100px; /*Height of top section*/
margin:0;
}
#contentwrapper{
float: left;
width: 100%;
}
#contentcolumn{
margin: 0 200px 0 230px; /*Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth*/
}
#footer{
clear: left;
width: 100%;
text-align: center;
padding: 4px 0;
}
#footer a{
color: white;
}
.innertube{
margin:0;
}
@media (max-width: 840px){ /* 1st level responsive layout break point- drop right column down*/
#contentcolumn{
margin-right: 0; /*Set margin to LeftColumnWidth*/
}
}
@media (max-width: 600px){ /* 2nd level responsive layout break point- drop left column down */
#contentcolumn{
margin-left: 0;
}
}
label {
float:left;
width:25%;
margin-right:0.5em;
padding-top:0.2em;
text-align:right;
font-family:verdana
}
fieldset {
border-radius:4px;
background: rgba(0,0,0,0.6);
font-family:verdanda;
color:white;
}
legend {
}
input {
border-radius:4px;
}
select {
border-radius:4px;
}
textarea {
opacity:0.8;
border-radius:4 px;
font-family:verdana;
}
table {
font-family:verdana;
}<!DOCTYPE html>
<html>
<head>
<title>Vinn en Bil!</title>
<link rel="shortcut icon" href="volvo.ico"></link>
<link rel="stylesheet" type="text/css" href="form.css">
<meta charset="UFT-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div id="maincontainer">
<div id="topsection">
<div class="innertube">
<h1> Vinn en bil </h1>
<hr>
</div>
</div>
<div id="contentwrapper">
<div id="contentcolumn">
<div class="innertube">
<br>
<form>
<fieldset class="fieldset">
<legend></legend>
<h2>Personlig Information</h2>
<br>
<label for="namn">Förnamn:</label>
<input type="text" placeholder="Förnamn" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Förnamn'" required />
<br>
<br>
<label for="efternamn">Efternamn:</label>
<input type="text" placeholder="Efternamn" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Efternamn'" required />
<br>
<br>
<label for="age">Ålder: </label>
<select name="age">
<option value="18-25">18-25</option>
<option value="25-35">25-35</option>
<option value="35-50">35-50</option>
<option value="50+">50+</option>
</select>
<br>
<br>
<label for="kön">Kön:</label>
<table>
<tr>
<td>Man</td>
<td><input class="radio" type="radio"></input></td>
</tr>
<tr>
<td>Kvinna</td>
<td><input class="radio" type="radio"></input></td>
</tr>
<tr>
<td>Annat</td>
<td><input class="radio" type="radio"></input></td>
</tr>
</table>
<br>
<label for="mail">Email:</label>
<input type="email" placeholder="Email" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Email'" required/>
<br>
<br>
<label for="adress">Adress:</label>
<input type="text" placeholder="Adress" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Adress'"/>
<br>
<br>
<label for="postnummer">Postnummer:</label>
<input type="text" placeholder="Postnummer" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Postnummer'"/>
<br>
<br>
<label for="postort">Postort:</label>
<input type="text" placeholder="Postort" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Postort'"/>
<br>
<br>
<label for="nummer">Telefon nummer:</label>
<input type="text" placeholder="Telefon nummer" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Telefon nummer'"/>
<br>
</fieldset>
<br>
<br>
<fieldset class="fieldset">
<legend></legend>
<h2>Om du vann?</h2>
<table>
<tr>
<td>Välj en bil</td>
<td>
<div class="form-group">
<select name="make" id="make">
<option value="">Välj en Volvo typ</option>
<option value="XC">XC</option>
<option value="V">V</option>
<option value="S">S</option>
<option value="Laddhybrider">Laddhybrider</option>
</select>
</div>
</td>
<td>
<div class="from-group">
<select name="type" id="type">
<option value="" class="">Välj en Volvo model </option>
<option value="XC90" class="XC">XC90</option>
<option value="XC60" class="XC">XC60</option>
<option value="V60 Cross country" class="V">V90 Cross country</option>
<option value="V90" class="V">V90</option>
<option value="V60 Cross country" class="V">V60 Cross country</option>
<option value="V60" class="V">V60</option>
<option value="V40 Cross country" class="V">V40 Cross country</option>
<option value="V40" class="V">V40</option>
<option value="S90" class="S">S90</option>
<option value="S60 Cross country" class="S">S60 Cross country</option>
<option value="S60" class="S">S60</option>
<option value="XC90 T8 Twin engine" class="Laddhybrider">XC90 T8 Twin engine</option>
<option value="V60 D6 Twin engine" class="Laddhybrider">V60 D6 Twin engine</option>
<option value="V60 D5 Twin engine" class="Laddhybrider">V60 D5 Twin engine</option>
</select>
</div>
</td>
</tr>
</table>
<br>
<p>Varför ska just du ska vinna:</p>
<textarea rows="20" cols="60"></textarea>
<br>
<br>
</fieldset>
<br>
<br>
<fieldset class="fieldset">
<legend></legend>
<h2>Omdöme på hemsidan</h2>
<br>
<p>Vad tycker du om sidan</p>
<textarea rows="20" cols="60"></textarea>
<input type="submit" value="Klar" onclick="alert('Tack för ditt deltagande!')">
<input type="reset">
</form>
</div>
</div>
</div>
<div id="footer"><a href="http://www.volvocars.com/se?gclid=Cj0KEQjwqMHABRDVl6_hqKGDyNIBEiQAN-O9hMtUPMIE4aak0QmcGyXpDihhM-HkAJVCuGxwqf7fpQUaAmVb8P8HAQ" target="_blank">Volvo</a></div>
</div>
</body>
</html>我的背景附件设置为固定，我希望网站向下滚动到图像的末尾，然后设置为固定。
我是编码新手，这个网站是本地网站，就在我的电脑上，所以将图像链接放在背景图像的 url 中。
最佳答案
用背景图像替换 css 属性背景。添加背景大小和背景位置
body{
margin:0;
padding:0;
line-height: 1.5em;
background: url(http://fehlbelichtet.stefanwensing.de/wp-content/uploads/sites/6/2016/04/alte-strasse-endlos.jpg);
background-repeat:no-repeat;
background-size:cover;
background-position:center center;
background-attachment: fixed;
h1 {
color: #e29532;
margin: 0;
padding: 20px;
font-family:verdana;
font-size: 60px;
line-height: 50px;
letter-spacing: -2px;
font-weight: bold;
text-align:center;
}
h2 {
font-size:20px;
font-family:verdana;
color:#e29532;
}
p {
font-family:verdana;
}
b {
font-size: 110%;
}
#topsection{
background: #dddce1;
height: 100px; /*Height of top section*/
margin:0;
}
#contentwrapper{
float: left;
width: 100%;
}
#contentcolumn{
margin: 0 200px 0 230px; /*Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth*/
}
#footer{
clear: left;
width: 100%;
text-align: center;
padding: 4px 0;
}
#footer a{
color: white;
}
.innertube{
margin:0;
}
@media (max-width: 840px){ /* 1st level responsive layout break point- drop right column down*/
#contentcolumn{
margin-right: 0; /*Set margin to LeftColumnWidth*/
}
}
@media (max-width: 600px){ /* 2nd level responsive layout break point- drop left column down */
#contentcolumn{
margin-left: 0;
}
}
label {
float:left;
width:25%;
margin-right:0.5em;
padding-top:0.2em;
text-align:right;
font-family:verdana
}
fieldset {
border-radius:4px;
background: rgba(0,0,0,0.6);
font-family:verdanda;
color:white;
}
legend {
}
input {
border-radius:4px;
}
select {
border-radius:4px;
}
textarea {
opacity:0.8;
border-radius:4 px;
font-family:verdana;
}
table {
font-family:verdana;
}<!DOCTYPE html>
<html>
<head>
<title>Vinn en Bil!</title>
<link rel="shortcut icon" href="volvo.ico"></link>
<link rel="stylesheet" type="text/css" href="form.css">
<meta charset="UFT-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div id="maincontainer">
<div id="topsection">
<div class="innertube">
<h1> Vinn en bil </h1>
<hr>
</div>
</div>
<div id="contentwrapper">
<div id="contentcolumn">
<div class="innertube">
<br>
<form>
<fieldset class="fieldset">
<legend></legend>
<h2>Personlig Information</h2>
<br>
<label for="namn">Förnamn:</label>
<input type="text" placeholder="Förnamn" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Förnamn'" required />
<br>
<br>
<label for="efternamn">Efternamn:</label>
<input type="text" placeholder="Efternamn" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Efternamn'" required />
<br>
<br>
<label for="age">Ålder: </label>
<select name="age">
<option value="18-25">18-25</option>
<option value="25-35">25-35</option>
<option value="35-50">35-50</option>
<option value="50+">50+</option>
</select>
<br>
<br>
<label for="kön">Kön:</label>
<table>
<tr>
<td>Man</td>
<td><input class="radio" type="radio"></input></td>
</tr>
<tr>
<td>Kvinna</td>
<td><input class="radio" type="radio"></input></td>
</tr>
<tr>
<td>Annat</td>
<td><input class="radio" type="radio"></input></td>
</tr>
</table>
<br>
<label for="mail">Email:</label>
<input type="email" placeholder="Email" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Email'" required/>
<br>
<br>
<label for="adress">Adress:</label>
<input type="text" placeholder="Adress" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Adress'"/>
<br>
<br>
<label for="postnummer">Postnummer:</label>
<input type="text" placeholder="Postnummer" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Postnummer'"/>
<br>
<br>
<label for="postort">Postort:</label>
<input type="text" placeholder="Postort" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Postort'"/>
<br>
<br>
<label for="nummer">Telefon nummer:</label>
<input type="text" placeholder="Telefon nummer" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Telefon nummer'"/>
<br>
</fieldset>
<br>
<br>
<fieldset class="fieldset">
<legend></legend>
<h2>Om du vann?</h2>
<table>
<tr>
<td>Välj en bil</td>
<td>
<div class="form-group">
<select name="make" id="make">
<option value="">Välj en Volvo typ</option>
<option value="XC">XC</option>
<option value="V">V</option>
<option value="S">S</option>
<option value="Laddhybrider">Laddhybrider</option>
</select>
</div>
</td>
<td>
<div class="from-group">
<select name="type" id="type">
<option value="" class="">Välj en Volvo model </option>
<option value="XC90" class="XC">XC90</option>
<option value="XC60" class="XC">XC60</option>
<option value="V60 Cross country" class="V">V90 Cross country</option>
<option value="V90" class="V">V90</option>
<option value="V60 Cross country" class="V">V60 Cross country</option>
<option value="V60" class="V">V60</option>
<option value="V40 Cross country" class="V">V40 Cross country</option>
<option value="V40" class="V">V40</option>
<option value="S90" class="S">S90</option>
<option value="S60 Cross country" class="S">S60 Cross country</option>
<option value="S60" class="S">S60</option>
<option value="XC90 T8 Twin engine" class="Laddhybrider">XC90 T8 Twin engine</option>
<option value="V60 D6 Twin engine" class="Laddhybrider">V60 D6 Twin engine</option>
<option value="V60 D5 Twin engine" class="Laddhybrider">V60 D5 Twin engine</option>
</select>
</div>
</td>
</tr>
</table>
<br>
<p>Varför ska just du ska vinna:</p>
<textarea rows="20" cols="60"></textarea>
<br>
<br>
</fieldset>
<br>
<br>
<fieldset class="fieldset">
<legend></legend>
<h2>Omdöme på hemsidan</h2>
<br>
<p>Vad tycker du om sidan</p>
<textarea rows="20" cols="60"></textarea>
<input type="submit" value="Klar" onclick="alert('Tack för ditt deltagande!')">
<input type="reset">
</form>
</div>
</div>
</div>
<div id="footer"><a href="http://www.volvocars.com/se?gclid=Cj0KEQjwqMHABRDVl6_hqKGDyNIBEiQAN-O9hMtUPMIE4aak0QmcGyXpDihhM-HkAJVCuGxwqf7fpQUaAmVb8P8HAQ" target="_blank">Volvo</a></div>
</div>
</body>
</html>关于html - 背景设置为滚动到图像末尾，然后设置为固定，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40515618/
27
4
0
我正在更改链接网址以添加 www.site.com/index.html?s=234&dc=65828 我通过此代码得到的是:site.com/&dc=65828 var target="&dc=65
我在编译过程中收到错误: src/smtp.c:208:1: warning: control reaches end of non-void function [-Wreturn-type] 这是相
这是我的 bootstrap/html 代码: Put email 位置正确，但我希望输入字段的大小延伸到 div 末尾。谁能帮帮我？ 最佳答案 只需按百分比指定宽度，如下所示
我正在尝试获取一个像这样的 json 对象: filters = {"filters": myArray}; 并将其附加到 URL 的末尾，使用: this.router.navigate([`/de
这个问题已经有答案了: Remove hash from url (5 个回答) 已关闭 10 年前。 我有一个网站，stepaheadresidents.com ，并且井号 (#) 会自动添加到 u
我有这个代码 $('container a').appendTo('.container'); dzedzdqdqdqzdqdzqdzqdqzdqd Forgot password
为了练习更多 Python 知识，我尝试了 pythonchallenge.com 上的挑战 简而言之，作为第一步，此挑战要求从末尾带有数字的 url 加载 html 页面。该页面包含一行文本，其中有
我对 FS2 很陌生，需要一些有关设计的帮助。我正在尝试设计一个流，它将从底层的 InputStream 中提取 block ，直到结束。这是我尝试过的: import java.io.{File,
我对 FS2 很陌生，需要一些有关设计的帮助。我正在尝试设计一个流，它将从底层的 InputStream 中提取 block ，直到结束。这是我尝试过的: import java.io.{File,
我正在编写一个 ajax 应用程序，并且在 php 脚本中有一个函数: public function expire_user() { $r=array("return"=>'OK');
我正在使用一个QListView，它包装了一个非常简单的列表模型。我想尝试实现类似于某些网页中看到的“无限滚动”的东西。 目前，模型通过最多添加 100 个项目的方法更新(它们取自外部 Web API
运行 cucumber 测试给我以下错误 end of file reached (EOFError) /usr/lib64/ruby/2.0.0/net/protocol.rb:153:in
按照目前的情况，这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持，但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the
我想知道版本命名的具体作用是什么？ 喜欢 jquery.js?ver=1.4.4 我的意思是如果我使用像这样的 cdn jquery/1.4.4/jquery.min.js?ver=1.4.4但是另一
" data-fancybox-group="gallery" title="">" alt="" /> 在此代码中 echo $prod['item_image_url'];打印存储在我的表中的图像
我目前使用 Wordpress 作为博客平台，但我想更改为使用 Jekyll 来生成静态页面。在 WordPress 上，我的 URL 使用以下格式: /年/月/日/标题 但我想将其重定向到 /年/月
根据docs这应该是不可能的 Regular expressions cannot be anchored to the beginning or end of a token 尽管如此，它似乎对我有
有没有办法创建 dijit 并将其附加到 div 的末尾？假设我有以下代码: Add Person 我在网上找到了以下代码，但这替换了我的“attendants”div: var personCo
我有这段代码: //execute post (the result will be something like {"result":1,"error":"","id":"4da775
我需要一些函数方面的帮助。 我想编写一个插入链表的函数。但不仅仅是中间，如果必须插入前端或末尾，它也必须起作用。 结构: typedef struct ranklist { i
我是一名优秀的程序员,十分优秀！