blocks|key|204102|text|你可以在这里找到它：RTL+Bootstrap+v3.2.0。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|204103|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/Kaakati/Bootstrap-Arabic^0|A|K|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

You can find it here: <a href="https://github.com/Kaakati/Bootstrap-Arabic" rel="nofollow">RTL Bootstrap v3.2.0</a>.

blocks|key|4710118|text|网站http://rbootstrap.ir/+2.3.2版的Bootstrap波斯语版本|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4710119|entityMap|0|LINK|mutability|MUTABLE|url|http://rbootstrap.ir/^0|2|L|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

Bootstrap Persian version of the site <a href="http://rbootstrap.ir/" rel="noreferrer">http://rbootstrap.ir/</a> Ver.2.3.2

blocks|key|4709915|text|这是另一个项目：www.nuget.org/packages/Twitter.Bootstrap.RTL|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4709916|entityMap|0|LINK|mutability|MUTABLE|url|http://nuget.org/packages/Twitter.Bootstrap.RTL/^0|8|18|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

This is Another Project: 
<a href="http://nuget.org/packages/Twitter.Bootstrap.RTL/">www.nuget.org/packages/Twitter.Bootstrap.RTL</a>

blocks|key|4710161|text|最后，我可以为从右到左的引导找到一个新版本。在这里分享，供所有人使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4710162|引导-3-3-7-+RTL和RTL引导4.0.0-α6.1|4710163|GitHub链接：|4710164|https://github.com/parsmizban/RTL-Bootstrap|offset|length|4710165|感谢parsmizban.com的创建和分享。|4710166|entityMap|0|LINK|mutability|MUTABLE|url|1|https://parsmizban.com/t/bootstrap-3-3-7-rtl^0|0|0|0|0|17|0|0|2|E|1|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|V|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|W|8|@]|9|@]|A|$]]|$1|F|3|G|5|6|7|X|8|@]|9|@$H|Y|I|Z|1|10]]|A|$]]|$1|J|3|K|5|6|7|11|8|@]|9|@$H|12|I|13|1|14]]|A|$]]|$1|L|3|-4|5|6|7|15|8|@]|9|@]|A|$]]]|M|$N|$5|O|P|Q|A|$R|G]]|S|$5|O|P|Q|A|$R|T]]]]

finally, I can find a new version for the right to left bootstrap. share here for use by all:

bootstrap-3-3-7-rtl
and 
RTL Bootstrap 4.0.0-alpha.6.1 

GitHub link: 

<a href="https://github.com/parsmizban/RTL-Bootstrap" rel="noreferrer">https://github.com/parsmizban/RTL-Bootstrap</a>

thank you <a href="https://parsmizban.com/t/bootstrap-3-3-7-rtl" rel="noreferrer">parsmizban.com</a> for creating and share.

blocks|key|204087|text|我发现这很有帮助，请查看它：http://cdnjs.com/libraries/bootstrap-rtl|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|204088|entityMap|0|LINK|mutability|MUTABLE|url|http://cdnjs.com/libraries/bootstrap-rtl^0|E|14|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

I found this very helpful, check it: <a href="http://cdnjs.com/libraries/bootstrap-rtl" rel="nofollow">http://cdnjs.com/libraries/bootstrap-rtl</a>

