HTML - Arabic Support
The W3C has a good introduction.
In short:
HTML is a text markup language. Text means any characters, not just ones in ASCII.
- Save your text using a character encoding that includes the characters you want (UTF-8 is a good bet). This will probably require configuring your editor in a way that is specific to the particular editor you are using. (Obviously it also requires that you have a way to input the characters you want)
- Make sure your server sends the correct character encoding in the headers (how you do this depends on the server software you us)
- If the document you serve over HTTP specifies its encoding internally, then make sure that is correct too
- If anything happens to the document between you saving it and it being served up (e.g. being put in a database, being munged by a server side script, etc) then make sure that the encoding isn't mucked about with on the way.
You can also represent any unicode character with ASCII
HTML not supporting arabic language
As i can see you are using some html5 based attributes like dir
so you need to convert the html4
document to html5
doctype and use lang attribute on html tag and meta tag:
<!DOCTYPE HTML>
<html lang="ar">
<head>
<meta charset="utf-8">
A sample demo is below:
<h1 dir='rtl' lang='ar'>checking</h1><p dir="rtl" lang="ar" style="color:#e0e0e0;font-size:20px;">رَبٍّ زِدْنٍي عِلمًا</p>
HTML Arabic text
Problem will be here that your browser is not capable due to a necessary font or character table which is not being used.
Have a look at this testpage in order to find out if your browser is capable of displaying arabic characters with its actual setting.
This page covers the necessary browser settings to display arabic characters.
CSS not support arabic
The Problem is here with this file:
<script src="js/cufon-yui.js" type="text/javascript"></script>
It`s a font file , try to /Hash/ it , and it will work
(Y)
HTML formatting Arabic text letters
Try adding a zero-width joiner Unicode character before the opening span tag.
You should check this in all browsers, as it is an issue that some can't cope with.
@keyframes doesn't support Arabic
For Arabic include the attributes dir="rtl"
and lang="ar"
on tag elements with Arabic characters:
h1::after {
content: "مرح";
}
Example 1:
<h1>Testing Arabic</h1>
This render incorrectly characters (on Chrome it seems to work, but in Safari and Firefox don't).
Example 2:
<h1 dir="rtl" lang="ar">Testing Arabic</h1>
This render correctly!
Also, you can read more about problems animating the "content" property here: https://css-tricks.com/animating-the-content-property/
Also you can include inside yours <head></head>
tags <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
Arabic Script Language Not Displaying In Firefox
You aren't specifying the encoding. If you rely on default values, such values may not be correct.
Server should send a proper Content-Type
header:
Content-Type: text/html; charset=utf-8
If it doesn't (or there isn't a server involved), you can emulate it in HTML itself:
HTML5
<meta charset="utf-8">
Earlier versions:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
Replace UTF-8 with the actual encoding (though in 2020 the recommended encoding is UTF-8).
does not support Arabic Content in webpage
Try with adding meta charset for arabic at the begning
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=iso-8859-6">
Or you may try it out with following steps :-
Displaying Arabic text using PHP
1. Don't use the short tags <? ?>. Use the full tags <?php ?>
2. Remove the quotes and semicolon from the first line and others that are outside the php tags
"<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">";
3. Close the span tag <span lang='ar-kw'
4. Make sure save the file with utf-8 encoding. You might be saving it with another coding.
Related Topics
How to Make a Chevron Arrow Using CSS
How to Upload a File to My Server Using HTML
How to Make in CSS an Overlay Over an Image
How to Do Awesome Refreshless Page Changes Like Github Do
Twitter Bootstrap Multiple Accordions But Only One Open Panel at a Time
How to Trigger a Phone Call When Clicking a Link in a Web Page on Mobile Phone
Why Do I Need a Doctype? (What Does It Do)
How to Style a File Input Field in Firefox
File Url Cross Domain Issue in Chrome- Unexpected
How to Make Type="Number" to Positive Numbers Only
How to Change the Color of Font Awesome's Cog Icon
Fill Remaining Vertical Space - Only CSS
How to Create a Polygon Shape Div
How to Create a Hidden Div That Doesn't Create a Line Break or Horizontal Space