Skip to content

hi #18

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
NejiYURI wants to merge 1 commit into
base: master
Choose a base branch
from
Open

hi #18

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
128 changes: 128 additions & 0 deletions 2017-您的回答-neji-yuri.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,128 @@
<!DOCTYPE html>
<!--黃郁恆-->
<html lang="zh">

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title Page</title>

<!-- Bootstrap CSS -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
crossorigin="anonymous">

<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>

<body>


<nav class="navbar navbar-default navbar-inverse" role="navigation">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">(=w=)</a>
</div>

<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-ex1-collapse">


<ul class="nav navbar-nav navbar-right">
<li><a href="#">巴拉</a></li>
<li><a href="#">巴拉巴拉</a></li>
<li><a href="#">巴拉巴拉巴拉</a></li>
<li><button type="button" class="btn btn-defualt navbar-btn btn-warning">刪除頁面</button></li>
</ul>
</div>
<!-- /.navbar-collapse -->
</nav>


<div class="container-fluid">
<div class="row">
<div class="col-xs-10 col-md-10">
<ol class="breadcrumb">
<li>
<a href="#">Home</a>
</li>
<li class="active">Current</li>
</ol>

Copy link

@Evafly Evafly Aug 9, 2017 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

使用巢狀網格系統，這邊盡量多一個<div class="row></div>"把下一層網格包起來歐，這樣才不會容易跑版

<div class="col-md-3">
<img src="https://scontent.ftpe4-1.fna.fbcdn.net/v/t1.0-9/19437674_1507042565984555_572875568620177663_n.jpg?oh=f5c7f4d59460be19dbdc5ae114c77bb7&oe=59FEEC02" class="img-responsive"> 個人相片
</div>
<div class="col-md-6">
<h1 class="text-left">姓名:發條</h1>
<h1 class="text-left">興趣:做糞Game</h1>
<h1 class="text-left">近況:累</h1>
<h1 class="text-left">備註:昱彥還錢!!</h1>
</div>


</div>

<div class="col-xs-2 col-md-2">
Copy link

@Evafly Evafly Aug 9, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

這邊col-xs-2在視窗很小的時候會變得太窄歐，會擠壓到文字

<ul class="list-group">
<a href="#" class="list-group-item active">
這是標題
</a>
<li class="list-group-item">這裡</li>
<li class="list-group-item">不知到</li>
<li class="list-group-item">該放什麼</li>
</ul>

<ul class="list-group">
<a href="#" class="list-group-item list-group-item-warning">
這是標題2
</a>
<li class="list-group-item">芭拉芭拉芭拉芭拉芭拉芭拉 </li>

</ul>
</div>



</div>
</div>



<div class="panel-footer">
<h3 class="text-center">版權沒有，翻印不咎</h1>
</div>











<canvas id="myCanvas" width="480" height="320"></canvas>
Copy link

@Evafly Evafly Aug 9, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

這邊為甚麼要放一個canvas標籤呢XD
這樣視窗寬度縮小到480的時候就凸出去了，會出現卷軸歐





<!-- jQuery -->
<script src="http://code.jquery.com/jquery.js"></script>
<!-- Bootstrap JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
crossorigin="anonymous"></script>
</body>

</html>