HTML CODE EXAMPLES

The <bdi> [bi directional tag]

The <bdi> comes in handy when we have a need to place content in languages that follow Right to Left writing styles, example Arabic. Now in the absence of <bdi> tag, when browsers come across contents which follow Right to Left writing patterns, they simply treat the content like any other content and follow the one size fits all pattern. By doing this, they do a great injustice to the language and to its readers. For without proper formatting, the essence of the language is lost and also the reader's interest.

Now Upon using the <bdi> tag, you clearly instruct the Browser to follow a different formatting pattern as to ones adopted with writing styles from Right to Left. Thus in this way, justice is done both to the language and to the reader.




TRY THIS CODE

<!DOCTYPE html>
<html>
<head>
<title>Bdi tag and its use</title>
<style>
bdi{ font-size: 25px;
color: red; }
h3{ color:darkblue; }
</style>
</head>
<body>
<h2>Example of HTML bdi tag in action</h2>
<p>
<bdi>لأنه هكذا أحب الله العالم حتى بذل ابنه الوحيد لكي لا يهلك كل مَنْ يؤمن به بل تكون له حياة أبدي</bdi </p> <br><br>


<h3>Example of HTML bdi tag not in use</h3>
<p>لأنه هكذا أحب الله العالم حتى بذل ابنه الوحيد لكي لا يهلك كل مَنْ يؤمن به بل تكون له حياة أبدي</p>
</body>
</html>



OUTPUT


Get Creative, use your imagination to find ways to incorporate the <bdi> tag in your projects.




Previous     Next

Comments

Read what our users ought to say: htmlwhale.com


100 comments

  • Audrey:

    I always wanted to start a side hussle and moreso, wanted it to be done at the comfort of my home. I joined an outsourcing agency, and the job was Data Entry. I used to spend long hours just entering the data. For every 1000 entries, I was offered $5, and just to make $50 I would have to spend the entire week and not to mention the back breaking unspoken labor that went in. It was then through a friend, I was introduced to htmlwhale.com. Honestly I should say, the moment the I heard the name, I felt, freedom, hope and assurance.Within 3 weeks, I was able to gain a decent level of mastery on webpage design and in 2 months time my work got attention.Now, am free at last and my passion has embroyed into a small business that has now afforded me a home and a car for which am very grateful.
    Reply

  • Denzel:

    I worked at a tuition center working 10 hours a day. On top of the alloted work load, I had to do a lot of substituting for there were frequent tutor absentees. I wouldn't blame them, for the job was too demanding and the pay was peanuts. On one late evening while sitting at a coffee shop I met my one time school buddy. He was quick to notice my weariness and asked me why am still stuck there. He told me that the only way I could change my future if I did something about it. It was then he suggested me, htmlwhale.com, and advised me to try becoming a full stack web developer. I took his advice and from then there was no turning back. Today am happy with my job and I thank my friend for introducing me to htmlwhale.com.
    Reply

  • Julie Shen:

    I would say, I was just lucky to come across this site. With wealth of information to understand webcreation and webdevelopment and with tons of video lessons providing explanation to every single line of code. :)
    Reply

  • Jonathan Bill:

    All of my friends are talking about htmlwhale. I've even heard my mother talking about this when I expressed my desire to get into coding, and she was quick to point out as to how her friend's daughter had used it to clear a tech interview and that I should waste no time in shuttling with my decision. So here I am, going through every bit of the knowledge without shelling out huge sums of money. :)
    Reply

  • Mandy Wilson:

    I'm a 30-year-old woman working for a fastfood joint, working 70hrs a week and this I did for 10 years. Everyday I had to wake up at 5am just to be able to reach my workspot on time to prepare the morning breakfast. It was then as by chance I met one of my former colleagues who used to work with me and it was he who gave me tap on my back. Infact, I could hardly recognize him, he was all bright. I never knew him that way, and ventured out with bdiness to ask him the cause for his change. He spilled beans of lifechanging advice in a minute. All he said was, "Mandy, if you only were to work just half the working hours that you put here in, on your future, you could just live the way I live"It was as if a bolt struck me.From then on there was no turning back. Today, I am a webdesigner, and I am extremely greatful for all of the content and guidance that HTMLWHALE.com, has provided me.
    Reply

  • Dana Dowson:

    I'd been trying to learn html for ages but often failed in my attempts. One main reason I would say is the lack of available content to have a grasp of the subject. Of course they say that there are a lot of websites that do provide Html content, but the major flaw in all of them is their inability to start the subject from basics and then gravitate towards proficiency. However, thankfully, I have found HTMLWHALE.com, and in all honesty, this is the only site that I have found to answer to all of the needs that any begineer would have. Today, I work in web developement and I attribute my succes to htmlwhale.com:)
    Reply

  • Sophia Fryer:

    I was doing fairly well in school when I had to drop out because of low funds and I didn't like the idea of studying on debt. For I know with the changing world, only things that had direct application to solving people's problems had relevance. So I was always on the lookout for an opportunity that would allow me to work and study. This opportunity was offered to me by HTMLWHALE.com, which gave away technical knowledge free of cost to all those who are willing to accept and improve. Today, I have a small web development business. Of course, I cannot claim to know everything in webdevelopment, but I have HTMLWHALE.com, for reference and study, and that gives me the confidence I need to conquer.happiness!:) AMAZING, UNBELIEVABLE!
    Reply
