開発環境
- macOS Sierra - Apple (OS)
- Emacs (Text Editor)
- Safari(Web browser)
Head First HTML and CSS (Elisabeth Robson(著)、Eric Freeman(著)、O'Reilly Media)の Chapter 11.(Layout and Positioning: Arranging Elements)、EXERCISE: LOOK MA, NO CSS!(No. 7868) を取り組んでみる。
EXERCISE: LOOK MA, NO CSS!(No. 7868)
-
CSS適用
比較用 -
CSS 非適用
sidebar比較用
HTML5
<!doctype html> <html> <head> <link rel="stylesheet" href="sample4.css"> </head> <body> <ul> <li> <p>CSS適用</p> <div id="div1"> <div id="sidebar0"> sidebar </div> </div> <div id="div0"> 比較用 </div> </li> <li> <p>CSS 非適用</p> <div> <div> sidebar </div> </div> <div> 比較用 </div> </li> </ul> </body> </html>
CSS(Stylesheet)
#sidebar0 { background: #efe5d0; font-size: 105%; padding: 15px; margin: 0px 10px 10px 10px; width: 280px; /* float: right */ } #div0 { width: 330px; background-color: red; text-align: center; }
0 コメント:
コメントを投稿