css - HTML "style" tag doesn't work -
i tried following code in both online editor in w3schools & pen editor in codepen. here code.
body { background-color: lavenderblush } .red-text { color: red; } h1 { font-family: tangerine, times new roman; font-size: 55px; } p { font-size : 18px; font-family: inconsolata; } .thick-salmon-border { border-color: salmon; border-width: 5px; border-style: solid; border-radius: 50%; } .smaller-image { width: 120px; height: 120px; } .thick-royalblue-border { border-color: royalblue; border-width: 5px; border-style: solid; border-radius: 50%; } .thick-green-border { border-color: green; border-width: 5px; border-style: solid; border-radius: 50%; } .thick-sandybrown-border { border-color: sandybrown; border-width: 5px; border-style: solid; border-radius: 50%; } .thick-lightpink-border { border-color: lightpink; border-width: 5px; border-style: solid; border-radius: 50%; } .thick-rosybrown-border { border-color: rosybrown; border-width: 5px; border-style: solid; border-radius: 50%; } .box { border-style: solid; border-color: rosybrown; border-width: 5px; } .antiquewhite-box { background-color: antiquewhite; padding: 20px; margin: 20px; } .mistyrose-box { background-color: mistyrose; padding: 20px; margin: 20px; }<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=tangerine"> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=rancho&effect=shadow-multiple"> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=inconsolata"> <h1 class="red-text font-effect-shadow-multiple">my favorite songs</h1> <p> <a href="https://en.wikipedia.org/wiki/ed_sheeran"><img class="smaller-image thick-salmon-border" src="http://cdn3.thr.com/sites/default/files/2015/07/ed_sheeran.jpg" alt="my favorite songs"></a> <a href="https://en.wikipedia.org/wiki/shape_of_you"><img class="smaller-image thick-royalblue-border" src="https://images.genius.com/fc44439c55552eb23d4a9ecb28a21f06.1000x1000x1.jpg " alt="my favorite songs"></a> <a href="https://en.wikipedia.org/wiki/thinking_out_loud"><img class="smaller-image thick-green-border" src="https://upload.wikimedia.org/wikipedia/en/a/ad/x_cover.png" alt="my favorite songs"></a> </p> <div class=" box antiquewhite-box"> <p>ed sheeran</p> <ul> <li><a href="https://www.musixmatch.com/lyrics/ed-sheeran/shape-of-you">shape of you</a></li> <li><a href="https://www.musixmatch.com/lyrics/ed-sheeran/thinking-out-loud">thinking out loud</a></li> <li><a href="https://www.musixmatch.com/lyrics/ed-sheeran/galway-girl">galway girl</a></li> </ul> <form action="/submit-ed sheeran" id="ed sheeran-form"> <label> <input type="radio" name="reaction" checked>like</label> <label> <input type="radio" name="reaction">dislike</label> <label> <input type="radio" name="reaction">none of above</label> <br> <label> <input type="checkbox" name="electronic devices" checked>phone</label> <label> <input type="checkbox" name="electronic devices">laptop</label> <label> <input type="checkbox" name="electronic devices">mp3</label> <br> <input type="text" placeholder="ed sheeran url"> <button type="submit">submit</button> </form> </div> <p> <a href="https://en.wikipedia.org/wiki/adele"><img class="smaller-image thick-sandybrown-border" src="http://www.hellomagazine.com/imagenes//celebrities/2017080741334/adele-grenfell-tower-victims-screening/0-214-739/adele-t.jpg" alt="my favorite songs"></a> <a href="https://en.wikipedia.org/wiki/rolling_in_the_deep"><img class="smaller-image thick-lightpink-border" src="http://netstorage.metrolyrics.com/albums/2777347adele-21.jpg" alt="my favorite songs"></a> <a href="https://en.wikipedia.org/wiki/hello_(adele_song)"><img class="smaller-image thick-rosybrown-border" src="https://i.pinimg.com/736x/a9/95/9c/a9959c17c8260650136fdc4a7d8bb218--adele-in-concert-adele--album.jpg" alt="my favorite songs"></a> <p> <div class="box mistyrose-box"> <p>adele</p> <ul> <li><a href="https://www.musixmatch.com/lyrics/adele-3/rolling-in-the-deep">rolling in deep</a></li> <li><a href="https://www.musixmatch.com/lyrics/adele-3/someone-like-you">someone you</a></li> <li><a href="https://www.musixmatch.com/lyrics/adele-3/hello">hello</a></li> </ul> <form action="/submit-adele" id="adele"> <label> <input type="radio" name="reaction" checked>like</label> <label> <input type="radio" name="reaction">dislike</label> <label> <input type="radio" name="reaction">none of above</label> <br> <label> <input type="checkbox" name="electronic devices" checked>phone</label> <label> <input type="checkbox" name="electronic devices">laptop</label> <label> <input type="checkbox" name="electronic devices">mp3</label> <br> <input type="text" placeholder="adele url"> <button type="submit">submit</button> </form> </div>btw, ran in "edge" browser in windows. what's wrong? code worked fine until yesterday, css doesn't work. did change in w3schools or codepen? there type-o? please help.
first : use head taq(required):
<head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <title></title> <link rel="stylesheet" href=""> <style type="text/css" media="screen"> </style> </head> second : use style code (not required) :
<style type="text/css" media="screen"> </style> third : put ; in end of css code(in end of line 6) (not required):
body { background-color: lavenderblush; } i hope second , third .
:)
Comments
Post a Comment