谷歌字体问题

Question

谷歌字体问题

6

我想为文本提供两种不同的字体，例如如果有人输入古吉拉特语，则使用Mukta Vani字体，如果是英语，则使用roboto字体。这是否可行？如果有人知道，请帮助我。

table{
  font-family: 'Roboto', sans-serif; /**for english**/
}
table td{
  font-family: 'Mukta Vaani', sans-serif; /**Only for gujarati**/
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<link href="https://fonts.googleapis.com/css?family=Mukta+Vaani:400,500&amp;subset=gujarati" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> 

<table class="table grid-table table-striped  table-hover ">
  <tr><th>Title</th><th>description</th></tr>  
  <tr><td>સ્થળ નક્કી કરવું</td><td>Demo text</td></tr> 
  <tr><td>Test</td><td>Test</td></tr> 
</table>

- ankita patel

你的例子看起来对我来说是正确的。 - Nathaniel Flick

不，现在不正确，因为英文字体也出现在“Mukta Vaani”字体中。 - ankita patel

Mukta字体无法将英文字符转换为梵文，但如果您使用梵文键盘输入字符，则应该可以正常工作（如果我弄错了语言名称，请原谅）。该字体具有英文和梵文字符：https://fonts.google.com/specimen/Mukta - Nathaniel Flick

Mukta Vaani字体可以转换成英文，但roboto无法转换成古吉拉特语，因此我只想在古吉拉特语字母中使用Mukta Vaani字体。 - ankita patel

在PC和Web上呈现古吉拉特语的更多信息，请访问以下网址：http://www.anirdesh.com/gujarati/gujarati-web-pages.php - Nathaniel Flick

显示剩余2条评论

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Temani Afif · Accepted Answer

第二个字体样式将始终被应用。它比第一个更具体，因为它针对的是元素。您可以为非英文文本使用类，并将英文设为的默认文本。

table td,table th{
  font-family: 'Roboto', sans-serif; /**for english**/
}
table td.guj,table th.guj{
  font-family: 'Mukta Vaani', sans-serif; /**Only for gujarati**/
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<link href="https://fonts.googleapis.com/css?family=Mukta+Vaani:400,500&amp;subset=gujarati" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> 

<table class="table grid-table table-striped  table-hover ">
  <tr><th>Title</th><th>description</th></tr>  
  <tr><td class="guj">સ્થળ નક્કી કરવું</td><td>Demo text</td></tr> 
  <tr><td>Test</td><td>Test</td></tr> 
</table>

更新

您可以添加一段jQuery代码来测试内容是否为英语，然后添加类：

/* we suppose that english will only contain letter from a to z and numbers
   update if you want for example to consider special character, dots, quotes, etc */
var eng = /^[A-Za-z0-9]*$/;

$('td,th').each(function() {
  if (!eng.test($(this).text().replace(/\s/g, '')))
    $(this).addClass('guj');
});

table td,
table th {
  font-family: 'Roboto', sans-serif;/**for english**/
}

table td.guj,
table th.guj {
  font-family: 'Mukta Vaani', sans-serif; /**Only for gujarati**/
  color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<link href="https://fonts.googleapis.com/css?family=Mukta+Vaani:400,500&amp;subset=gujarati" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> 

<table class="table grid-table table-striped  table-hover ">
  <tr><th>Title</th><th>description</th></tr>  
  <tr><td >સ્થળ નક્કી કરવું</td><td>Demo text</td></tr> 
  <tr><td>Test</td><td>Test</td></tr> 
</table>