Skip to main content

Properties with Colors and Backgrounds in CSS

Foreground color: the 'color' property
The color property describes the foreground color of an element.
Sample code is given below copy and try it out...
 
 h1 {
  color: #990099;
 }
 h3{
  color: #999999;
 }
 p {
  color: #990099;
 }
'background-color' property
The background-color property describes the background color of elements.
Sample code is given below copy and try it out...
 
 h1 {
  background-color: #990099;
 }
 h3{
  background-color: #999999;
 }
 p {
  background-color: #990099;
 }
Background images [background-image]
The CSS property background-image is used to insert a background image.
Sample code is given below copy and try it out...
 

body {
 background-color: #FFCC66;
 background-image: url("016.jpg");
     }
Repeat background image [background-repeat]
This property describes whether background image has to repeat or not,because if given by default it will repeat horizontally.
background-repeat: repeat - image will be repeated both horizontally and vertically
background-repeat: repeat-x - image will be repeated both horizontally
background-repeat: repeat-y - image will be repeated both vertically
background-repeat: no-repeat - image will not repeat
Sample code is given below copy and try it out...
 
body {
 background-color: #FFCC66;
 background-image: url("8701.gif");
 background-repeat: repeat
 /*background-repeat: repeat-x*/
 /*background-repeat: repeat-y*/
 /*background-repeat: no-repeat*/
     }
Lock background image [background-attachment]
The property background-attachment specifies whether a background picture is fixed or scrolls along with the containing element.
Background-attachment: scroll - The image scrolls with the page - unlocked
Background-attachment: fixed - The image is locked
 
body {
 background-color: #FFCC66;
 background-image: url("8701.gif");
 background-repeat: repeat
 background-attachment: fixed;
 /*background-attachment: scroll;*/
 }
Place background image [background-position]
This property will help you to change the default position of image and we can set image in a fixed position.
background-position: 3cm 3cm - The image is positioned 3 cm from the left and 3 cm down the page
background-position: 50% 25% - The image is centrally positioned and one fourth down the page
background-position: top right - The image is positioned in the top-right corner of the page
 
 body {
 background-color: #FFCC66;
 background-image: url("8701.gif");
 background-repeat: no-repeat;
 background-attachment: fixed;
 background-position: right bottom;
      }
Compiling [background]
From the above example we saw that we used different background properties together,we can compile these properties to a single unit and develop a single line of code.
for example the above codecan be rewritten as source code gven below :
 
background: #FFCC66 url("8701.gif") no-repeat fixed right bottom;
If a property is left out, it will automatically be set to its default value.

Comments

Popular posts from this blog

Passing Images between Activities in Android

in First Activity:
Intent intent=new Intent(FirstClass.this, SecondClass.class); Bundle bundle=new Bundle(); bundle.putInt("image",R.drawable.ic_launcher); intent.putExtras(bundle); startActivity(intent); in Second Acticity:
Bundle bundle=this.getIntent().getExtras(); int pic=bundle.getInt("image"); v.setImageResource(pic);another method:
in First Activity:
Drawable drawable=imgv.getDrawable(); Bitmap bitmap= ((BitmapDrawable)drawable).getBitmap(); ByteArrayOutputStream baos = new ByteArrayOutputStream(); bitmap.compress(Bitmap.CompressFormat.PNG, 100, baos); byte[] b = baos.toByteArray(); Intent intent=new Intent(Passimage.this,myclass.class); intent.putExtra("picture", b); startActivity(intent); in Second Acticity:
Bundle extras = getIntent().getExtras(); byte[] b = extras.getByteArray("picture"); Bitmap bmp = BitmapFactory.decodeByteArray(b, 0, b.length); Image…

Get a single record from SQLite in ANDROID

For COMPLETE TUTORIALS see here :
in DATABASE HELPER class: String[] coloumns = new String[] { KEY_ROWID, KEY_NAME, KEY_NICKNAME }; // calling elements in an array Cursor c = db.query(DATABASE_TABLE, coloumns, KEY_ROWID + "=" + l,null, null, null, null); if (c != null) { c.moveToFirst(); String name = c.getString(1); // since name is in position 1 ie second coloumn return name; } return null; in sqlite.java : String s =editinfo.getText().toString(); long l=Long.parseLong(s); DBAdapter adapter=new DBAdapter(SQliteExample.this); adapter.open(); String returnedname=adapter.returnName(l); String returnednickname=adapter.returnickname(l); adapter.close(); editName.setText(returnedname); editNickName.setText(returnednickname);

TextView Animation or Alpha animation (FadeIn , FadeOut) in ANDROID

An Alpha Animation is animation that controls the alpha level of an object, i.e. fading it in and out. In Android, you can apply that fading effect to almost anything, from simple text, to images, buttons, check boxes, etc…

This can be done both from xml and from java class.

Here I will explain a simple way to give a FadeIn and FadeOut for a textview on button click.. public class Textviewanimation extends Activity { Animation fadeIn,fadeOut; TextView tv; Button startanimation; Boolean fadeflag=true; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_textviewanimation); tv=(TextView) findViewById(R.id.textview); startanimation=(Button) findViewById(R.id.button1); fadeIn = new AlphaAnimation(0.0f , 1.0f ) ; fadeIn.setDuration(1200); fadeIn.setFillAfter(true); fadeOut = new AlphaAnimation(1.0f , 0.0f); fadeOut.setDurati…