Skip to content

Instantly share code, notes, and snippets.

@Kijacode
Created January 3, 2019 15:42
Show Gist options
  • Save Kijacode/0895a22cc6742e7f76b682e1ccc83ad6 to your computer and use it in GitHub Desktop.
Save Kijacode/0895a22cc6742e7f76b682e1ccc83ad6 to your computer and use it in GitHub Desktop.
I need help in mediaquery syntax in this html file and it css it is below it in the next file
h1 {
color: #ffffff;
}
body {
font-family: 'Open Sans', sans-serif;
background-image: url("C:\Users\Hija\Desktop\__MACOSX\Take.jpf");
}
.container {
width: 1230px;
}
<!DOCTYPE html>
<html>
<head>
<!-- <meta charset="UTF-8"> -->
<title>Take</title>
<!-- Open Graph data -->
<meta name="description" content="A mockup example" />
<meta name="twitter:card" value="summary" />
<meta property="og:title" content="Title Here" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://www.example.com/" />
<meta property="og:image" content="http://example.com/image.jpg" />
<meta property="og:description" content="Description Here" />
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
</head>
<body>
<!--Masthead-->
<div class="countainer">
<div class="row">
<div class="col-md-2">
<img src="assets/logo.JPG" class="logo" />
</div>
<!-- logo -->
</div>
<div class="row">
<div class="col-md-8">
<h1>Picture Perfect</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>
<a href="#">READMORE</a>
</div>
<!--paragraph-->
<div class="col-md-4">
<img src="assets/iphone.jpg" />
</div>
<!--phone Image-->
</div>
<!--Two Columns-->
<div class="row">
<!--Left Column-->
<div class="col-md-6"></div>
<!--Right Column-->
<div class="col-md-6"></div>
</div>
<!--Grid Row-->
<div class="row">
</div>
<!--Four Columns-->
<div class="row">
<!-- Column 1 -->
<div class="col-md-3"></div>
<!-- Column 2 -->
<div class="col-md-3"></div>
<!-- Column 3 -->
<div class="col-md-3"></div>
<!-- Column 4 -->
<div class="col-md-3"></div>
</div>
<!--Full Width Image-->
<div class="row">
<div class="col-md-6"></div>
<!--paragraph-->
</div>
<!--Green Row-->
<div class="row">
<!--column 1-->
<div class="col-md-4"></div>
<!--column 2-->
<div class="col-md-4"></div>
<!--column 3-->
<div class="col-md-4"></div>
</div>
<!--Buying Row-->
<div class="row">
<!--column 1-->
<div class="col-md-5"></div>
<!--column 2-->
<div class="col-md-6"></div>
</div>
<!--Footer Row-->
<div class="row">
<!--column 1-->
<div class="col-md-6"> </div>
<!--paragraph-->
<div class="row\">
<!--column 1-->
<div class="col-md-2"></div>
<!--column 2-->
<div class="col-md-2"></div>
<!--column 3-->
<div class="col-md-2"></div>
</div>
<!--column 2-->
<div class="col-md-5"></div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment