注:其中的内容只是自己学习时的一些笔记,好记性不如烂笔头,在此记录方便以后巩固!
1、css定位
元素的显示方式:
一、块级元素(上下布局)
1)默认宽度为100%(继承了父元素的宽度),独占一行
2)可以设置宽度、高度
3)块级元素可以包含(嵌套)行内、块内元素
常见的块元素:div、p、ul、li、ol、h1-h6 tr td form table
二、行内元素(左右布局)
1)默认无宽度,多个行内元素显示在一行
2)不能设置宽度和高度(尺寸不起作用)
3)行内元素不能包含块元素,只可嵌套行内元素
常见行内元素:span a i b strong font u
注意:设计时最好把行内元素放在块级元素中
三、行内块元素
显示在一行内,但是可设置宽、高的元素
常见行内块元素:img、input
块级元素和行内元素可以相互转换
display
block: 显示为块
inline: 显示为行内
none: 显示为无 (不显示)(js处理)
用的比较多的是超链接转块元素
四、浮动定位(布局,使多个元素在一行显示)
float:
none:不浮动【默认的方式】
left:左浮动
right:右浮动
inherit:从父元素继承 float 属性的值。
浮动影响的是本元素和紧挨着的后一个元素
在 CSS 中,任何元素都可以浮动。浮动元素会生成一个块级框,而不论它本身是何种元素。浮动的元素要指定一个明确的宽度;否则,它们会尽可能地窄