HTML/CSS kalın yazı yazma kodu kullanımı örneği (HTML/CSS bold text writing code usage example)

CSS Aşağıdaki 2 kod satırı ile CSS çözümünü kullanabilirsiniz en son bölümde ise HTML çözümü gösterilmiştir. [code language=”css”]font-weight:bold;[/code] [code language=”css”]font-weight:800;[/code] CSS kullanımı ise ister .css dosyanıza tanımlama yaparak kullanabilirsiniz yada HTML etiketinin “style” niteliğini(attribute) kullanarak kalın yazı işleminizi gerçekleştirebilirsiniz. HTML dosyanızda istediğiniz HTML etiketinin “style” niteliğini(attribute) kullanabiliriz. [code language=”html”] <label style="font-weight:bold;">bold label text with style attribute generated</label> [/code] HTML dosyanızda Class olarak kullanmak için; CSS dosyanıza yada HTML içindeki CSS tanımlamanızın içine bu kodu ekleyip, [code lanuage=”css”] .boldTextClass { font-weight:bold; } [/code] sonrasında HTML içinde ise alt satırdaki kod örneğini kullanabilirsiniz. [code language=”html”] <p class="boldTextClass"> bold paragraph</p> [/code] HTML dosyanızda ID olarak kullanmak için: CSS dosyanıza yada HTML içindeki CSS tanımlamanızın içine bu kodu ekleyip, [code lanuage=”css”] #boldTextId { font-weight:bold; } [/code] sonrasında HTML içinde ise alt satırdaki kod örneğindeki gibi kullanabilirsiniz. [code language=”html”] <span id="boldTextId"></span> [/code] HTML dosyanızda herhangi bir element için, burada type=”text” niteliğine(attribute) sahip bütün “input” lar örnek olarak gösterilmiştir. CSS dosyanıza yada HTML içindeki CSS tanımlamanızın içine bu kodu ekleyip, [code lanuage=”css”] input[type="text"] { font-weight:bold; } [/code] sonrasında HTML içinde ise alt satırdaki kod örneğindeki gibi kullanabilirsiniz. [code language=”html”] <input type="text" value="input type text bold" /> [/code] HTML Aşağıda ise HTML ile çözümleri göreceksiniz. “b” HTML elementi kalın yazı yazmak için oluşturulmuştur. “h1, h2, …” HTML elementleri başlık olarak kullanılacak yazılar için hazırlanmışlardır. “strong” HTML elementi ise önemli yazıları belirtmek için hazırlanmıştır. [code language=”html”] <b> write bold text to here </b> <h1>h1 text</h1> <h2>h2 text</h2> <h3>h3 text</h3> <h4>h4 text</h4> <h5>h5 text</h5> <h6>h6 text</h6> <strong> strong words</strong> [/code] Yukarıda parça parça anlattığım kalın yazı yazma kodlarının hepsine aşağıdan toplu halde HTML içerisinde görebilirsiniz. [code language=”html”] <!DOCTYPE html> <html> <head> <title>boldTextHtmlCssJavascriptJQuery | www.yazilimcity.net</title> <!–bütün kodu çalıştımak istediğinizde css dizini sorunu yaşabileceğiniz için .css içeriğini aşağıya da ekledim ve bu satırı yorum içine alıyorum–> <!–<link type="text/css" href="../includes/css/style.css" rel="stylesheet">–> <style type="text/css"> .boldTextClass { font-weight: 900; } input[type="text"] { font-weight:bold; } /*style.css file content*/ #boldTextId { font-weight: bold; } </style> </head> <body> <label style="font-weight:bold;">bold label text styleAttribute</label> <br> <p class="boldTextClass"> bold paragraph pClass</p> <br> <span id="boldTextId">bold text spanId</span> <br> <input type="text" value="bold text inputTypeText"/> <br> <b>bold text with html "b" tag</b> <br> <h1>h1 text</h1> <h2>h2 text</h2> <h3>h3 text</h3> <h4>h4 text</h4> <h5>h5 text</h5> <h6>h6 text</h6> <br> <strong> strong text </strong> <br> <footer> <b> <address> <a href="http://www.yazilimcity.net">www.yazilimcity.net</a> </address> </b> </footer> </body> </html> [/code]]]>

Leave a Reply

Your email address will not be published. Required fields are marked *