开发者

Css for Link buttons (no text) in page header , using Jquery Mobile

开发者 https://www.devze.com 2023-04-12 22:01 出处:网络
Hey I hve made this sample page for me http://jsfiddle.net/9S3a3/12/ , if we have a look at buttons , there is a slight shadow below them , i want to remove those shadows look, i tried resizing margin

Hey I hve made this sample page for me http://jsfiddle.net/9S3a3/12/ , if we have a look at buttons , there is a slight shadow below them , i want to remove those shadows look, i tried resizing margin padding things but not able to do so . 开发者_如何学CAny solution to this ??

----------Edit----------

I was talking about back button and gear button , see this http://i.imgur.com/pgwxr.png


The box-shadows are applied using the .ui-shadow class. So editing that CSS class like below will remove the shadows:

<style>
[data-role="header"] a.ui-shadow {
    box-shadow: none ;
}
</style>

This will remove the box-shadow for any link with the .ui-shadow class that is located inside the data-role="header" element.

Here is a link to an updated version of your fiddle: http://jsfiddle.net/9S3a3/14/

On a side note, I remove the text and box shadow for most elements as it helps improve performance on mobile devices quite a lot.


I didn't get which buttons are you asking about, however, correct me if I am wrong. Add

#nav_header {
    border-bottom: none;
}

to your CSS (http://jsfiddle.net/9S3a3/13/) to remove the shadow (border) under the Featured, Near, New buttons.

0

精彩评论

暂无评论...
验证码 换一张
取 消