bdi-img

HTML Knowledge bdi:

  • HTML 5 Cheat Sheet:

    Get HTML 5 cheat sheet A quick guide that comes in handy when it comes to working on a website design and time is a constraint.

  • HTML 5 study Vids:

    Complete set of HTML 5 study Vids that provides you with a greater understanding and knowledge bdi.

  • HTML 5 Canvas:

    A detailed tutorial on how HTML canvas works. This would be greatly useful if you wish to get into Graphics design.

  • HTML 5 Forms:

    A detailed tutorial on how forms work in HTML 5 and how they could be harnessed for better productivity.

HTML 5 Tags[New Addition]

htmlwhale-img
To all those aspiring to work in webdevelopment for fortune companies, the number 1 advice I would like to give is this, "know your basics correct". For when you are strong in your foundation, you can simply scale any heights you aspire too. I am pleased to say that HTMLWHALE.com, has been doing a great job in exactly doing that, rendering service beyond expectations and always going that extra mile when it comes to helping people achieve the true best. Thanks a lot! -Gnan Bright-CEO What we fail to understand is that, though there is vast information resources floating everywhere, yet we don't see many using them to upgrade and uplift their economical condition. One main reason is that these so called availability of information is not well organized, meaning if you were to ask someone to use them, they would simply have no clue at all.So the underlying point to all of these pandemonium of chaos is, not provind content in the way they ought to be provided. Thankfully, my team and I have found a way out and that would be to use,HTMLWHALE.com. In all these years of my experience in using them and recommending them to others, the single most reaction that all of its users received is this, that the site is so well organized in content that any begineer on meticulous use of the site can and will become a pro at webdevelopment in weeks. This is so good for it would do wonders to all those who are aspiring to make their way into webdevelopment. Thanks a lot, you guys are indeed my heroes! -Martha Heyworth-CMO

HTML Complete

  • Knowlege is Power:

    Get htmlwhale.com learning guide. HTMLWHALE.com, adopts a step by step method in providing you knowledge and tools required to conquer webdevelopment

CSS Complete

  • Knowlege is Power:

    Get htmlwhale.com learning guide. HTMLWHALE.com, adopts a step by step method in providing you knowledge and tools required to conquer webdevelopment

JAVA SCRIPT Complete

  • Knowlege is Power:

    Get htmlwhale.com learning guide. HTMLWHALE.com, adopts a step by step method in providing you knowledge and tools required to conquer webdevelopment