GoGoRobot: 10月 2020

2020年10月29日星期四

2020年10月27日星期二

[Web]Part-1-Ch1-2

1.新增如下結構

2.在css資料夾裡新增下面兩個檔案

3.編輯index.html

<!DOCTYPE html>

<head>

</head>

<body>

</body>

</html>

效果

4.編輯index.html

<!DOCTYPE html>

<head>

</head>

<body>

</header>

</main>

</div>

</footer>

</body>

</html>

5. index.html

<!DOCTYPE html>

<head>

</head>

<body>

</header>

</main>

</div>

</footer>

</body>

</html>

6. style.css

.header{

width: 100%;

}

.wrapper{

width: 970px;

margin: 30px auto 40px;

}

.main{

display: block;

float: left;

width: 660px;

}

.sidemenu{

float: right;

width: 275px;

}

.footer{

width: 100%;

}

.header, .main, .sidemenu, .footer{

border: 1px solid #aaa;

background-color:#ccc;

}

.header, .footer{

height: 100px;

}

.main, .sidemenu{

height: 500px;

}

.clearfix::after{

content: '';

display: block;

clear: both;

background-color:lightgreen;

}

=============

注意:

.clearfix::after{

content: ''; <---''是兩個單引號而非一個"雙引號

display: block;

clear: both;

background-color:lightgreen;

}

=============

GoGoRobot

2020年10月29日星期四

[Web]CSS html編輯器

Brackets - 免費的編輯網頁必備神器

Thimble by Mozilla 線上程式碼編輯器，讓你輕鬆學習編寫 HTML、CSS 和 JavaScript

[Web]Part-1-Ch2

2020年10月27日星期二

[Web]Part-1-Ch1-2

[Sensor]MPU92/65

總網頁瀏覽量

2020年10月29日 星期四

[Web]CSS html編輯器

Brackets - 免費的編輯網頁必備神器

Thimble by Mozilla 線上程式碼編輯器，讓你輕鬆學習編寫 HTML、CSS 和 JavaScript

[Web]Part-1-Ch2

2020年10月27日 星期二

[Web]Part-1-Ch1-2

[Sensor]MPU92/65

2020年10月29日星期四

2020年10月27日星期二