blocks|key|204205|text|如果你想让Bootstrap+3在你的站点上支持RTL和LTR，你可以“即时”修改CSS规则，这里附加了一个函数，它修改了Bootstrap+3的主要类，比如col1-(xs%7Csm%7Cmd%7Clg)-(1-12)，col3-(xs%7Csm%7Cmd%7Clg)-push-(1-12)，col1-(xs%7Csm%7Cmd%7Clg)-pull-(1-12)，col-(xs%7Csm%7Cmd%7Clg)-offset-(1-12)，还有更多的类需要修改，但我只需要那些。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|204206|你所需要做的就是调用函数layout.setDirection('rtl')或layout.setDirection('ltr')，它会改变Bootstrap3网格系统的CSS规则。|offset|length|style|CODE|204207|应该可以在所有浏览器(IE>=9)上工作。|204208|++++++++var+layout+=+{};
++++++++layout.setDirection+=+function+(direction)+{
++++++++++++layout.rtl+=+(direction+===+'rtl');
++++++++++++document.getElementsByTagName("html")[0].style.direction+=+direction;
++++++++++++var+styleSheets+=+document.styleSheets;
++++++++++++var+modifyRule+=+function+(rule)+{
++++++++++++++++if+(rule.style.getPropertyValue(layout.rtl+?+'left'+:+'right')+&&+rule.selectorText.match(/\.col-(xs%7Csm%7Cmd%7Clg)-push-\d\d*/))+{
++++++++++++++++++++rule.style.setProperty((layout.rtl+?+'right'+:+'left'),+rule.style.getPropertyValue((layout.rtl+?+'left'+:+'right')));
++++++++++++++++++++rule.style.removeProperty((layout.rtl+?+'left'+:+'right'));
++++++++++++++++}
++++++++++++++++if+(rule.style.getPropertyValue(layout.rtl+?+'right'+:+'left')+&&+rule.selectorText.match(/\.col-(xs%7Csm%7Cmd%7Clg)-pull-\d\d*/))+{
++++++++++++++++++++rule.style.setProperty((layout.rtl+?+'left'+:+'right'),+rule.style.getPropertyValue((layout.rtl+?+'right'+:+'left')));
++++++++++++++++++++rule.style.removeProperty((layout.rtl+?+'right'+:+'left'));
++++++++++++++++}
++++++++++++++++if+(rule.style.getPropertyValue(layout.rtl+?+'margin-left'+:+'margin-right')+&&+rule.selectorText.match(/\.col-(xs%7Csm%7Cmd%7Clg)-offset-\d\d*/))+{
++++++++++++++++++++rule.style.setProperty((layout.rtl+?+'margin-right'+:+'margin-left'),+rule.style.getPropertyValue((layout.rtl+?+'margin-left'+:+'margin-right')));
++++++++++++++++++++rule.style.removeProperty((layout.rtl+?+'margin-left'+:+'margin-right'));
++++++++++++++++}
++++++++++++++++if+(rule.style.getPropertyValue('float')+&&+rule.selectorText.match(/\.col-(xs%7Csm%7Cmd%7Clg)-\d\d*/))+{
++++++++++++++++++++rule.style.setProperty('float',+(layout.rtl+?+'right'+:+'left'));
++++++++++++++++}
++++++++++++};
++++++++++++try+{
++++++++++++++++for+(var+i+=+0;+i+<+styleSheets.length;+i%2B%2B)+{
++++++++++++++++++++var+rules+=+styleSheets[i].cssRules+%7C%7C+styleSheets[i].rules;
++++++++++++++++++++if+(rules)+{
++++++++++++++++++++++++for+(var+j+=+0;+j+<+rules.length;+j%2B%2B)+{
++++++++++++++++++++++++++++if+(rules[j].type+===+4)+{
++++++++++++++++++++++++++++++++var+mediaRules+=+rules[j].cssRules+%7C%7C+rules[j].rules
++++++++++++++++++++++++++++++++for+(var+y+=+0;+y+<+mediaRules.length;+y%2B%2B)+{
++++++++++++++++++++++++++++++++++++modifyRule(mediaRules[y]);
++++++++++++++++++++++++++++++++}
++++++++++++++++++++++++++++}
++++++++++++++++++++++++++++if+(rules[j].type+===+1)+{
++++++++++++++++++++++++++++++++modifyRule(rules[j]);
++++++++++++++++++++++++++++}

++++++++++++++++++++++++}
++++++++++++++++++++}
++++++++++++++++}
++++++++++++}+catch+(e)+{
++++++++++++++++//+Firefox+might+throw+a+SecurityError+exception+but+it+will+work
++++++++++++++++if+(e.name+!==+'SecurityError')+{
++++++++++++++++++++throw+e;
++++++++++++++++}
++++++++++++}
++++++++}|code-block|syntax|javascript|204209|entityMap^0|0|C|Q|13|Q|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|R|8|@$D|S|E|T|F|G]|$D|U|E|V|F|G]]|9|@]|A|$]]|$1|H|3|I|5|6|7|W|8|@]|9|@]|A|$]]|$1|J|3|K|5|L|7|X|8|@]|9|@]|A|$M|N]]|$1|O|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|P|$]]

If you want Bootstrap 3 support for RTL and LTR on your site, you can modify CSS rules "on the fly", attached here is a function, it modifies the major classes for Bootstrap 3 like col-(xs|sm|md|lg)-(1-12), col-(xs|sm|md|lg)-push-(1-12), col-(xs|sm|md|lg)-pull-(1-12), col-(xs|sm|md|lg)-offset-(1-12), there are many more classes to be modified but i needed only those.

