ad

Friday, February 16, 2024

css button style



CSS Button Style

Example:-

 
  <html>
    <head><title>html shadow button</title>
    <style>
        .btn-shadow1
        {
            background-color:rgb(63, 61, 188);
            border-radius: 10px;
            color:aliceblue;
            padding:15px 30px;
            font-size:16px;
            box-shadow:1px 1px 3px 3px palevioletred;
           


        }
    </style>
    </head>
    <body>
        <button class="btn-shadow1" onclick="alert('hi friends')">
<B>Shadow Button</B></button>
    </body>
  </html>

CSS Shadow Button 

Output:-

css button style/ output







READ MORE

html Button tag

css class selector

css id selector

text align css

inline css html

internal css html

css introduction html

image resizer


html Button tag


Html Button Tag

   1]  <Button> tag creates a  clickable  button.
   2]  The  type="button" attribute specifies the button.
   3]  The text  "click Me" content of the button.
   4]  button can trigger java Script events / perform action defined the web page.

Html Button Tag

Example :-

<!DOCTYPE html>
<html>
    <head>
        <title>button tag</title>
    </head>
    <body>
        <h2>Html Button Tag </h2>
        <button type ="button" onclick="alert('hi friends')" >Click Me</button>
    </body>
</html>

Html Button Tag

Output :-

button tag  /output




related Post :-

about us page design template

php program print inverted pyramid star pattern in php

css id selector

css class selector


 css class selector

1]  css class selector write (.) character.

2]  css class selector is a fundamental part of cascading style sheets target html elements    

       based on their class attribute.

Syntax :-

. class 

{

text-align : center;

color :pink;

}

CSS Class Selector

Example :-

<!DOCTYPE html>
<html>
<head>
    <title>css class select </title>
    <style>
    .web
    {
        text-align : center;
        color:yellowgreen;
    }
</style>
</head>
<body>
    <h2 class="web">
        hello https://webdesigningtheory.blogspot.com/ </h2>

        <h3>This is program of Css ID Selector</h3>
    </h2>
   
</body>
</html>

CSS Class Selector 

Output :-

css class selector output




Related Post :-

javascript Tutorial

e-commerce project for student

simple login form in html

Thursday, February 15, 2024

css id selector


     
  CSS ID Selector

1] css id selector  attribute  is the unique identifier in an html document.

2] id selector use # character.

3] css id selector is used to apply style specific HTML element.

Syntax :-

#id

 {

// css property

}

CSS id selector 

Example:-

<!DOCTYPE html>
<html>
<head>
    <title>css id selector</title>
    <style>

        #web
        {
            text-align :center;
            color:brown;

        }
    </style>
</head>
<body>
    <h2 id="web">
        hello https://webdesigningtheory.blogspot.com/ </h2>

        <h3>This is program of Css ID Selector</h3>
    </h2>
   
</body>
</html>

CSS id selector

Output :-


css id selector /output





Related Post :- 

program to print left pascal star pattern in php

css border property

background color program

Tuesday, February 13, 2024

css element selector


  CSS Selector 

1] css selector are used to select the content to style.

2] Selector are the part of css rule set.

3] css selector is a pattern used to select and style elements on webpage.

    Four type of css selectors 

1] CSS Element Selector

2] CSS ID Selector

3] CSS Class Selector

4] CSS Universal Selector


1] CSS Element Selector :-

   1] Selects HTML elements based on their tag names 

     eg.  ' h3 ' selects all ' <h3> ' elements.


CSS Element Selector :-

Program:-

<!DOCTYPE html>
<html>
<head>
    <title>css selector</title>
    <style>
        h3
        {
               text-align : center;
               color:blueviolet;
        }
    </style>
</head>
<body>
    <h3>heading will be affected by style</h3>
    <p>css selector </p>
    <p>css element element</p>

   
</body>
</html>

CSS Element Selector :-

Output :-

css element selector output





Related Post :-

html table tag

html button tag

php program to print diamond pattern