Биеийн арын зургийг хялбархан хийсэн

Олон сайт дээрээс олох боломжтой сайхан шинж чанар бол төвийн агуулгын хэсэг нь хуудсыг цаана нь сүүдэртэй бүрхсэн харагдана. Энэ нь үнэн хэрэгтээ таны блогийг (эсвэл бусад вэбсайт) нэг дэвсгэр зурагтай сайхан харагдуулах нэлээд энгийн арга юм.

Яаж хийдэг юм бэ?

1. Таны агуулга хэр өргөн байгааг тодорхойл. Жишээ: 750px.
2. Зургийн аппликешнд (би Illustrator ашигладаг) дүрсийг агуулгын талбайн хэмжээнээс илүү өргөнөөр бүтээх боломжтой. Жишээ: 800px.
3. Блогын хоёр тал дээр зургийнхаа арын дэвсгэрийг хүссэн дэвсгэр дээрээ тохируулна уу.
4. Арын дэвсгэр дээр цагаан бүс нэмнэ үү.
5. Бүс нутгийн аль аль талаас нь гадагшлуулах цагаан бүсэд сүүдэр тавиарай.
6. Таримлын талбайн өргөнийг 1 пикселээр өндөрт тохируулна уу. Энэ нь дүрсийг хурдан буулгахын тулд аятайхан, авсаархан татаж авах боломжийг олгоно.
7. Зургийг гаргана уу.

Би үүнийг Illustrator ашиглан хэрхэн бүтээсэн тухай (миний тариалангийн талбай илүү өндөр байгааг анхаарна уу ... энэ нь миний хийж байгаа зүйлийг харах боломжийг танд олгоно):

Гаралт нь арын дэвсгэр зурагтай хэрхэн харагдахыг харуулсан жишээ энд байна.

Биеийн хэв маягийн шошгыг ашиглан зургийг хэрхэн яаж ашиглахыг энд харуулав CSS файл.

дэвсгэр: # B2B2B2 url ('images / bg.gif') давтан y төв;

Арын хэв маягийн шошгыг задлах:

• #B2B2B2 - хуудасны ерөнхий дэвсгэр өнгийг тохируулна. Энэ жишээнд арын зурган дээрх саарал өнгөтэй таарах нь саарал байна.
• url ('images / bg.gif') - ашиглахыг хүсч буй дэвсгэр зургийг тохируулна.
• давтан-у - y тэнхлэг дээр давтахаар дүрсийг тохируулна. Тиймээс арын зураг нь хуудасны дээрээс доош хүртэл давтагдах болно.
• төв - зургийг хуудасны төвд байрлуулна.

Сайхан бөгөөд хялбар ... нэг зураг, нэг загварын шошго!