Hình ảnh trong jquery Mobile Header

Tôi đang cố gắng thêm hình ảnh vào tiêu đề của trang web dựa trên jQuery Mobile của tôi. Tôi muốn hình ảnh được căn chỉnh về cạnh phải và sử dụng CSS cho mục đích này. Nhưng kết quả là không thỏa đáng.There là một khoảng cách lớn giữa hình ảnh và cạnh và nó cũng không phù hợp với văn bản tiêu đề. Đây là mã tiêu đề:Hình ảnh trong jquery Mobile Header

<header data-role='header'><h1>My App<img src="my_logo.png" alt="Low resolution logo"class="align-right"/></h1></header>

và đây là đoạn code css cho lớp class-right:

.align-right 
    { 
float:right; 
margin-right: 5px; 


    }

Nguồn

2012-03-15 user1107888

Something như thế này nên làm việc:

<head> 
    <style> 
    body{ margin: 0; } 
    .align-right{ float:right; margin-right: 0px;} 
    </style> 
</head> 
<body> 
<div data-role='header'><h1>My App<img src="my_logo.png" alt="Low resolution logo"class="align-right"/></h1></div> 
</body>

Nguồn

2012-03-15 15:15:28 greatwitenorth

Phương pháp này cũng không hoạt động – user1107888

Dựa trên mã của bạn ví dụ, bạn cần một khoảng trống giữa thuộc tính alt và thuộc tính class.

Bạn có:

alt="Low resolution logo"class="align-right"

nên là:

alt="Low resolution logo" class="align-right"

Ngoài ra, nó có lẽ là tốt hơn để không có thẻ <img /> bên trong của nguyên tố <h1> của bạn.

Kiểm tra các tài liệu để biết thêm thông tin về tiêu đề tùy chỉnh: http://jquerymobile.com/test/docs/toolbars/docs-headers.html

Nguồn

2012-03-15 15:24:02 shanabus

Không cần phải thêm phong cách tùy chỉnh hoặc như vậy. Jquery-Mobile đã có sẵn các giải pháp cho việc này. Chỉ cần thêm lớp 'ui-btn-left' hoặc 'ui-btn-right' vào ảnh của bạn (như thể nó là một nút) và bạn đã sẵn sàng.

<header data-role="header"> 
<h1>My App</h1> 
<img src="my_logo.png" class="ui-btn-right" /> 
</header>

Tôi biết câu hỏi đã được hỏi trước đây, nhưng tôi nhận thấy điều này có thể giúp những người vẫn đang tìm kiếm giải pháp. Bên cạnh đó, câu hỏi chưa được trả lời.

Nguồn

2012-10-08 13:31:28

Hình ảnh trong jquery Mobile Header

Trả lời

Các vấn đề liên quan