All you need to do is call the function <code>layout.setDirection('rtl')</code> or <code>layout.setDirection('ltr')</code> and it will change the CSS Rules for Bootstrap 3 grid system.

Should work on all browsers (IE>=9).

<pre><code> var layout = {};
 layout.setDirection = function (direction) {
 layout.rtl = (direction === 'rtl');
 document.getElementsByTagName("html")[0].style.direction = direction;
 var styleSheets = document.styleSheets;
 var modifyRule = function (rule) {
 if (rule.style.getPropertyValue(layout.rtl ? 'left' : 'right') &amp;&amp; rule.selectorText.match(/\.col-(xs|sm|md|lg)-push-\d\d*/)) {
 rule.style.setProperty((layout.rtl ? 'right' : 'left'), rule.style.getPropertyValue((layout.rtl ? 'left' : 'right')));
 rule.style.removeProperty((layout.rtl ? 'left' : 'right'));
 }
 if (rule.style.getPropertyValue(layout.rtl ? 'right' : 'left') &amp;&amp; rule.selectorText.match(/\.col-(xs|sm|md|lg)-pull-\d\d*/)) {
 rule.style.setProperty((layout.rtl ? 'left' : 'right'), rule.style.getPropertyValue((layout.rtl ? 'right' : 'left')));
 rule.style.removeProperty((layout.rtl ? 'right' : 'left'));
 }
 if (rule.style.getPropertyValue(layout.rtl ? 'margin-left' : 'margin-right') &amp;&amp; rule.selectorText.match(/\.col-(xs|sm|md|lg)-offset-\d\d*/)) {
 rule.style.setProperty((layout.rtl ? 'margin-right' : 'margin-left'), rule.style.getPropertyValue((layout.rtl ? 'margin-left' : 'margin-right')));
 rule.style.removeProperty((layout.rtl ? 'margin-left' : 'margin-right'));
 }
 if (rule.style.getPropertyValue('float') &amp;&amp; rule.selectorText.match(/\.col-(xs|sm|md|lg)-\d\d*/)) {
 rule.style.setProperty('float', (layout.rtl ? 'right' : 'left'));
 }
 };
 try {
 for (var i = 0; i &lt; styleSheets.length; i++) {
 var rules = styleSheets[i].cssRules || styleSheets[i].rules;
 if (rules) {
 for (var j = 0; j &lt; rules.length; j++) {
 if (rules[j].type === 4) {
 var mediaRules = rules[j].cssRules || rules[j].rules
 for (var y = 0; y &lt; mediaRules.length; y++) {
 modifyRule(mediaRules[y]);
 }
 }
 if (rules[j].type === 1) {
 modifyRule(rules[j]);
 }

 }
 }
 }
 } catch (e) {
 // Firefox might throw a SecurityError exception but it will work
 if (e.name !== 'SecurityError') {
 throw e;
 }
 }
 }
</code></pre>

blocks|key|4710135|text|你可以使用我的项目，我用sass和gulp创建了Bootstrap3RTL，这样你就可以很容易地自定义它https://github.com/z-avanes/bootstrap3-rtl|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4710136|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/z-avanes/bootstrap3-rtl^0|1G|16|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

you can use my project
i create bootstrap 3 rtl with sass and gulp so you can easely customize it
<a href="https://github.com/z-avanes/bootstrap3-rtl" rel="nofollow noreferrer">https://github.com/z-avanes/bootstrap3-rtl</a>

There have been questions about this before: 
<a href="https://stackoverflow.com/questions/10545594/twitter-bootstrap-css-that-support-from-rtl-languages">Twitter Bootstrap CSS that support from RTL languages</a>

But all the answers are good for Bootstrap 2.x

I'm working on a project that is in Arabic (rtl), and I need Bootstrap 3.x right to left.

Does anybody know a fix for that?

Right to Left support for Twitter Bootstrap 3

GitHub

以前也有过关于这方面的问题：但是所有的答案对于Bootstrap 2.x来说都是好的我正在做一个项目，这是在阿拉伯语(rtl)，我需要Bootstrap 3.x从右到左。有谁知道解决这个问题的方法吗？

问从右到左支持Twitter Bootstrap 3
EN

回答 7

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问从右到左支持Twitter Bootstrap 3EN

回答 7

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问从右到左支持Twitter Bootstrap 3
EN