텍스트 및 이미지를 인라인으로 가져 오는 데 도움이 필요합니다 (Jquery)

텍스트와 이미지를 같은 줄에 가운데 정렬해야합니다. 메신저 jquery에서 data-role = "header"함수를 사용하지만, 한 줄로 모든 것을 가져 와서 중앙에있는 것처럼 보입니다. CSS의는 JQuery와 표준텍스트 및 이미지를 인라인으로 가져 오는 데 도움이 필요합니다 (Jquery)

<html> 
     <head> 
      <meta charset="utf-8"> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <title>jQuery</title> 
       <link rel="stylesheet" href="themes/scavenger-hunt.min.css" /> 
      <link rel="stylesheet" href="Publish/jquery-mobile/jquery.mobile.structure-1.0.min.css" /> 
      <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script> 
      <script src="http://code.jquery.com/mobile/1.3.0-rc.1/jquery.mobile-1.3.0-rc.1.min.js"></script> 
     <body> 

<div data-role="page" id="home"> 
    <div data-role="header"> 
    <h1>Scavenger</h1><img src="images/logosh.png" alt="logo" width="50" height="50" align="absmiddle"><h1>Hunt</h1> 
</div>

출처

2013-02-23 saulpm

그래서 당신은 폐품 사냥을 갖고 싶어? – BenM

가 HTML에서 마지막으로 H1의 먼저 이미지를 넣어 CSS는 여기에 내가 강하게에서에 추천 바이올린 http://jsfiddle.net/tbd5f/1/

출처

2013-02-23 21:16:06

I * think * OP는 이미지와 텍스트를 한 줄로 (예 : 양쪽 모두'display : inline',하지만 헤더의 중앙에 위치) 생각합니다. – BenM

의이

#home > div h1:first-child {float:left} 
#home > div h1 {float:right} 
img {display:block; margin-left:auto; margin-right:auto;}

같아야입니다 헤더를 두 개의 분리 된 <h1> 엘리먼트로 나누는 것은 불필요하고 너무 정확하지 않기 때문에 가능합니다 : P

자신의 HTML 코드 :

<h1> 
    Scavenger 
    <img src="http://placehold.it/50x50" alt="logo" width="50" height="50" align="absmiddle"> 
    Hunt 
</h1>

그리고이 CSS :

h1 { 
    text-align: center; 
}

출처

2013-02-23 21:22:34 Terry

텍스트 및 이미지를 인라인으로 가져 오는 데 도움이 필요합니다 (Jquery)

답변

관련 문제