web前端 -- Day4基础知识

版权声明:本文为原创文章,可转载分享学习,但禁止商用 https://blog.csdn.net/Cituses/article/details/87783733

背景属性

在css中,背景值通过background控制,它也是一个复合属性。
背景图定位坐标的书写方式:
1、方向特殊值:水平位置:left center right ; 垂直位置:top center bottom;
2、具体像素值:例如:100px 20px ,这里可以接受负值。
如果背景图固定模式设置为fixed,可展现背景图固定于屏幕。

background:背景颜色 背景图 平铺方式 水平位置 垂直位置 固定模式;
平铺方式:no-repeat — 不平铺; repeat-x — 横向平铺;   repeat-y — 纵向平铺;
background-color  — 背景颜色
backgroud-image  — 背景图片
backgroud-repeat  — 背景平铺方式
backgroud-postion  — 背景定位

注意事项:应用背景图的标签左上角是坐标原点(0 0)。

选择器

选择器:标签选择器、类选择器、id选择器、通配符*

复合选择器
在css中常用的复合选择器:后代选择器、并集选择器、交集选择器

**后代选择器 **
通过一个空格表示后代管子,通过父级标签找到他的后代标签;例如:.box span{},表示.box里面的span标签

并集选择器
将多个选择器用逗号隔开表示共同选中,作用是一起选中书写样式;例如:h1,div,.box{}

交集选择器(指令式选择器)
通过不同选择器连续书写,表示志玲选择,作用是选中指定的标签;例如:p.box{},表示选中带有box类名的那个p标签

网页布局

任何复杂的网页的都是由标签堆砌而成。网页布局是什么?网页布局就是指标签的不同的排列方式。这些排列方式看起来复杂,其实只有两种,上下垂直排列和左右水平排列;而且水平排列是在垂直排列的基础上进行拆分排列。

浮动布局
float表示浮动属性,它的值left/right(没有center),作用是实现盒子水平排列,要么是左对齐,要么是右对齐。
注意事项:
1、网页布局中,最稳定的排列方式就是块级标签上下垂直排列;
2、在网页布局中保证结构的稳定,同级标签中只能有有一种排列方式,要么是上下垂直排列,要么是左右水平排列。

猜你喜欢

转载自blog.csdn.net/Cituses/article/details/87783733
今日推荐