blocks|key|2048149|text|<label+for="name"+style="float:right;">Name:</label>|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|2048150|​|unstyled|2048151|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|J|8|@]|9|@]|A|$]]|$1|G|3|-4|5|F|7|K|8|@]|9|@]|A|$]]]|H|$]]

<pre><code>&lt;label for="name" style="float:right;"&gt;Name:&lt;/label&gt;
</code></pre>

<p></p>


blocks|key|5640392|text|你不需要CSS。将您的输入包装在标签中，并将文本放在最后。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5640393|<label><input+type="radio"+name="name"+id="name"/>Name:</label>|code-block|syntax|javascript|5640394|这对你来说仍然是语义的吗？|5640395|或者你可以试试彩车。|5640396|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|P|8|@]|9|@]|A|$]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>You don't need CSS. Wrap your input in a label and put the text last. </p>

<pre><code>&lt;label&gt;&lt;input type="radio" name="name" id="name"/&gt;Name:&lt;/label&gt;
</code></pre>

<p>Is that still semantic for you?</p>

<p>Or you could try the float. </p>


blocks|key|5640413|text|像这样写：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5640414|input{
+float:left;
}|code-block|syntax|javascript|5640415|检查此http://jsfiddle.net/3cLRg/|offset|length|5640416|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/3cLRg/^0|0|0|3|Q|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@$I|V|J|W|1|X]]|A|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|R]]]]

<p>write like this:</p>

<pre><code>input{
 float:left;
}
</code></pre>

<p>Check this <a href="http://jsfiddle.net/3cLRg/" rel="nofollow">http://jsfiddle.net/3cLRg/</a></p>


blocks|key|2048208|text|在这种情况下，标签顺序并不重要。即使它这样做了，它也会是另一种方式-首先你必须创建单选按钮，然后在标签中引用它。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2048209|回答你的问题:只要按照你想要显示的顺序来做就行了|2048210|<input+type="radio"+name="name"+id="name"/>
<label+for="name">Name:</label>|code-block|syntax|javascript|2048211|小提琴http://jsfiddle.net/Jm2JR/1/..|offset|length|2048212|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/Jm2JR/1/^0|0|0|0|3|S|0|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|F|7|W|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|X|8|@]|9|@$K|Y|L|Z|1|10]]|A|$]]|$1|M|3|-4|5|6|7|11|8|@]|9|@]|A|$]]]|N|$O|$5|P|Q|R|A|$S|T]]]]

<p>Tag order in this case doesn't matter. And even if it did, then it would be the other way around - first you would have to create the radio button, and then reference it in the label.</p>

<p>To answer your question: just do it in the order you want to display it</p>

<pre><code>&lt;input type="radio" name="name" id="name"/&gt;
&lt;label for="name"&gt;Name:&lt;/label&gt;
</code></pre>

<p>fiddle <a href="http://jsfiddle.net/Jm2JR/1/" rel="nofollow">http://jsfiddle.net/Jm2JR/1/</a>..</p>


blocks|key|2053890|text|试试这个：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2053891|<label+style="position:relative;+left:100px;"+for="name">Name:</label>
<input+type="radio"+name="name"+id="name"/>|code-block|syntax|javascript|2053892|第二种方法是：|2053893|<input+type="radio"+name="name"+id="name"/>
<label+for="name">Name:</label>|2053894|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>try this:</p>

<pre><code>&lt;label style="position:relative; left:100px;" for="name"&gt;Name:&lt;/label&gt;
&lt;input type="radio" name="name" id="name"/&gt;
</code></pre>

<p>2nd approach is :</p>

<pre><code>&lt;input type="radio" name="name" id="name"/&gt;
&lt;label for="name"&gt;Name:&lt;/label&gt;
</code></pre>


blocks|key|1032267|text|您好，您只需像这样定义您的输入标记|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1032268|<label>Name:
<input+type="radio"+name="name"+id="name"/></label>

<br+/>


<label>
<input+type="radio"+name="name"+id="name"/>+Name++++
</label>
​|code-block|syntax|javascript|1032269|实时演示http://jsfiddle.net/rohitazad/bhBQn/1/|offset|length|1032270|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/rohitazad/bhBQn/1/^0|0|0|4|12|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@$I|V|J|W|1|X]]|A|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|R]]]]

<p>Hi you just define your input tag as like that </p>

<pre><code>&lt;label&gt;Name:
&lt;input type="radio" name="name" id="name"/&gt;&lt;/label&gt;

&lt;br /&gt;


&lt;label&gt;
&lt;input type="radio" name="name" id="name"/&gt; Name    
&lt;/label&gt;
​
</code></pre>

<p>Live demo <a href="http://jsfiddle.net/rohitazad/bhBQn/1/" rel="nofollow">http://jsfiddle.net/rohitazad/bhBQn/1/</a></p>


<p>Say I have the following mark up:</p>

<pre><code>&lt;label for="name"&gt;Name:&lt;/label&gt;
&lt;input type="radio" name="name" id="name"/&gt;
</code></pre>

<p>The order of the tags appear to be proper to me (in a semantic sense: label before the thing you're labeling). But I want to display this as radio button first, followed by the label. How can I do that in CSS?</p>


CSS: how to make label appear right of the radio?

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

假设我有以下标记：<label for="name">Name:</label><input type="radio" name="name" id="name"/>标签的顺序似乎适合我(从语义上讲:在你要标记的东西之前加上标签)。但我想先将其显示为单选按钮，然后显示标签。我如何在CSS中做到这一点？

问CSS:如何让标签出现在广播的右边？
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问CSS:如何让标签出现在广播的右边？EN