<p>Today's day 17 Goal is to Build and learn by styling cards giving a visual look, creating a 6 content cards in Html &amp; CSS from YT Tutorial. </p>
<h2 id="heading-html">HTML</h2>
<p>-</p>
<h2 id="heading-css">CSS</h2>
<h3 id="heading-1-how-to-give-border-radius-in-css">1. how to give border radius in CSS?</h3>
<ol>
<li>Write the following code.</li>
</ol>
<pre><code>  border-radius: <span class="hljs-number">10</span>px;
</code></pre><h3 id="heading-2-how-to-change-the-opacity-of-the-background-card">2. how to change the opacity of the background card?</h3>
<ol>
<li>Change the last parameter in rgba property.</li>
</ol>
<pre><code>background-color: rgba(<span class="hljs-number">255</span>, <span class="hljs-number">255</span>, <span class="hljs-number">255</span>, <span class="hljs-number">0.09</span>);
</code></pre><h3 id="heading-3-how-to-give-borderline-to-a-card-in-css">3. how to give borderline to a card in CSS?</h3>
<ol>
<li>Write the following code.</li>
</ol>
<pre><code>border: <span class="hljs-number">1</span>px solid rgba(<span class="hljs-number">255</span>, <span class="hljs-number">255</span>, <span class="hljs-number">255</span>, <span class="hljs-number">0.1</span>);
</code></pre><h3 id="heading-4-how-to-give-cursor-input-in-css">4. How to give cursor input in CSS?</h3>
<ol>
<li>To give choice to select the cards.</li>
</ol>
<pre><code>  cursor: pointer;
</code></pre><h2 id="heading-javascript">JavaScript</h2>
<p>-</p>
<h2 id="heading-conclusion">Conclusion</h2>
<ol>
<li><p>Border radius in CSS.</p>
</li>
<li><p>Change the opacity of the background card in CSS.</p>
</li>
<li><p>Borderline to a card in CSS.</p>
</li>
<li><p>cursor input in CSS.</p>
</li>
</ol>
<p>Successfully created 6 cards.</p>
<h2 id="heading-my-code">My Code:</h2>
<blockquote>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1667479009901/U1b5--epw.png" alt="day 17 cards.png" /></p>
</blockquote>
<p>Source: <a target="_blank" href="https://www.youtube.com/watch?v=htGfnF1zN4g">YT</a></p>
<p>Author: Dheeraj.y</p>


Today's day 17 Goal is to Build and learn by styling cards giving a visual look, creating a 6 content cards in Html & CSS from YT Tutorial. 

## HTML
-
## CSS

### 1. how to give border radius in CSS?

1. Write the following code.

```
  border-radius: 10px;
``` 
### 2. how to change the opacity of the background card?

1. Change the last parameter in rgba property.

```
background-color: rgba(255, 255, 255, 0.09);
``` 
### 3. how to give borderline to a card in CSS?

1. Write the following code.

```
border: 1px solid rgba(255, 255, 255, 0.1);
``` 
### 4. How to give cursor input in CSS?

1.  To give choice to select the cards.

```
  cursor: pointer;
``` 


## JavaScript
-

## Conclusion

1. Border radius in CSS.

1. Change the opacity of the background card in CSS.

1.  Borderline to a card in CSS.

1. cursor input in CSS.

Successfully created 6 cards.

## My Code: 
> 
![day 17 cards.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667479009901/U1b5--epw.png align="left")


Source: [YT](https://www.youtube.com/watch?v=htGfnF1zN4g)

Author: Dheeraj.y

Project based Learning using HTML CSS JS - Day 17

HTML

1. how to give border radius in CSS?

2. how to change the opacity of the background card?

3. how to give borderline to a card in CSS?

4. How to give cursor input in CSS?

JavaScript

Conclusion

My Code:

dheerajy blog