+ 1
How to do css
6 Réponses
+ 2
CSS is used to style HTML — colors, fonts, layout, spacing, and more.
Ways to Apply CSS:
Inline CSS – directly in HTML tags:
<p style="color: red;">Hello</p>
Internal CSS – inside <style> in HTML:
<head>
<style>
p { color: blue; font-size: 18px; }
</style>
</head>
External CSS – separate .css file linked in HTML:
<link rel="stylesheet" href="styles.css">
/* styles.css */
p {
color: green;
font-size: 20px;
}
Basic CSS Concepts:
Selectors: Target elements to style (p, h1, .class, #id)
Properties & Values: Define style (color: red; font-size: 16px;)
Box Model: Every element has content, padding, border, margin
Positioning: static, relative, absolute, fixed, sticky
Flexbox & Grid: For layout and alignment
Example:
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: #f0f0f0;
font-family: Arial, sans-serif;
}
.highlight {
color: red;
font-weight: bold;
}
</style>
</head>
<body>
<p>Hello, this is normal text.</p>
<p class="highlight">This text is highlighted in red!</p>
</body>
</html>
Good Luck!
+ 1
Entangle into the Web Development (HTML + CSS + JS) or Introduction To CSS (Only CSS) course in the learning section.
+ 1
https://www.sololearn.com/learn/courses/css-introduction
____________________________________________
CSS practice
https://mastery.games/build/zelda/
https://gridcritters.com/ 179$ cost
https://flexboxzombies.com/
https://flukeout.github.io/
https://www.tynker.com/parents/
http://www.flexboxdefense.com/
http://cssgridgarden.com
https://flexboxfroggy.com/
https://frontendmentor.io
0
Thanks and how to do gradient
0
ibtihal imtiaz, you can create linear gradients in CSS quite easily following this syntax:-
background: linear-gradient(direction, colour1, colour2, ...);
For radial gradients, you can use this syntax:-
background: radial-gradient(shape size at position, colour1, colour2, ...);
Note that a linear gradient transitions colours along a straight line (horizontal, vertical, or at a specified angle) while a radial gradient radiates from a central point outward in a circular or elliptical shape.
You can visit these links for further information:
https://www.w3schools.com/css/css3_gradients.asp
https://www.w3schools.com/cssref/func_radial-gradient.php
https://css-tricks.com/a-complete-guide-to-css-gradients/
Additionally, this can be quite useful while coding: https://cssgradient.io/
0
ibtihal imtiaz, since you did not specify whether you want to create background gradients or text gradients, I take this opportunity to tell you that, to apply gradients to text, you may used the background-clip and text-fill-color declarations after you declare a background gradeint.
background-clip specifies extent of the background. Hence, when you set it to text like:-webkit-background-clip:text;
background is “clipped” to the shape of the text, which makes the gradient appear inside the text.
Then, declare-
-webkit-text-fill-color: transparent;
To make the gradient visible inside the text, the actual text colour must be transparent so that the forecolour does not block the gradient.
If is seems difficult, you can think of it this way: The text is a window & gradient is a colourful sheet behind the window.
-webkit-background-clip: text; makes the gradient show only through the shape of the letters.
-webkit-text-fill-color: transparent removes the “glass” (forecolour) so gradient is visible.
Vous avez souvent des questions comme celle-ci ?
Apprenez de manière plus efficace, gratuitement :
Aujourd'hui en vedette
Can somebody pls solve this?
1 Votes
Pls help!
1 Votes
Courses
1 Votes
How to do css
1 Votes
What is next
2 Votes
Background suggest
2 Votes
Java
1 Votes