Вы находитесь на странице: 1из 3

border: 1px solid powderblue; ===>width of the border or The CSS border property

defines a border around an HTML element

padding: 30px;espace betwen border and letters (1)
margin: 50px; defines a margin (space) outside the border
#p01 {
color: blue;
<p id="p01">I am different.</p>===>id pour un seul element
also thre is:
p.error {
color: red;
<p class="error">I am different.</p>

<link rel="stylesheet" href="styles.css">
</head> ===>style that equals to:
body {
background-color: powderblue;
h1 {
color: blue;
<a href="https://www.w3schools.com/html/">Visit our HTML tutorial</a>===>link
a:link {
color: green;
background-color: transparent;
text-decoration: none;
a:visited {
background-color: transparent;always
text-decoration: none;
a:hover {
color: yellow;
background-color: transparent; on put mouse on it
text-decoration: underline;
a:active {
color: yellow;
background-color: transparent; ==>when click on ot
text-decoration: underline;
p {
color: red;
}in single url
<a href="https://www.w3schools.com/html/" target="_blank">Visit our HTML tutorial!

<p>If you set the target attribute to "_blank", the link will open in a new browser
image as a link
<a href="default.asp">
<img src="smiley.gif" alt="HTML tutorial"

<p><a href="#C4">Jump to Chapter 4</a></p>

<h2 id="C4">Chapter 4</h2> ==>bookmark in the same page

Or, add a link to the bookmark ("Jump to Chapter 4"), from another page:
<a href="html_demo.html#C4">Jump to Chapter 4</a>

<img src="pulpitrock.jpg" alt="Mountain View">===>insert image


<p>Click on the computer, the phone, or the cup of coffee to go to a new page and
read more about the topic:</p>

<img src="workplace.jpg" alt="Workplace" usemap="#workmap" width="400"


<map name="workmap">
<area shape="rect" coords="34,44,270,350" alt="Computer" href="computer.htm">
<area shape="rect" coords="290,172,333,250" alt="Phone" href="phone.htm">
<area shape="circle" coords="337,300,44" alt="Cup of coffee" href="coffee.htm">
background image in the hole body:
<body style="background-image:url('clouds.jpg')">

<h2>Background Image</h2>

<p>By default the background image will repeat itself if it is smaller than the
element where it is specified, in this case the BODY element.</p>

An HTML table is defined with the <table> tag.

Each table row is defined with the <tr> tag. A table header is defined with the
<th> tag.
By default, table headings are bold and centered. A table data/cell is defined
with the <td> tag.

<table style="width:100%">

<caption>Monthly savings</caption>==>ism yji fo9 tableau

background-color: #eee;hexa color RGB code= 14*16+14,14*16+14,14*16+14 or

An unordered list starts with the <ul> tag. Each list item starts with the <li>
The list items will be marked with bullets (small black circles) by default:
ul=unordred list
ol:ordred list
u can use :<ul style="list-style-type:square"> to do a squar instant of bullet
A description list is a list of terms, with a description of each term.

The <dl> tag defines the description list, the <dt> tag defines the term (name),
and the <dd> tag describes each term:
<dd>- black hot drink</dd>
<dd>- white cold drink</dd>
- black hot drink
- white cold drink
ovrflow =to add a scroll bar oh hide etc
Use the CSS property float:left or display:inline to display a list horizontally
li {
float: left;
<div>Hello</div>===>block element will take all the space
The SPAN element is an inline element, and will not start on a new line