Full Background Image

Full Background Image code:

1.index.html:

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Full Background Image</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="content"> <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Reprehenderit ut odit molestias tempora numquam, ducimus, modi provident distinctio illo, commodi architecto adipisci perspiciatis! Aliquam accusantium nulla recusandae delectus iusto et!</p> <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Reprehenderit ut odit molestias tempora numquam, ducimus, modi provident distinctio illo, commodi architecto adipisci perspiciatis! Aliquam accusantium nulla recusandae delectus iusto et!</p> <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Reprehenderit ut odit molestias tempora numquam, ducimus, modi provident distinctio illo, commodi architecto adipisci perspiciatis! Aliquam accusantium nulla recusandae delectus iusto et!</p> <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Reprehenderit ut odit molestias tempora numquam, ducimus, modi provident distinctio illo, commodi architecto adipisci perspiciatis! Aliquam accusantium nulla recusandae delectus iusto et!</p> <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Reprehenderit ut odit molestias tempora numquam, ducimus, modi provident distinctio illo, commodi architecto adipisci perspiciatis! Aliquam accusantium nulla recusandae delectus iusto et!</p> <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Reprehenderit ut odit molestias tempora numquam, ducimus, modi provident distinctio illo, commodi architecto adipisci perspiciatis! Aliquam accusantium nulla recusandae delectus iusto et!</p> <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Reprehenderit ut odit molestias tempora numquam, ducimus, modi provident distinctio illo, commodi architecto adipisci perspiciatis! Aliquam accusantium nulla recusandae delectus iusto et!</p> <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Reprehenderit ut odit molestias tempora numquam, ducimus, modi provident distinctio illo, commodi architecto adipisci perspiciatis! Aliquam accusantium nulla recusandae delectus iusto et!</p> </div> </body> </html>

2. style.css:

body { background-image: url(image.jpg); background-size: cover; background-attachment: fixed; } .content { background: white; width: 50%; padding: 40px; margin: 100px auto; font-family: Arial, Helvetica, sans-serif; } p { font-size: 25px; color: black; }

Оставьте комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *