[问题] 底部延伸版面的置底图如何RWD

楼主: yanggh (yanggh)   2014-12-01 23:21:32
想请前辈帮忙解题@''@
网址如下,是wordpress网站
http://vinoza.com/
主角是底部“未成年请勿饮酒”的警语横幅
目的是要让它全站置底,但要能RWD
我用的方式是在布景设定里新增下列CSS
body { margin-bottom: 55px; background-color: #652164; }
用意是让底部多出额外55px的空间来放置底横幅,不然会盖到Footer
#show_in_foot { width:100%; height: 70px;
position: fixed; bottom: 0px; left: 0px;
z-index: 9999;
background: url (网址太长了这里就省略)
top center no-repeat; background-color: #652164; top center no-repeat }
置底横幅图的语法,但好像有多余或不准确的地方
而且怎么改都没办法有RWD的效果
请教是否要从容器或其他地方去改呢?
还是这段CSS应该怎么改?
google过后试过修改该元素的position, float等CSS语法,但都不对>''<
感谢~
作者: GoalBased (Artificail Intelligence)   2014-12-01 23:26:00
你要什么效果= =?顶多就加一个 text-alxxx:center ?你的会怎样? 字被切掉吗?台啤那个网址有问题你给的两个网站都有缩小阿@@截个涂图来看看?阿..你是不是说,你的分辨率太小,小到比字还小的时候你的字左右都会被截掉,台啤只有右边?
作者: mmis1000 (秋月恋枫)   2014-12-01 23:36:00
多做几个不同宽度的横幅(最小的建议320px),然后用media query切换吧?你给的网站都是固定宽度,根本没做rwd啊?用个容器装呢?http://jsbin.com/tumef/4试着改变银幕比例看看http://jsbin.com/giyode/1跟原本的padding跟背景色会冲到
作者: qazwsx9006 (松鼠!碰器!)   2014-12-02 00:12:00
容器装+1,如果不用容器的话应该就background-size: 100%; background-position:center但放太大会切到
作者: mmis1000 (秋月恋枫)   2014-12-02 00:28:00
background-position:center;在android内建上似乎有问题对会被裁到的图会歪掉
作者: qazwsx9006 (松鼠!碰器!)   2014-12-02 00:38:00
mobile经验太少,学到了~!
作者: mmis1000 (秋月恋枫)   2014-12-02 00:55:00
http://jsbin.com/mutohe 如果不考虑支援度,单用bg似乎也可行4.x的似乎修好了,应该可以用了,反正2.x也不常见了之前在旧android上,发现图被裁到时,变成切齐上缘而不设定的置中,不过新版android(4.3)正常我也没确认过是哪个版本以后才修好的
楼主: yanggh (yanggh)   2014-12-02 01:48:00
好严谨啊!这样已经很足够使用了,再次感谢

Links booklink

Contact Us: admin [ a t ] ucptt.com