在黑马学习了一段时间感觉收获的不是一般般的多,从ps知识到HTML在到css ,从一个什么都不懂的小白到现在可以独立完成一些简单的网页的小学生,感觉自己也是收获的蛮多,虽然有时候会学成蚊香眼,但也是扎扎实实的学到了些知识的,今天这篇小贴贴就分享一下学到的一些常用小知识点总结。
一.基础的HTML各类标签:
双标签:(h,p,b,i,u,s,等)
单标签:(br,hr,等)
布局标签(div,span,等)
二.基础的HTML表格属性:
border 设置表格边框在table内使用
width 宽
heoght 高
align="center" 表格水平居中
cellpadding 设置字和边框的距离
cellspacing 单元格和单元格之间边框距离(常设0)
三.基础的css标签显示模式:
1.常见块级元素标签
(div ,h1-h6 ,p ,ul ,li ,dl ,dt ,dd)
2.常见行内元素标签:
(sapn,a,i,em)
3.常见行内块元素标签:
(input,img)
4.三种属性之间的转换:
行内元素转换块级元素:display:block;
块级元素转换为行内元素:display:inline
转换为行内块:display:inline-block;
四.清除浮动推荐方法:
.clearfix:after {
content: "";
display: block;
height: 0;
visibility: hidden;
clear: both;
}
.clearfix {
*zoom: 1; /*ie6,7 专门清除浮动的样式*/
}
五.veryical-align垂直对齐
只针对行内a,span,行内块元素input
veryical-align :baseline;(文字基线对齐,默认右下底部对齐)
veryical-align :middle;(默认文字,图片中线居中对齐)
veryical-align :top;(图片顶部与文字顶部形成顶部对齐)
问题:图片与盒子因为默认是基线对齐,所以底部会留白
解决方法:采用底部或中线对齐或顶部对齐就可以
(建议使用veryical-align :middle;)
*img {
veryical-align :middle;
} |
|