HTML,DIV+CSS,js,JQ,UI-WEB前端设计阅历 @ hnyei 下意

[db:作者] 2018-11-26人浏览过

  我们在做网页的时分,当背景是壹张完整顿的图片,不触动让其遂从滚触动条滚触动,怎么办?下面详细说皓壹下。

  CSS代码示例-背景色属性(background-color):

  演示结实: 此雕刻个HTML运用了CSS的background-color属性,将HTML的背景色成了英公翠绿色。

  CSS代码示例-背景图片属性(background-image):

  演示结实: 此雕刻个HTML运用了CSS的background-image属性,设置了背景图片。

  CSS代码示例- 背景重骈属性(background-repeat)

  演示结实: 此雕刻个HTML运用了CSS的background-repeat属性,使背景图片壹竖向重骈。 日用的background-repeat的属性值拥有: repeat-x(左右向重骈),repeat-x(左右向重骈), no-repeat(不重骈)。 background-repeat属性要和background-image壹道用。

  CSS代码示例-背景附着属性(background-attachment)-[背景图永恒不触动,不遂从滚触动条滚触动]:

  演示结实: 此雕刻个HTML运用了CSS的 background-attachment 属性,将背景图片永恒,不遂情节滚触动而滚触动。

  背景附着(background-attachment)属性拥有两个值。壹个是scroll,体即兴遂情节滚触动而触动;壹个是fixed,体即兴永恒不触动,不受情节滚触动影响。缺节值是scroll。

  background-attachment要和background-image壹道用。

  此雕刻个HTML运用了CSS的background-attachment属性,将背景图片永恒,不遂情节滚触动而滚触动。

  背景附着(background-attachment)属性拥有两个值。壹个是scroll,体即兴遂情节滚触动而触动;壹个是fixed,体即兴永恒不触动,不受情节滚触动影响。缺节值是scroll。

  CSS代码示例-背景位置属性(background-position):

  演示结实: 此雕刻个HTML运用了CSS的background-position属性。此雕刻个属性和background-image属性包在壹道运用,决议了背景图片的最末位置。

  下面的代码体即兴背景图片的初始位置距退网页最左面20px,距退网页最下面60px。

  CSS代码示例-背景属性(background):

  演示结实: 此雕刻个属性是设置背景相干属性的壹种快捷的概括写法, 带拥有background-color, background-image, background-repeat, backgroundattachment, background-position。

  此雕刻个HTML所用的背景属性体即兴,网页的背景色是翠绿色,背景图片是background.jpg图片,背景图片不重骈露示,背景图片不遂情节滚触动而触动,背景图片距退网页最左面40px,距退网页最下面100px。

  此雕刻个属性是设置背景相干属性的壹种快捷的概括写法, 带拥有background-color, background-image, background-repeat, backgroundattachment, background-position。