CodeSolved

A comprehensive source of programming questions and exercises

Stroke text

Practice Easy 240/ Download 655 Views

Create a stroke text using HTML and CSS as shown below

Be careful to add a stroke to just one word as the one of the text, just as in the image below


1 Answers

<!DOCTYPE html>
<html lang="fa">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>متن استروک دار</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <h1 class="stroke-text">متن استروک دار</h1>
</body>
</html>
CSS (styles.css)
css
body {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh; # To center vertical
    background-color: #f0f0f0; # The background color
    font-family: Arial, sans-serif;
}

.stroke-text {
    font-size: 60px; # Font size
    color: white; # Text color
    text-shadow: 
        -1px -1px 0 #000,  
        1px -1px 0 #000,
        -1px 1px 0 #000,
        1px 1px 0 #000; # Stroke
}
Mma123 Download HTML & CSS

Submit answer

Submitting answers is currently unavailable.

Related content

Detection using AI
×
×
Close