Skip to main content

How to start learning Web-development

Post a Comment

Tutorial 6 background in css

 CSS Component explanation -

NOTE - for more about this go to our youtube channel link
1. Background in css -

background property used for changes in background and how we change simple background color and background images many more 

syntax - 

background-color : red;

in given below we explain you background property through html code 

code - 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Background in CSS</title>
<style>
/* bacground property */
.container{
background-color: blue;
}
.container1{
background-image: url('img/image_name.jpg'); /*when you enter image cover background*/
}
.container2{
background-color: blue;
opacity: 0.6;
}
</style>
</head>
<body>
<p class="container">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Error minus saepe a perspiciatis quo tenetur voluptates consequatur dolorem blanditiis aliquam, voluptatem iste! Veniam eveniet fugit suscipit nihil distinctio odit? Beatae. Lorem ipsum dolor sit amet consectetur adipisicing elit. Earum iure beatae doloremque cum accusamus reiciendis, unde possimus dolores id cumque quia officia iusto maiores maxime laudantium minus tempora reprehenderit? Quibusdam?Earum iure beatae doloremque cum accusamus reiciendis, unde possimus dolores id cumque quia officia iusto maiores maxime laudantium minus tempora reprehenderit? Quibusdam?
</p>
<p class="container1">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Error minus saepe a perspiciatis quo tenetur voluptates consequatur dolorem blanditiis aliquam, voluptatem iste! Veniam eveniet fugit suscipit nihil distinctio odit? Beatae. Lorem ipsum dolor sit amet consectetur adipisicing elit. Earum iure beatae doloremque cum accusamus reiciendis, unde possimus dolores id cumque quia officia iusto maiores maxime laudantium minus tempora reprehenderit? Quibusdam?
</p>
<p class="container2">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Error minus saepe a perspiciatis quo tenetur voluptates consequatur dolorem blanditiis aliquam, voluptatem iste! Veniam eveniet fugit suscipit nihil distinctio odit? Beatae. Lorem ipsum dolor sit amet consectetur adipisicing elit. Earum iure beatae doloremque cum accusamus reiciendis, unde possimus dolores id cumque quia officia iusto maiores maxime laudantium minus tempora reprehenderit? Quibusdam? Earum iure beatae doloremque cum accusamus reiciendis, unde possimus dolores id cumque quia officia iusto maiores maxime laudantium minus tempora reprehenderit? Quibusdam
</p>
</body>
</html>

Live server (on browser) -

Lorem ipsum dolor sit amet consectetur adipisicing elit. Error minus saepe a perspiciatis quo tenetur voluptates consequatur dolorem blanditiis aliquam, voluptatem iste! Veniam eveniet fugit suscipit nihil distinctio odit? Beatae. Lorem ipsum dolor sit amet consectetur adipisicing elit. Earum iure beatae doloremque cum accusamus reiciendis, unde possimus dolores id cumque quia officia iusto maiores maxime laudantium minus tempora reprehenderit? Quibusdam?

Lorem ipsum dolor sit amet consectetur adipisicing elit. Error minus saepe a perspiciatis quo tenetur voluptates consequatur dolorem blanditiis aliquam, voluptatem iste! Veniam eveniet fugit suscipit nihil distinctio odit? Beatae. Lorem ipsum dolor sit amet consectetur adipisicing elit. Earum iure beatae doloremque cum accusamus reiciendis, unde possimus dolores id cumque quia officia iusto maiores maxime laudantium minus tempora reprehenderit? Quibusdam?

Lorem ipsum dolor sit amet consectetur adipisicing elit. Error minus saepe a perspiciatis quo tenetur voluptates consequatur dolorem blanditiis aliquam, voluptatem iste! Veniam eveniet fugit suscipit nihil distinctio odit? Beatae. Lorem ipsum dolor sit amet consectetur adipisicing elit. Earum iure beatae doloremque cum accusamus reiciendis, unde possimus dolores id cumque quia officia iusto maiores maxime laudantium minus tempora reprehenderit? Quibusdam?

Comments

Post a Comment

Popular posts from this blog

Funcation in c++ programming example in detail

Friend Funcation- 1. Adding to complex number in friend function #include<iostream> using namespace std; class container { float a,b; public: void get() { cout<<endl<<"Enter value for A="; cin>>a; cout<<endl<<"Enter value for B="; cin>>b; } void disp() { cout<<endl<<a; cout<<endl<<b; } friend container addition(container,container); }; container addition(container X,container y) { container Z; Z.a=X.a+y.a; Z.b=X.b+y.b; return Z; } int main() { container P,Q,R; P.get(); P.disp(); Q.get(); Q.disp(); R=addition(P,Q); R.disp(); return 0; } Output - Enter value for A=12 Enter value for B=12 12 12 Enter value for A=1 Enter value for B=1 1 1 13 13 2.  If class one is friend function of two it not means that two is friend functio...
1 comment
Read more

Tutorial 13 Visibility property

 Properties of css - 1. Visibility property in css -     In this property element will can visible or hidden by using this property so let say we take a paragarph tag and write some content on it if we use visibility property so we can hide the element but the space of element in web page are left there and no other element take that space so this is it  syntax -   visibility :  visible ;     visibility :hidden ; Code - <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Visiblity in css </title> <style> /* visibility property */ .visible{ visibility: visible; } .hidden{ visibility: hidden; } </style> </head> <body> <h1...
Post a Comment
Read more

C++ programming tutorial 3

 Control statement in c++ programming - 1. For loop statement in c++ programming -  In this loops we run a single part of code many times this used for simple our programming and in less code , time work done is same . Syntax - for(int i =0; i< x ; i++){ ..... } Code -  // For loop in c++ language  #include <iostream> using   namespace  std; int   main () {      int   i  ,  a ;      cout << "Loop was start Below " << endl ;      cout << "Enter the value of a:" << endl ;      cin >> a ;      for ( i = 0 ; i <= a ; i ++ )     {          cout <<   "this is a number count :" <<   i << endl ;     }  ...
Post a Comment
Read more