html與css學習2
我胡漢三又回來糾結這兩個玩意了。這兩個東西真是越看越有東西,而且真的是,做專案時才知道自己小瞧他們了。
前端:結構(html)+表現(css)+行為(js)
好的程式碼:各自負責各自的,儘量寫規範,別雜糅在一起。
1.html標籤更多關注的是語義,至於樣式css都可以去改
2.元素分為塊元素與內聯元素(span,a,img,iframe)
3.span標籤主要用來給包住文字的,方便設定樣式
4.偽類選擇器:
超連結: a:link(普通) a:hover(滑鼠放上去) a:active(被點選時) a:visited(訪問過)
hover和acitve也可以對其他元素使用
5.選擇器的優先順序:內聯>id>class>元素>*>繼承來的.
6.!important 該樣式獲得無窮大優先順序(儘量別用)
7.設定右下外邊距會改變其他元素的位置,設定左上邊距會改變自身的位置
8.垂直外邊距的重疊:在網頁中,垂直方向的相鄰外邊距,會發生外邊距重疊(取最大值而不是取和)
9.float是一個很有意思的東西,還有文件流的概念,脫離文件流
10.解決高度塌陷的問題:clear最好,在高度塌陷的父元素最後加一個空白的div,設定clear
.box1:after{
content:"",
display:block,
clear:both,
}
也可以直接給父元素:overflow:hidden
11.行高與父元素的高度一樣,就可以垂直居中
12.表格有意思的一段css
table{
width: 200px;
border-collapse: collapse;
}
td{
border:1px solid black;
}
隔行換色:
tr:nth-child(odd){
background-color: aquamarine;
}
tr:hover{
background-color: red;
}