百度首頁是使用div css布局設計的,其代碼如下:
其中,<div>
標簽的id值和class值用于控制樣式,例如:
#head { width: 1020px; height: 80px; margin: 0 auto; padding-top: 35px; }
上面的CSS代碼定義了百度首頁頂部的logo和搜索框的寬度、高度、居中方式和上內邊距。
此外,首頁的樣式表中還包含了很多具體元素的樣式控制,例如倒三角、搜索按鈕和菜單欄等:
/*搜索按鈕*/ #s_btn_wr { display: inline-block; height: 30px; border-radius: 2px; border: none; background-color: #3385ff; color: #fff; font-size: 14px; font-weight: bold; text-align: center; line-height: 30px; cursor: pointer; vertical-align: top; margin-left: -1px; }
總的來說,百度首頁采用的div css布局方式非常清晰明了,其樣式命名合理、結構層次分明,是一個非常好的CSS實踐案例。