（27）-- 用Bootstrap写的OPPO官网商城

最新推荐文章于 2022-12-17 10:10:08 发布

Fredreck1919

最新推荐文章于 2022-12-17 10:10:08 发布

阅读量2.1k

点赞数 1

分类专栏： HTML基础 Web基础 JavaScript 文章标签： Bootstrap

本文链接：https://blog.csdn.net/Fredreck1919/article/details/79140308

版权

#用Bootstrap写的OPPO官网商城首页

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">	
	<style>
		body,ul,li{
			padding: 0px;
			margin: 0px;
			list-style: none;
		}
		body{
			height: 3000px;
			padding-top:20px;
		}
		.item1,.item2,.item3,.item4{
			width: 186px;
			height: 140px;
			float: left;
		}
		.item5{
			width: 200px;
			height: 140px;
			float: right;
		}
		.item6{
			width: 40%px;
			height: 25px;
			float: left;
		}
		.item7{
			width: 20%px;
			height: 25px;
			float: right;
		}
	</style>
	<link rel="stylesheet" href="./public/css/bootstrap.min.css">
	<script src="./public/js/jQuery.1.12.4.js"></script>
	<script src="./public/js/bootstrap.min.js"></script>


	
</head>
<body>
	<div class="container-fluid">
		<nav class="navbar navbar-default navbar-fixed-top">
 <div class="row">
  <div class="col-md-3"> <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <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="#">OPPO</a>
    </div></div>
  <div class="col-md-6"><!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li><a href="#">手机</a></li>
        <li

最低0.47元/天解锁文章

Fredreck1919

关注

1
点赞
踩
9

收藏

觉得还不错? 一键收藏
1
评论
（27）-- 用Bootstrap写的OPPO官网商城

#用Bootstrap写的OPPO官网商城首页 Document body,ul,li{ padding: 0px; margin: 0px; list-style: none; } body{ height: 3000px; padding-top:20px; } .item1,
复制链接

扫一扫