La propiedad background-attachment en CSS se usa para especificar el tipo de archivo adjunto de la imagen de fondo con respecto a su contenedor. Se puede configurar para que se desplace o permanezca fijo. Se puede aplicar a todos los elementos HTML.
Sintaxis:
background-attachment: scroll|fixed|local|initial|inherit;
Valor por defecto de la propiedad:
scroll: Establece que la imagen de fondo quede fija en su posición con respecto al elemento contenedor y se desplace con la página. Es el valor predeterminado.
- Sintaxis:
background-attachment: scroll;
- Ejemplo:
html
<!DOCTYPE html>
<
html
>
<
head
>
<
title
>
background-attachment property
</
title
>
<
style
>
#example {
background-image:
background-position: center;
background-repeat: no-repeat;
background-attachment: scroll;
}
</
style
>
</
head
>
<
body
style
=
"text-align:center"
>
<
h1
>GeeksforGeeks</
h1
>
<
h2
> background-attachment: scroll;</
h2
><
br
><
br
>
<
div
id
=
"example"
>
<
p
>
Prepare for the Recruitment drive of product
based companies like Microsoft, Amazon,
Adobe etc with a free online placement
preparation course. The course focuses on
various MCQ's & Coding question likely to
be asked in the interviews & make your
upcoming placement season efficient and
successful.
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
This course is especially designed for the
Java apprentices who want to hone their
skills in Java for Coding Interviews and
Competitive Programming. No matter if you
are a school student or college student,
if you have the zeal of programming, this
is the right time to start.
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
Prepare for the Recruitment drive of product
based companies like Microsoft, Amazon,
Adobe etc with a free online placement
preparation course. The course focuses on
various MCQ's & Coding question likely to
be asked in the interviews & make your
upcoming placement season efficient and
successful
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
This course is especially designed for the
Java apprentices who want to hone their
skills in Java for Coding Interviews and
Competitive Programming. No matter if you
are a school student or college student,
if you have the zeal of programming, this
is the right time to start.
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
Prepare for the Recruitment drive of product
based companies like Microsoft, Amazon,
Adobe etc with a free online placement
preparation course. The course focuses on
various MCQ's & Coding question likely to
be asked in the interviews & make your
upcoming placement season efficient and
successful
</
p
>
</
div
>
</
body
>
</
html
>
- Producción:
fixed: esta propiedad se utiliza para establecer la imagen de fondo fija en su posición con respecto a la ventana gráfica.
- Sintaxis:
background-attachment: fixed;
- Ejemplo:
html
<!DOCTYPE html>
<
html
>
<
head
>
<
title
>
background-attachment property
</
title
>
<
style
>
#example {
background-image:
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
}
</
style
>
</
head
>
<
body
style
=
"text-align:center"
>
<
h1
>GeeksforGeeks</
h1
>
<
h2
> background-attachment: fixed;</
h2
><
br
><
br
>
<
div
id
=
"example"
>
<
p
>
Prepare for the Recruitment drive of product
based companies like Microsoft, Amazon,
Adobe etc with a free online placement
preparation course. The course focuses on
various MCQ's & Coding question likely to
be asked in the interviews & make your
upcoming placement season efficient and
successful.
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
This course is especially designed for the
Java apprentices who want to hone their
skills in Java for Coding Interviews and
Competitive Programming. No matter if you
are a school student or college student,
if you have the zeal of programming, this
is the right time to start.
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
Prepare for the Recruitment drive of product
based companies like Microsoft, Amazon,
Adobe etc with a free online placement
preparation course. The course focuses on
various MCQ's & Coding question likely to
be asked in the interviews & make your
upcoming placement season efficient and
successful
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
This course is especially designed for the
Java apprentices who want to hone their
skills in Java for Coding Interviews and
Competitive Programming. No matter if you
are a school student or college student,
if you have the zeal of programming, this
is the right time to start.
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
Prepare for the Recruitment drive of product
based companies like Microsoft, Amazon,
Adobe etc with a free online placement
preparation course. The course focuses on
various MCQ's & Coding question likely to
be asked in the interviews & make your
upcoming placement season efficient and
successful
</
p
>
</
div
>
</
body
>
</
html
>
- Producción:
local: esta propiedad se usa para configurar la imagen de fondo para que se desplace junto con el contenido de su elemento contenedor en lugar de la página.
- Sintaxis:
background-attachment: local;
- Ejemplo:
html
<!DOCTYPE html>
<
html
>
<
head
>
<
title
>
background-attachment property
</
title
>
<
style
>
#example {
background-image:
background-position: center;
background-repeat: no-repeat;
background-attachment: local;
}
</
style
>
</
head
>
<
body
style
=
"text-align:center"
>
<
h1
>GeeksforGeeks</
h1
>
<
h2
> background-attachment: local;</
h2
><
br
><
br
>
<
div
id
=
"example"
>
<
p
>
Prepare for the Recruitment drive of product
based companies like Microsoft, Amazon,
Adobe etc with a free online placement
preparation course. The course focuses on
various MCQ's & Coding question likely to
be asked in the interviews & make your
upcoming placement season efficient and
successful.
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
This course is especially designed for the
Java apprentices who want to hone their
skills in Java for Coding Interviews and
Competitive Programming. No matter if you
are a school student or college student,
if you have the zeal of programming, this
is the right time to start.
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
Prepare for the Recruitment drive of product
based companies like Microsoft, Amazon,
Adobe etc with a free online placement
preparation course. The course focuses on
various MCQ's & Coding question likely to
be asked in the interviews & make your
upcoming placement season efficient and
successful
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
This course is especially designed for the
Java apprentices who want to hone their
skills in Java for Coding Interviews and
Competitive Programming. No matter if you
are a school student or college student,
if you have the zeal of programming, this
is the right time to start.
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
Prepare for the Recruitment drive of product
based companies like Microsoft, Amazon,
Adobe etc with a free online placement
preparation course. The course focuses on
various MCQ's & Coding question likely to
be asked in the interviews & make your
upcoming placement season efficient and
successful
</
p
>
</
div
>
</
body
>
</
html
>
- Producción:
initial: se utiliza para establecer la propiedad de archivo adjunto de fondo en su valor predeterminado.
- Sintaxis:
background-attachment: initial;
- Ejemplo:
html
<!DOCTYPE html>
<
html
>
<
head
>
<
title
>
background-attachment property
</
title
>
<
style
>
#example {
background-image:
background-position: center;
background-repeat: no-repeat;
background-attachment: initial;
}
</
style
>
</
head
>
<
body
style
=
"text-align:center"
>
<
h1
>GeeksforGeeks</
h1
>
<
h2
> background-attachment: initial;</
h2
><
br
><
br
>
<
div
id
=
"example"
>
<
p
>
Prepare for the Recruitment drive of product
based companies like Microsoft, Amazon,
Adobe etc with a free online placement
preparation course. The course focuses on
various MCQ's & Coding question likely to
be asked in the interviews & make your
upcoming placement season efficient and
successful.
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
This course is especially designed for the
Java apprentices who want to hone their
skills in Java for Coding Interviews and
Competitive Programming. No matter if you
are a school student or college student,
if you have the zeal of programming, this
is the right time to start.
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
Prepare for the Recruitment drive of product
based companies like Microsoft, Amazon,
Adobe etc with a free online placement
preparation course. The course focuses on
various MCQ's & Coding question likely to
be asked in the interviews & make your
upcoming placement season efficient and
successful
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
This course is especially designed for the
Java apprentices who want to hone their
skills in Java for Coding Interviews and
Competitive Programming. No matter if you
are a school student or college student,
if you have the zeal of programming, this
is the right time to start.
</
p
>
<
br
>
<
br
>
<
br
>
<
p
>
Prepare for the Recruitment drive of product
based companies like Microsoft, Amazon,
Adobe etc with a free online placement
preparation course. The course focuses on
various MCQ's & Coding question likely to
be asked in the interviews & make your
upcoming placement season efficient and
successful
</
p
>
</
div
>
</
body
>
</
html
>
- Producción:
heredar: Se utiliza para establecer la propiedad de su elemento padre.
Navegadores admitidos: los navegadores admitidos por la propiedad background-attachment se enumeran a continuación:
- Google Chrome 1.0
- Internet Explorer 4.0
- Firefox 1.0
- Ópera 3.5
- Safari 1.0
Publicación traducida automáticamente
Artículo escrito por Archana choudhary y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA