CSS
 Computer >> コンピューター >  >> プログラミング >> CSS

CSSで背景画像のサイズを指定する

CSSのbackground-sizeプロパティは、背景画像のサイズを指定するために使用されます。次のコードを実行して、background-image-

を実装してみてください。 例 

<html>
   <head>

      <style>
         #demo {
            border: 5px dashed green;
            padding: 10px;
            background-image: url("https://www.tutorialspoint.com/css/images/css-mini-logo.jpg");
            background-size: 200px 100px;
         }
      </style>

   </head>
   <body>

      <div id="demo">
         <h1>www.tutorialspoint.com</h1>
         <p>The website www.tutorialspoint.com is owned and maintained by Tutorials Point India Private Limited,
            henceforth termed as “we”, “our”, “us”, or the “company”. All the visitors, users, learners, contributors,
            teachers, and instructors are named as "users"; and the website tutorialspoint.com is termed as "website" everywhere in this document.
            We are committed to protecting your privacy online. This privacy policy explains what information we collect from you
            or what information you share with us when you visit the website. We review our policy from time to time, so you are advised to check the latest version.</p>
      </div>
   </body>
</html>

  1. CSSを使用して背景画像として放射状グラデーションを設定します

    Radial-gradient（）CSS関数を使用して、背景画像として放射状グラデーションを設定します。次のコードを実行して、CSSでlinear-gradient（）関数を実装してみてください 例 <!DOCTYPE html> <html>    <head>       <style>          #demo {             height: 200px;  

  2. CSSを使用してスクロールの背景画像を変更するにはどうすればよいですか？

    以下は、CSSを使用してスクロールするときに背景画像を変更するコードです- 例 <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1> <style> body, html {    height: 100%;    margin: 0;    font-family: Arial, Helvetica, s