웹 페이지의 머리글에 텍스트 및 소셜 미디어 아이콘을 표시합니다.

개인 웹 사이트를 정리하는 중입니다. 그러나 이제는 내 소셜 미디어 아이콘을 배치하여 내 머리글에 정렬하려고합니다. 내가 기압이 무엇인지에 아래를 참조웹 페이지의 머리글에 텍스트 및 소셜 미디어 아이콘을 표시합니다.

enter image description here

텍스트와 페이스 북 아이콘 내 헤더의 하단에 정렬을, 그러나 나는 헤더의 중간에 걸쳐 텍스트와 사이의 공간을 배치 할 아이콘의 상단과 하단이 같아서 중앙에 나타납니다. 아무도 이것으로 나를 도울 수 있습니까? 아이콘과 텍스트 (예 : div.facebookicon)이 포함 된 div를 선택, CSS에서

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1"/> 
<title> Chilun</title> 
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/> 
<style type="text/css"> 
@font-face /* support for browsers & IE v10 onwards*/ 
{font-family:homefont; src: url("Juice.ttf");} 
{font-family:headerfont; src: url("playball.ttf");} 
body {background:url('img/mybackground1.jpg') no-repeat center center fixed;} 
<!-- Make Header Sticky --> 
#header_container {background:#00E5EE; border:0px solid #666; height:60px; left:0; position:fixed; width:100%; top:0;} 
#header{line-height:60px; margin:0 auto; width:940px; text-align:center;display:inline-block; float:right; padding:15px;} 
#wrapper{width:900px;margin:0 auto;} 
a{color:#444;} 
.logo{margin-left:600px;margin-top:100px;background:#fff;padding:10px;} 
.bigtitle{font-family: homefont; font-size:100px; color:#FF0000; text-transform:uppercase; text-align:center; margin-top:200px;} 
.header{font-family: headerfont; font-size:20px; color:#FFFFFF; text-align: left; font-style:italic;} 
</style> 
</head> 
<body> 

<div id="header_container"> 
    <div id="header"><p class="header"> Follow me on: <a style="padding:5; margin:0; href="https://www.facebook.com/chilunliuTheBOSSE"; View my Facebook Profile</a><img src="/img/facebook-lnk.gif" width="40" height="40"></div></p> 
</div> 
    <div id="wrapper"> 
     <h1 class="bigtitle"> Chilun Liu</h1> 
    </div> 

</body> 
</html>

출처

2014-01-29 user1283674

는 그림 단어 천 단어가 아닙니다. 몇 가지 코드를 게시하십시오. – j08691

죄송합니다, 이것을 잊어 버렸습니다. 코드가 – user1283674

표준을 사용

는

코드, 순간에 혼란을 조금 추가 잊으 주셔서 감사합니다 css formattings (facebookicon.div {--css here--}) text-align : center; 명령을 사용하여 옆으로 가운데 정렬 다음 패딩과 여백 (즉, 패딩 : 10px; 원하는 효과를 세로로 내 보냅니다. (가운데를 가운데로 맞추기)

편집 : 예고 d는 텍스트 정렬을 사용했습니다 : 왼쪽; .. 이것이 왜 이렇게 왼쪽으로 밀려 났는지입니다. 당신은 또한이 같은 것을 시도 할 수 :

.className{ 
width:300px; 
height:200px; 
position:absolute; 
left:50%; 
top:50%; 
margin:-100px 0 0 -150px; 
}

(구체적인 실험)이 경우

출처

2014-01-29 20:57:30

에 추가되었습니다. Big Bob에게 감사드립니다. – user1283674

웹 페이지의 머리글에 텍스트 및 소셜 미디어 아이콘을 표시합니다.

답변

관련 문제