web前端 -- Day7基础知识
2019-02-21 本文已影响0人
韩发发吖
img插入图片和背景图片的区别
背景图片只是装饰作用,因此相当于不存在,而img是存在的内容.
两者的优缺点:
1、背景图片:只是修饰作用,控制更方便,有定位,所以小图标一般都是用背景图片。
2、img图片:具有语义,可以被搜索引擎抓取,因此重要的图片建议用img插入图片。
行内元素的垂直间距
行内元素的本质就是一个字,所以它们的垂直间距是不受padding和margin影响的,行内元素的垂直间距只受行高影响。
浮动塌陷
因为浮动了的元素脱离标准流,一次在一个没有指定高度的盒子中,它内部的元素浮动之后,会导致这个父级盒子没有高度,这种情况称之为浮动塌陷;
解决方法:给塌陷的盒子添加overflow:hidden;
注意事项:浮动塌陷是在盒子没有指定高度的时候出现。
css书写的位置
css可以写在网页中不同的位置,包括有:内嵌式、链接式、行内式。
1、内嵌式
内嵌式指的是将css代码写在头部的style标签内。
2、链接式
链接式指的是将css代码写在一个单独的css文件中,然后在网页头部中通过link标签将css文件引入即可使用;
link标签的基本结构:<link rel=“stylesheet” type=“text/css” href=“css/style.css” />
link标签三属性:rel 表示与链接对象的关系 ;type 表示链接对象的类型; href表示链接对象的相对路径;
3、内嵌式
行内式指的是将css代码写在标签的style属性里面,它相当于直接在标签身上写css,因此权重最高,也是最不推荐的一种书写方式。
例如:<div style=“color:red;”>...</div>