Learn HTML/CSS easy Manners

HTML is a structural layout of the website and CSS is used for design and text styling.

html form in 3 layout structure coding head,title and body

Head we can adding css style coding and Javascript links managed

Title we can managed title of the websites

Body we can managed html coding and structural layout

heading are few type like H1,H2,H3,H4,H5,H6 we can adjust text size in bold and small

P tag use for paragraph and B tag is use for jump to next line

style tag use for changing background,font size and text color like background-color:yellow; text-color:red ; font-size:20px; text-align:center;

Formatting Elements

  • <b> – Bold text
  • <strong> – Important text
  • <i> – Italic text
  • <em> – Emphasized text
  • <mark> – Marked text
  • <small> – Small text
  • <del> – Deleted text
  • <ins> – Inserted text
  • <sub> – Subscript text
  • <sup> – Superscript text

Images tags

<img src=”imagename.jpg” alt=”Flowers in Chania”>

Video tags

<video width=”320″ height=”240″ controls>
  <source src=”movie.mp4″ type=”video/mp4″>
  <source src=”movie.ogg” type=”video/ogg”>
Your browser does not support the video tag.
</video>

Audio tags

<audio controls>
  <source src=”horse.ogg” type=”audio/ogg”>
  <source src=”horse.mp3″ type=”audio/mpeg”>
Your browser does not support the audio element.
</audio>

Playing a YouTube video tag

<iframe width=”420″ height=”315″
src=”https://www.youtube.com/embed/tgbNymZ7vqY”>Jo
</iframe>

CSS Border Style

The border-style property specifies what kind of border to display.

The following values are allowed:

  • dotted – Defines a dotted border
  • dashed – Defines a dashed border
  • solid – Defines a solid border
  • double – Defines a double border
  • groove – Defines a 3D grooved border. The effect depends on the border-color value
  • ridge – Defines a 3D ridged border. The effect depends on the border-color value
  • inset – Defines a 3D inset border. The effect depends on the border-color value
  • outset – Defines a 3D outset border. The effect depends on the border-color value
  • none – Defines no border
  • hidden – Defines a hidden border

CSS Margins

The CSS margin properties are used to create space around elements, outside of any defined borders.

With CSS, you have full control over the margins. There are properties for setting the margin for each side of an element (top, right, bottom, and left).


Margin – Individual Sides

CSS has properties for specifying the margin for each side of an element:

  • margin-top
  • margin-right
  • margin-bottom
  • margin-left

Example code

p {
  margin-top: 100px;
  margin-bottom: 100px;
  margin-right: 150px;
  margin-left: 80px;
}

CSS Padding

The CSS padding properties are used to generate space around an element’s content, inside of any defined borders.

With CSS, you have full control over the padding. There are properties for setting the padding for each side of an element (top, right, bottom, and left).


Padding – Individual Sides

CSS has properties for specifying the padding for each side of an element:

  • padding-top
  • padding-right
  • padding-bottom
  • padding-left

Example code

div {
  padding-top: 50px;
  padding-right: 30px;
  padding-bottom: 50px;
  padding-left: 80px;
}

that is end of learning html and css coding

pls like or share my coding to your frn can learn coding in easy manner…

Leave a comment

Create a website or blog at WordPress.com

Up ↑