CSS不支持阿拉伯语

时间:2014-02-18 09:11:04

标签: html css fonts arabic webfonts

我有以下菜单:

<ul class="menu">
  <li><a href="index.html">Home Page</a></li>
  <li><a href="news.html">Our News</a></li>
  <li><a class="active" href="services.html">Our Services</a></li>
  <li><a href="products.html">Our Products</a></li>
  <li class="last-item"><a href="contacts.html">Contact Us</a></li>
</ul>

问题是,当我在a标签内使用阿拉伯文字时,文字会消失。

举个例子,

<ul class="menu">
  <li><a href="index.html">الر ئيسي</a></li>
  <li><a href="news.html">الاخبار</a></li>
  <li><a class="active" href="services.html">الخدمات</a></li>
  <li><a href="products.html">المنتجات</a></li>
  <li class="last-item"><a href="contacts.html">اتصل بنا</a></li>
</ul>

即使我在HTML页面中使用meta charset="utf-8"。我的css代码:

.menu li a, .list-1 li a, .button-2, .logo {
    text-decoration:none
}
.menu {
    width:100%
}
.menu li {
    float:left;
    position:relative;
    margin-right:1px
}
.menu li.last-item {
    margin:0
}
.menu li a {
    display:inline-block;
    width:196px;
    font-size:17px;
    line-height:1.22em;
    padding:18px 0 36px;
    margin-top:10px;
    color:#fff;
    background:#000;
    text-align:center;
    border-radius:18px 18px 0 0;
    -moz-border-radius:18px 18px 0 0;
    -webkit-border-radius:18px 18px 0 0
}
.menu li a.active, .menu li a:hover {
    color:#0f0f0f;
    background:#fff;
    padding:28px 0 36px;
    margin:0
}

我在此链接中使用的模板 http://www.mediafire.com/download/w5uf9wapenyitn3/myTemplate.rar

4 个答案:

答案 0 :(得分:1)

目前还不清楚您所观察到的问题是什么,但是,只需指定utf-8,因为字符集不足以支持从右到左的语言。首先,您应该始终在HTML中指明语言(即&lt; html lang =“ar”&gt;),并且您应该使用“dir”属性来指定文本方向性(即dir =“rtl”)。

换句话说,对于阿拉伯语页面,人们会希望您的HTML页面以:

开头
<!doctype html>
<html lang="ar" dir="rtl">

有关详细信息,请参阅:
http://www.w3.org/TR/html401/struct/dirlang.html

此外,对于从右到左的语言,您需要填充CSS代码(即将“left”替换为“right”,在组合规则中交换左右值,例如“margin”和“padding” “等,以便正确显示。

答案 1 :(得分:0)

如果您正在使用

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />

试试这个,

<li><a dir="rtl" lang="ar" href="index.html">الر ئيسي</a></li>

dir="rtl"表示从右到左

lang="ar"表示阿拉伯语

答案 2 :(得分:0)

目前尚不清楚你究竟想要什么。

对于阿拉伯语语言,您必须定义方向,使其从右向左开始。

<!DOCTYPE html>
<html lang="ar" dir="rtl">

你必须使用它。另外我可以在本地机器上看到阿拉伯语文本。点击这里enter image description here

答案 3 :(得分:0)

此问题出现在此文件中:

<script src="js/cufon-yui.js" type="text/javascript"></script>

它是一个字体文件,尝试/ 哈希 /它,它会工作 (Y)