×
Clear all filters including search bar
Valeri Tandilashvili's CSS Notes
Results: 126
pseudo-classes: "hover", "active", "visited" 
a { color: green; text-decoration: none; }
a:hover { color: red; text-decoration: underline; }
a:active{ color: orange; }
a:visited{ color: pink; text-decoration: none; }
p:first-letter & p:first-line
They were pseudo-classes in CSS2, but in CSS3 they are introduced as pseudo-elements with double colon (
p::first-letter
& 
p::first-line
)
Image float:left with some text next to it 
12<img src="https://sibrdzne.ge/d1_images/logo.png" alt="Logo" class="image">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam a nunc at ante eleifend tempor. In vel ullamcorper tellus, et vulputate metus. Integer pulvinar, ipsum in efficitur fringilla, dolor lacus sollicitudin tortor, vitae tincidunt nunc elit id ipsum. Proin laoreet, est ut placerat sollicitudin, lectus mi pellentesque est, vel accumsan velit sem id felis.
<p>New P</p>
outline VS border CODE
As default 
border
size is included into container's width but 
outline
property is opposite of border, it's added outside of the container
object-fit: cover VS contain CODE 
contain
will show the entire image
#img1 {
  object-fit: contain;
}
cover
will take the entire space and maintain the image aspect ratio
#img2 {
  object-fit: cover;
}
inset CODE
The 
inset
property in CSS is a shorthand for the following four properties: 
top
, 
right
, 
bottom
and 
left
.exampleText {
  position: absolute;
  inset: 10px 30px 60px 40px;
  background-color: yellow;
}
Its parent element needs to have 
position
property with 
relative
value
div {
  background-color: green;
  height: 200px;
  position: relative;
  color: blue;
}
Results: 126