0
私が作成しようとしているサンプルのウェブサイトでは、私は縦にではなく横にソーシャルメディアを表示しようとしています...とにかく私のコードでこれを行うことができます私はここにいる？リンクされた画像を水平方向にhtmlやcssで表示する方法
あなたは私がしたい場合、私は写真のファイルを含めることができますが、私は、スタックを介し
.fill-screen {
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
text-align: center;
}
.make-it-fit {
max-width: 99%;
max-height: 99%;
}
@font-face {
font-family: 'Poppins', sans-serif;
font-family: 'Josefin Slab', serif;
}
body {
background-color: #f9f9f9;
}
fieldset {
margin-top: 1em;
margin-bottom: 1em;
padding: .5em;
}
legend {
color: blue;
font-weight: bold;
font-size: 85%;
margin-bottom: .5em;
}
label {
float: left;
width: 90px;
}
input, select {
margin-left: 1em;
margin-right: 1em;
margin-bottom: .5em;
}
input {
width: 14em; \t
}
input[type="radio"], input[type="checkbox"] {
width: 1em;
padding-left: 0;
margin-right: 0.5em;
}<!DOCTYPE html>
<!--bakhriddinov-->
<!-- -->
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Final Project</title>
<script src="index.js"></script>
<link href="index.css" rel="stylesheet" type="text/css" />
<!--font-->
<link href="https://fonts.googleapis.com/css?family=Poppins" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Josefin+Slab" rel="stylesheet">
</head>
<body>
<!--significant element 1 DIV-->
\t <div class='fill-screen' style = "overflow: auto; max-height: 100vh;">
<h2><a id="top"></a></h2>
<img src="takethejourney.png" alt="next" height="70"/>
<br>
<!--significant element 2 IMAGES-->
<a href="index2.html">
<img src="savetheb.gif" alt="MAIN" height="400"/>
</a>
<br>
<br>
<!--significant element 4 LINKS TO OTHER INNER HTML-->
<a href=""> \t
<img class='make-it-fit'
\t src=''>
</a>
<!-- social medias -->
<p></p>
<!--significant element 4 LINKS TO OTHER OUTER HTML-->
<a href="https://www.facebook.com/greenpeace.international?fref=ts">
<img src="64x64facebook.png" alt="greenpeace's facebook" height="20" width="20"/>
</a>
<p></p>
<a href="https://twitter.com/Greenpeace">
<img src="64x64twitter.png" alt="greenpeace's twitter" height="20" width="20"/>
</a>
<p></p>
<a href="https://www.youtube.com/user/GreenpeaceVideo">
<img src="64x64youtube.png" alt="greenpeace's youtube" height="20" width="20"/>
</a>
<p></p>
<a href="http://www.greenpeace.org/">
<img src="greenpeace_logo.png" alt="greenpeace" height="20"/>
</a>
<p></p>
\t \t \t </div>
</body>
</html>をそれを行う方法がわからないんだけどに最も簡単な方法は、あなたに
一般的に、ブートストラップグリッド、またはグリッドを確認するには、div class = col-xs-4 .... –
のようなものです。次に画像を使用する場合は、元のコードが無効になるので、プレースホルダを使用してみてください。 https://placehold.it/ –