css样式在html中的三种使用方法
3,css引入方式有哪些,常应用哪里?不同引入方式的优势与劣势有哪些?
3,css引入方式有哪些,常应用哪里?不同引入方式的优势与劣势有哪些?
常用的三种:1、页面中引入样式表文件,在单独的样式表css文件中编写样式代码,引入方式如下:然后在style.css文件中编写样式。这种最常用,优点是方便管理,样式统一,代码精简,用于全站统一样式。2、在Html头部(head)中用包起来,在这里面编写样式代码,如下:这种一般用于单页面或单独的专题页面,如果用于全站,增加页面代码,浪费流量,也不利于改版。3、在标签里面直接编写行内样式,这种是最不常用的:
这类最少用,会使页面结构混乱,代码臃肿,后期维护成本增加。
css如何使div背景图片填充?
css使div背景图片填充的具体操作步骤如下:
1、我们首先打开前端开发工具,新建一个html代码页面。
2、在html代码页面上创建一个用于设置背景颜色的div标签,然后给这个标签添加上class bg-img。
3、设置背景图片,创建style标签,然后在标签里面对类为bg-img设置背景图片、图片不重复、宽、高的样式。
4、保存html代码,使用浏览器打开,这个时候会发现浏览器上的背景图片显示在左上角。
5、回到html代码页面,在bg-img类里添加background-position: center的属性。
6、保存html代码后重新刷新浏览器,这个时候会发现浏览器上的背景图片已经自动居中了。
css按照定义位置可分为哪几种?
css定位有四种不同类型,position值分别为:static(静态定位), relative(相对定位),absolute(绝对定位),fixed(固定定位)。下面本篇文章就来给大家介绍一下,希望对大家有所帮助。
1、relative(相对定位)
相对定位的偏移参考元素是元素本身,不会使元素脱离文档流。元素的初始位置占据的空间会被保留。相对定位元素常常作为绝对定位元素的父元素。并且定位元素经常与z-index属性进行层次分级
2、absolute(绝对定位)
绝对定位元素以父辈元素中最近的定位元素为参考坐标,如果绝对定位元素的父辈元素中没有采用定位的,那么此绝对定位元素的参考对象是html,元素会脱离文档流。就好像文档流中被删除了一样。并且定位元素经常与z-index属性进行层次分级
3、fixed(固定定位)
位移的参考坐标是可视窗口,使用fixed的元素脱离文档流。并且定位元素经常与z-index属性进行层次分级
4、static (静态定位)
默认值,元素框正常生成的,top left bottom right这几个偏移属性不会影响其静态定位的正常显示