[问题] 新手CSS问题请益 james999 PTT批踢踢实业坊

[问题] 新手CSS问题请益

楼主: james999 (无伤大雅) 2018-01-12 08:30:15

最近想要做一简单的网页，
阅读过相关CSS的资料，
但实际要应用却遇到困难..
红色部份为一logo，
右边绿色部份为二个input Text，
黑色部份为一字串，
红色上标下标相等于2个绿色的上标下标，
黑色则在上述元件下方。
https://imgur.com/a/a4MZz
请板友提供些指引，谢谢:)
p.s. 主要是不晓得绿和红中间的空白该怎么办

作者: diabloevagto (wi) 2018-01-12 08:56:00

Flexbox

作者: sanyaoooo (山药) 2018-01-12 08:57:00

所以你希望呈现什么样子？抱歉我误会了XD 不要理我

楼主: james999 (无伤大雅) 2018-01-12 11:08:00

希望能用CSS3就能达成@@没办法加装额外套件！

作者: lovetoshinya (è‰¾å¤šå¿ƒå¤œ) 2018-01-12 11:46:00

先上下两个div 上面再切2个div用flexbox定logo跟input 黑色用p下置中就好

作者: idareyou (HellTraveller) 2018-01-12 17:14:00

最快的解法是用table 左右两个元素都固定宽度考虑到手机板会使用display:table来模拟flexbox是对的，但不是最正确的(可悲的旧IE用户)https://jsfiddle.net/kos0616/3wbr9v2u/1/https://jsfiddle.net/kos0616/05ooeq55/ divTable但我还是建议用flexbox

作者: Rinorune (杜) 2018-01-12 21:03:00

比较快就input绝对定位右上右下https://jsfiddle.net/zcjy7k39/

楼主: james999 (无伤大雅) 2018-01-12 21:49:00

谢谢大家，感谢R大的教学:)

作者: sanyaoooo (山药) 2018-01-12 23:29:00

如果图我没看错的话，R大是放在<header>，不是放在<head>，两个是不一样的喔

作者: lovetoshinya (è‰¾å¤šå¿ƒå¤œ) 2018-01-12 23:54:00

你的标签跟内容全部都要放在body里面才对

楼主: james999 (无伤大雅) 2018-01-12 23:59:00

唉呀谢谢两位可以正常显示了我真粗心冏

作者: lovetoshinya (è‰¾å¤šå¿ƒå¤œ) 2018-01-14 22:25:00

楼主: james999 (无伤大雅) 2018-01-14 23:09:00

span依旧无法字会出现在图片下方Orz还是得像input一定强迫定位在input的前方之类的@@?

作者: sanyaoooo (山药) 2018-01-15 21:01:00

因为input是用absolute，我直接改在R大的范例网址https://jsfiddle.net/zcjy7k39/1/建议把范例中的CSS弄清楚，有问题才知道是出在哪里

继续阅读

[请益] 加入[email protected]群组后的赠品机制(google表单?)onewalker [请益] 询问wordpress的排版&付费LisaGi ［征才］共识科技征网页UI设计holise71 [问题] Html or CSS Form问题询问aa12783509 [问题] mno1204 [问题] Asp档当中用javascript 放音乐无效？kakaloto [问题] 请问wordpress的页首图片更换..beyonina [问题] 请问mojo的wordpress pro包Giojo [问题] Vue.js SPA下navbar样式转换yuanchen1103 [心得] 分享自己的个人网站求鞭yorock