旗下导航:搜·么
当前位置:网站首页 > CSS > 正文

css怎样用id举行定位【css教程】

作者:搜搜PHP网发布时间:2019-11-26分类:CSS浏览:90


导读:id挑选器可认为标有特定id的HTML元素指定特定的款式。id挑选器以"#"来定义。下面的两个id挑选器,第一个能够定义元素的色彩为赤色,第二个定义元素...
id 挑选器可认为标有特定 id 的 HTML 元素指定特定的款式。

id 挑选器以 "#" 来定义。下面的两个 id 挑选器,第一个能够定义元素的色彩为赤色,第二个定义元素的色彩为绿色:

#red {color:red;}
#green {color:green;}

下面的 HTML 代码中,id 属性为 red 的 p 元素显现为赤色,而 id 属性为 green 的 p 元素显现为绿色。

<p id="red">这个段落是赤色。</p>
<p id="green">这个段落是绿色。</p>

注重:id 属性只能在每一个 HTML 文档中涌现一次。

CSS 为定位和浮动供应了一些属性,应用这些属性,能够竖立列式规划,将规划的一部份与另一部份堆叠,还能够完成多年来一般须要运用多个表格才完成的使命。

定位的基础思想很简单,它许可你定义元素框相对于其一般位置应当涌现的位置,或许相对于父元素、另一个元素以至浏览器窗口自身的位置。明显,这个功用异常壮大,也很让人受惊。要知道,用户代办对 CSS2 中定位的支撑远胜于对别的方面的支撑,对此不该觉得新鲜。

CSS 定位机制

CSS 有三种基础的定位机制:普通流、浮动和相对定位。

除非特地指定,不然一切框都在普通流中定位。也就是说,普通流中的元素的位置由元素在 (X)HTML 中的位置决议。

块级框从上到下一个接一个地分列,框之间的垂直间隔是由框的垂直外边距计算出来。

行内框在一行中程度安排。能够运用程度内边距、边框和外边距调解它们的间距。然则,垂直内边距、边框和外边距不影响行内框的高度。由一行构成的程度框称为行框(Line Box),行框的高度老是足以包容它包括的一切行内框。不过,设置行高能够增添这个框的高度。

CSS position 属性

经由过程运用 position 属性,我们能够挑选 4 种差别范例的定位,这会影响元素框生成的体式格局。

position 属性值的寄义:

static

元素框一般生成。块级元素生成一个矩形框,作为文档流的一部份,行内元素则会建立一个或多个行框,置于其父元素中。

relative

元素框偏移某个间隔。元素仍坚持其未定位前的外形,它底本所占的空间仍保存。

absolute

元素框从文档流完整删除,并相对于其包括块定位。包括块多是文档中的另一个元素或许是初始包括块。元素原先在一般文档流中所占的空间会封闭,就好像元素本来不存在一样。元素定位后生成一个块级框,而不管本来它在一般流中生成何种范例的框。

fixed

元素框的表现类似于将 position 设置为 absolute,不过其包括块是视窗自身。

提醒:相对定位实际上被看做普通流定位模子的一部份,由于元素的位置相对于它在普通流中的位置。

以上就是css怎样用id举行定位的细致内容,更多请关注ki4网别的相干文章!

标签:css