@ 2020.5.14 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <tit ...
@ 2020.5.14
如何快速搭建一個博客園風格的界面？只需兩個文件，很多行代碼就可搞定噢
下麵帶你一起來山寨DIY吧
1、思路
html
1、新建html 文件，用註釋標註代碼塊
2、先用 div 劃定區域——左欄 右欄
3、使用html 占位，再調節樣式
為標簽添加 id / class 屬性
CSS
1、新建CSS文件，使用註釋標註區域
2、先寫萬金油
3、按照html 的劃分，逐一添加樣式（選擇器的使用，從基礎選擇器到複雜選擇器）
4、調試運行，修改樣式
2、實現效果
3、具體代碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>welcomeTo大誠小鋪</title> <link rel="stylesheet" href="博客園樣式.css"> </head> <body> <!-- 先用div劃分佈局 --> <!-- 左側欄 --> <div class="blog-left"> <!-- 頭像 --> <div class="blog-image"> <img src="鳶尾花.jpg" alt="鳶尾花呀鳶尾花"> </div> <div class="blog-title"> <p>
