為什么檢查代碼跟老師的完全一樣，每張圖片的效果不是全屏呢？
效果：
代碼：
<!DOCTYPE?html>
<html>
<head>
????<meta?charset="UTF-8">
????<title>全屏切換效果Demo</title>
????<style?type="text/css">
????*?{
????????padding:?0;
????????margin:?0;
????}
????
????html,
????body?{
????????height:?100%;
????}
????
????#container,
????.sections,
????.section,
????{
????????height:?100%;
????}
????
????#section0,
????#section1,
????#section2,
????#section3?{
????????background-color:?#000;
????????-webkit-background-size:?cover;
????????background-size:?cover;
????????background-position:?50%?50%;
????????text-align:?center;
????????color:?white;
????}
????
????#section0?{
????????background-image:?url(images/1.jpg);
????}
????
????#section1?{
????????background-image:?url(images/2.jpg);
????}
????
????#section2?{
????????background-image:?url(images/3.jpg);
????}
????
????#section3?{
????????background-image:?url(images/4.jpg);
????}
????</style>
</head>
<body>
????<div?id="container">
????????<div?class="sections">
????????????<div?class="section"?id="section0">
????????????????<h2>This?is?a?page!</h2>
????????????</div>
????????????<div?class="section"?id="section1">
????????????????<h2>This?is?a?page!</h2>
????????????</div>
????????????<div?class="section"?id="section2">
????????????????<h2>This?is?a?page!</h2>
????????????</div>
????????????<div?class="section"?id="section3">
????????????????<h2>This?is?a?page!</h2>
????????????</div>
????????</div>
????</div>
</body>
</html>
2016-01-14
看圖說明
看圖說明，你在樣式那里多寫了一個逗號，然后就沒有然后了，這個樣式沒有生效。
看圖說明，你在樣式那里多寫了一個逗號，然后就沒有然后了，這個樣式沒有生效。
看圖說明，你在樣式那里多寫了一個逗號，然后就沒有然后了，這個樣式沒有生效。
（重要的事情說三遍。。。）
下圖是用 chrome 看的調試信息
錯誤的時候 chrome 是這么的：
正確的時候 chrome 是這么的：
2016-01-05
要是背景圖的話，就必須指定高度，不然就讓其子元素來撐高度，要是不用背景圖用<img>標簽的話就可以
2016-01-03
定義了.sections,.section{height:100%;},但是html中沒有引用，所以每個模塊的高度是自身內容撐開的高度，不是100%。
2016-01-03
沒有CLASS ?要定義CLASS
2016-01-03
你的session和sessions在哪(⊙o⊙)…