Commit 47a62002 authored by nittaya chompoosan's avatar nittaya chompoosan

project

parent f6df3eee
No related merge requests found
This source diff could not be displayed because it is too large. You can view the blob instead.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="about.css" type="text/css"> </head>
<body class="text-center bg-primary">
<div class="text-center text-capitalize w-100" style="background-image: url('C:/Users/User/Desktop/nid/mancora-peru-sky-sea-ocean-umbrella-couch-beach-sand-beach.jpg');background-size:cover;background-position:center center;">
<div class="container py-5">
<div class="row">
<div class="border-primary col-md-4 col-xl-9">
<h1 class="display-3 mb-4 navbar-light text-left text-dark text-uppercase">Phuket&nbsp;
<br>&nbsp; &nbsp; &nbsp; Travel</h1>
</div>
</div>
</div>
</div>
<div class="py-2 bg-dark w-100">
<div class="container">
<div class="row">
<div class="col-md-3">
<a class="btn btn-lg btn-primary" href="home.html"> หน้าหลัก </a>
</div>
<div class="col-md-3">
<a class="btn btn-lg btn-primary" href="tp0.html"> แพ็คเกจและโปรโมชั่น </a>
</div>
<div class="col-md-3">
<div class="btn-group btn-group-lg">
<button class="btn dropdown-toggle btn-primary" data-toggle="dropdown"> เที่ยวภูเก็ต </button>
<div class="dropdown-menu">
<a class="dropdown-item" href="phuket1.html">ที่กิน</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket2.html">ที่เที่ยว</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket3.html">ที่พัก</a>
</div>
</div>
</div>
<div class="col-md-3">
<a class="btn btn-lg btn-secondary" href="about.html"> เกี่ยวกับ </a>
</div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="row">
<div class="col-md-6">
<p class="lead">
<br>
<br>
<br> </p>
<img class="img-fluid d-block py-5 rounded-circle" src="C:/Users/User/Desktop/nid/nid.jpg"> </div>
<div class="col-md-6">
<p class="lead text-center">
<br>
<br>
<br>
<br>
<u><b></b></u>
</p>
<h2>
<u><b>Profile</b></u>
</h2>
<br>
<p class="lead text-left">Name : Nittaya Chompoosan
<br>Nickname : Nid
<br>Age : 18 &nbsp;&nbsp;
<br>Blood group : AB
<br>Birth day : 18 August 1996
<br>Ethnicity : Thai &nbsp; Nationality : Thai &nbsp; Religion : Buddha
<br>Native Habital : House No.5 Village : 5 District : Mad/ Lueamnat Province: Amnatcharoen 37120
<br>Tel : 062-9582949
<br>E-mail : love_nid11@hotmail.com
<br>Education : Ubon Ratchathani University</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="">
<div class="container">
<div class="row">
<div class="my-3 col-lg-12">
<h3>Follow</h3>
<a href="https://web.facebook.com/nittaya.chompoosan" target="blank"><i class="fa fa-facebook-square text-muted fa-3x m-2"></i></a>
<a href="https://www.instagram.com/nittaya_cps/" target="blank"><i class="fa fa-3x fa-instagram m-2 text-muted"></i></a>
<a href="https://twitter.com/Nittaya_cps" target="blank"><i class="fa fa-3x fa-twitter m-2 text-muted"></i></a>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<pingendo onclick="window.open('https://pingendo.com/', '_blank')" style="cursor:pointer;position: fixed;bottom: 10px;right:10px;padding:4px;background-color: #00b0eb;border-radius: 8px; width:180px;display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:14px;color:white">Made with Pingendo&nbsp;&nbsp;
<img src="https://pingendo.com/site-assets/Pingendo_logo_big.png" class="d-block" alt="Pingendo logo" height="16">
</pingendo>
</body>
</html>
\ No newline at end of file
/*!
* Based on Bootstrap v4.0.0 (https://getbootstrap.com)
*/
// Options
//
// Quickly modify global styling by enabling or disabling optional features.
$enable-rounded: true !default;
$enable-shadows: true;
$enable-transitions: true;
$enable-hover-media-query: false;
$enable-grid-classes: true;
$enable-print-styles: true;
// Variables
//
// Colors
$theme-colors: (
primary: #f1cd31,
secondary: #f70655,
light: #f3f3f3,
dark: #303030,
info: #009ac0,
success: #28a745,
warning: #ffc107,
danger: #dc3545
);
$body-bg: #111;
$body-color: #efefef;
$body-color-inverse: invert($body-color) !default;
$link-color: #f1cd31;
// Fonts
$font-family-base: 'Comic Sans MS', cursive, sans-serif;
$headings-font-family: 'Comic Sans MS', cursive, sans-serif;
$display-font-family: 'Comic Sans MS', cursive, sans-serif;
$font-weight-normal: 200;
$headings-font-weight: 200;
$lead-font-size: 1.30rem;
$spacer: 1.5rem;
$font-size-base: 0.85rem;
$border-radius: 1rem;
$border-radius-lg: $border-radius * 1.2;
$border-radius-sm: $border-radius * .8;
@import 'bootstrap-4.0.0';
html,body {
height:100%;
}
.cover {
min-height:100%;
display:flex;
align-items:center
}
.bg-gradient {
overflow: hidden;
color: color-yiq(map-get($theme-colors, 'primary'));
background: linear-gradient(-30deg, theme-color("secondary") 0%, theme-color("primary") 50%, theme-color("primary") 100%);
}
.filter-dark {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'dark'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'dark'), 0.75);
}
}
.filter-light {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'light'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'light'),0.75);
}
}
.filter-color {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'primary'), 0.75);
}
}
.filter-gradient {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient(-30deg, transparentize(theme-color("secondary"), 0.1) 0%, transparentize(theme-color("primary"), 0.1) 50%, transparentize(theme-color("primary"), 0.05) 100%);
}
}
.filter-fade-in {
overflow: hidden;
position: relative;
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient($body-bg, transparentize($body-bg, 0.2),transparentize($body-bg, 0.9),transparentize($body-bg, 1));
}
}
week05/windowapp/Pingendo/New Site/assets/conference/action.jpg

53.9 KB

week05/windowapp/Pingendo/New Site/assets/conference/cover.jpg

82.7 KB

week05/windowapp/Pingendo/New Site/assets/conference/live.jpg

123 KB

week05/windowapp/Pingendo/New Site/assets/conference/logo_1.png

9.28 KB

week05/windowapp/Pingendo/New Site/assets/conference/logo_2.png

3.4 KB

week05/windowapp/Pingendo/New Site/assets/conference/logo_3.png

6.1 KB

week05/windowapp/Pingendo/New Site/assets/conference/logo_4.png

6.13 KB

week05/windowapp/Pingendo/New Site/assets/conference/people_1.jpg

141 KB

week05/windowapp/Pingendo/New Site/assets/conference/people_2.jpg

132 KB

week05/windowapp/Pingendo/New Site/assets/conference/people_3.jpg

122 KB

week05/windowapp/Pingendo/New Site/assets/conference/people_4.jpg

138 KB

week05/windowapp/Pingendo/New Site/assets/conference/people_5.jpg

88.6 KB

week05/windowapp/Pingendo/New Site/assets/conference/people_6.jpg

187 KB

week05/windowapp/Pingendo/New Site/assets/conference/venue.jpg

193 KB

week05/windowapp/Pingendo/New Site/assets/styleguide/cover_1.jpg

52.6 KB

week05/windowapp/Pingendo/New Site/assets/styleguide/cover_2.jpg

68.7 KB

week05/windowapp/Pingendo/New Site/assets/styleguide/cover_3.jpg

56.5 KB

week05/windowapp/Pingendo/New Site/assets/styleguide/cover_4.jpg

81.4 KB

week05/windowapp/Pingendo/New Site/assets/styleguide/people_1.jpg

18.9 KB

week05/windowapp/Pingendo/New Site/assets/styleguide/people_2.jpg

80.7 KB

week05/windowapp/Pingendo/New Site/assets/styleguide/people_3.jpg

21.7 KB

week05/windowapp/Pingendo/New Site/assets/styleguide/people_4.jpg

100 KB

week05/windowapp/Pingendo/New Site/assets/styleguide/people_5.jpg

27.4 KB

week05/windowapp/Pingendo/New Site/assets/styleguide/people_6.jpg

57.8 KB

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- PAGE settings -->
<link rel="icon" href="https://templates.pingendo.com/assets/Pingendo_favicon.ico">
<title>Conference Neon - Pingendo template</title>
<meta name="description" content="Free Bootstrap 4 Pingendo Neon template for unique events.">
<meta name="keywords" content="Pingendo conference event neon free template bootstrap 4">
<!-- CSS dependencies -->
<link rel="stylesheet" href="neon.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<!-- Script: Make my navbar transparent when the document is scrolled to top -->
<script src="js/navbar-ontop.js"></script>
<!-- Script: Animated entrance -->
<script src="js/animate-in.js"></script>
</head>
<body class="text-center">
<!-- Navbar -->
<!-- Cover -->
<div class="text-center text-capitalize w-100" style="background-image: url('../../nid/mancora-peru-sky-sea-ocean-umbrella-couch-beach-sand-beach.jpg');background-size:cover;background-position:center center;">
<div class="container py-5">
<div class="row">
<div class="border-primary col-md-4 col-xl-9">
<h1 class="display-3 mb-4 navbar-light text-left text-dark text-uppercase">Phuket&nbsp;
<br>&nbsp; &nbsp; &nbsp; Travel</h1>
</div>
</div>
</div>
</div>
<div class="py-2 bg-dark">
<div class="container">
<div class="row">
<div class="col-md-3">
<a class="btn btn-lg btn-secondary" href="home.html">หน้าหลัก</a>
</div>
<div class="col-md-3">
<a class="btn btn-primary btn-lg" href="tp0.html">แพ็คเกจและโปรโมชั่น</a>
</div>
<div class="col-md-3">
<div class="btn-group btn-group-lg">
<button class="btn btn-primary dropdown-toggle" data-toggle="dropdown"> เที่ยวภูเก็ต </button>
<div class="dropdown-menu">
<a class="dropdown-item" href="phuket1.html">ที่กิน</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket2.html">ที่เที่ยว</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket3.html">ที่พัก</a>
</div>
</div>
</div>
<div class="col-md-3">
<a class="btn btn-primary btn-lg" href="about.html"> เกี่ยวกับ </a>
</div>
</div>
</div>
</div>
<div class="py-5 bg-primary filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<div id="carousel" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block img-fluid w-100" src="../../nid/พื้นหลัง (2).jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/ที่พัก (5).jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/Patong-Beach-Phuket2.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/kata-beach3.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/ที่พักก.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/วิว.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/หาดราไวย์-16.jpg"> </div>
</div>
<a class="carousel-control-prev" href="#carousel" role="button" data-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a>
<a class="carousel-control-next" href="#carousel" role="button" data-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="sr-only">Next</span> </a>
</div>
</div>
</div>
</div>
</div>
<!-- Intro section -->
<!-- Speakers -->
<!-- Schedule -->
<!-- Sponsor logos -->
<!-- Call to action -->
<!-- Footer -->
<!-- JavaScript dependencies -->
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<!-- Script: Smooth scrolling between anchors in a same page -->
<script src="js/smooth-scroll.js"></script>
<pingendo onclick="window.open('https://pingendo.com/', '_blank')" style="cursor:pointer;position: fixed;bottom: 10px;right:10px;padding:4px;background-color: #00b0eb;border-radius: 8px; width:180px;display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:14px;color:white">Made with Pingendo&nbsp;&nbsp;
<img src="https://pingendo.com/site-assets/Pingendo_logo_big.png" class="d-block" alt="Pingendo logo" height="16">
</pingendo>
</body>
</html>
\ No newline at end of file
/**
* animate-in.js 1.0.0
* Animate elements on entrance
*
* Usage:
*
* Make sure to add this to the <head> of your page to avoid flickering on load
* Based on https://andycaygill.github.io/scroll-entrance/
*/
(function() {
//Set up defaults
var duration = "1000";
var heightOffset = 100;
// document.write("<style id='temp-animate-in'>*[class^='animate-in'], *[class*=' animate-in'] {display:none}</style>")
function isElementVisible(elem) {
var rect = elem.getBoundingClientRect();
//Return true if any of the following conditions are met:
return (
// The top is in view: the top is more than 0 and less than the window height (the top of the element is in view)
( (rect.top + heightOffset) >= 0 && (rect.top + heightOffset) <= window.innerHeight ) ||
// The bottom is in view: bottom position is greater than 0 and greater than the window height
( (rect.bottom + heightOffset) >= 0 && (rect.bottom + heightOffset) <= window.innerHeight ) ||
// The top is above the viewport and the bottom is below the viewport
( (rect.top + heightOffset) < 0 && (rect.bottom + heightOffset) > window.innerHeight )
)
}
function update() {
var nodes = document.querySelectorAll("*:not(.animate-in-done)[class^='animate-in'], *:not(.animate-in-done)[class*=' animate-in']")
for (var i = 0; i < nodes.length; i++) {
if (isElementVisible(nodes[i])) {
nodes[i].classList.remove("out-of-viewport")
nodes[i].classList.add("animate-in-done")
} else {
nodes[i].classList.add("out-of-viewport")
}
}
}
document.addEventListener("DOMContentLoaded", function(event) {
update()
// setTimeout(function() {
// document.querySelector("#temp-animate-in").remove()
// })
});
window.addEventListener("scroll", function() {
update()
})
})();
/**
* navbar-ontop.js 1.0.0
* Add .navbar-ontop class to navbar when the page is scrolled to top
* Make sure to add this script to the <head> of page to avoid flickering on load
*/
(function() {
var className = "navbar-ontop"
// we start hidden, to avoid flickering
document.write("<style id='temp-navbar-ontop'>.navbar {opacity:0; transition: none !important}</style>")
function update() {
// toggle className based on the scrollTop property of document
var nav = document.querySelector(".navbar")
if (window.scrollY > 15)
nav.classList.remove(className)
else
nav.classList.add(className)
}
document.addEventListener("DOMContentLoaded", function(event) {
$(window).on('show.bs.collapse', function (e) {
$(e.target).closest("." + className).removeClass(className);
})
$(window).on('hidden.bs.collapse', function (e) {
update()
})
update()
// still hacking to avoid flickering
setTimeout(function() {
document.querySelector("#temp-navbar-ontop").remove()
})
});
window.addEventListener("scroll", function() {
update()
})
})();
\ No newline at end of file
/**
* smooth-scroll.js 1.0.0
* Make your page scrolling smooth
* Requires JQuery - Does not work with JQuery slim
* Based on https://css-tricks.com/snippets/jquery/smooth-scrolling/
*/
(function() {
var duration = 500
$('a[href*="#"]')
// Remove links that don't actually link to anything
.not('[href="#"]')
.click(function(event) {
// On-page links
if (
location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '')
&&
location.hostname == this.hostname
) {
// Figure out element to scroll to
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) + ']')
// Does a scroll target exist?
if (target.length) {
// Only prevent default if animation is actually gonna happen
event.preventDefault()
$('html, body').animate({
scrollTop: target.offset().top
},
duration, function() {
// Callback after animation
// Must change focus!
var $target = $(target);
$target.focus();
if ($target.is(":focus")) { // Checking if the target was focused
return false;
} else {
$target.attr('tabindex','-1'); // Adding tabindex for elements not focusable
$target.focus(); // Set focus again
};
});
}
}
});
})();
This source diff could not be displayed because it is too large. You can view the blob instead.
/*!
* Neon Pingendo template (https://templates.pingendo.com)
* Based on: Bootstrap v4.0.0 (https://getbootstrap.com)
* Copyright 2014-2018 Pingendo (https://pingendo.com)
*/
@import url('https://fonts.googleapis.com/css?family=Montserrat:200');
// Options
//
// Quickly modify global styling by enabling or disabling optional features.
$enable-rounded: true;
$enable-shadows: false;
$enable-transitions: true;
$enable-hover-media-query: false;
$enable-grid-classes: true;
$enable-print-styles: true;
// Variables
//
// Colors
$theme-colors: (
primary: #f1cd31,
secondary: #f70655,
light: #f3f3f3,
dark: #303030,
info: #009ac0,
success: #28a745,
warning: #ffc107,
danger: #dc3545
);
$body-bg: #111;
$body-color: #efefef;
$body-color-inverse: invert($body-color) !default;
$link-color: #f1cd31;
$link-hover-color: white;
$link-hover-decoration: none;
// Fonts
$font-family-base: 'Comic Sans MS', cursive, sans-serif;
$headings-font-family: 'Comic Sans MS', cursive, sans-serif;
$font-weight-normal: 200;
$headings-font-weight: 200;
$lead-font-size: 1.30rem;
$line-height-base: 1.8;
// Components
$border-width: 1px;
$component-active-color : map-get($theme-colors,"dark");
// Buttons
$input-btn-padding-x-lg: 1.1rem;
$input-btn-padding-x: 1rem !default;
// Cards
$card-border-width: 0px;
$card-bg: rgba(#333,.5);
// Breadcrumb
$breadcrumb-bg: transparent !default;
$breadcrumb-active-color: map-get($theme-colors,"light");
// Carousel
$carousel-caption-width: 100% !default;
$carousel-indicator-height: 6px !default;
//Images
$thumbnail-border-color: map-get($theme-colors,"primary");
// Forms
$form-group-margin-bottom: 0rem;
// Nav tabs
$nav-tabs-border-color: map-get($theme-colors,"primary");
$nav-tabs-link-hover-border-color: transparent;
$nav-tabs-link-active-color: $component-active-color;
$nav-tabs-link-active-bg: map-get($theme-colors,"primary");
$nav-tabs-link-active-border-color: $nav-tabs-border-color;
// Nav pills
$nav-pills-link-active-color: $component-active-color !default;
// Navbar
$navbar-light-color: rgba(black,.6);
// Pagination
$pagination-bg: $body-bg;
$pagination-border-color: map-get($theme-colors,"dark");
$pagination-hover-bg: $body-bg;
$pagination-hover-border-color: $pagination-border-color;
$pagination-active-color: $component-active-color;
$pagination-active-bg: map-get($theme-colors,"primary");
$pagination-active-border-color: map-get($theme-colors,"dark");
// List group
$list-group-bg: $body-bg;
$list-group-border-color: map-get($theme-colors,"dark");
$list-group-hover-bg: $body-bg;
$list-group-active-color: $component-active-color;
$list-group-action-color: $link-color;
$list-group-active-border-color: map-get($theme-colors,"dark");
$list-group-action-hover-color: map-get($theme-colors,"light");
$list-group-action-active-color: $body-color !default;
$list-group-action-active-bg: transparent;
// Horizontal rule
$hr-border-color: rgba(map-get($theme-colors,"primary"),.75);
// Tables
$table-accent-bg: rgba(map-get($theme-colors,"light"),.05);
$table-inverse-bg: rgba(map-get($theme-colors,"light"),.5);
$table-hover-bg: rgba(map-get($theme-colors,"light"),.1);
$table-border-color: map-get($theme-colors,"dark");
$font-size-base: 0.85rem;
$display-font-family: 'Comic Sans MS', cursive, sans-serif;
$spacer: 1.5rem;
$border-radius: 1rem;
$border-radius-lg: $border-radius * 1.2;
$border-radius-sm: $border-radius * .8;
@import 'bootstrap-4.0.0';
html,body {
height:100%;
}
.section-fade-in-out {
position: relative;
color:white;
background-size:cover;
background-position: center;
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient($body-bg, transparentize($body-bg, 0.2),transparentize($body-bg, 0.8),transparentize($body-bg, 0.2), $body-bg);
}
}
.section-fade-in {
position: relative;
color:white;
background-size:cover;
background-position: center;
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient($body-bg, transparentize($body-bg, 0.2),transparentize($body-bg, 0.8));
}
}
.section-fade-out {
position: relative;
color:white;
background-size:cover;
background-position: center;
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient(transparentize($body-bg, 0.8),transparentize($body-bg, 0.2), $body-bg);
}
}
.shadowed {
box-shadow: 0px 0px 10px #000;
}
.carousel {
.carousel-caption {
padding-top:50px;
padding-bottom:20px;
bottom:0px;
background: linear-gradient(transparent 10%, transparentize($body-bg, 0) 100%);
}
.carousel-control-next, .carousel-control-prev {
opacity:0.85;
}
.carousel-indicators {
bottom: 0px;
}
}
mark {
&.primary {
background-color: map-get($theme-colors,"primary");
color: black;
}
&.secondary {
background-color: map-get($theme-colors,"secondary");
color: white;
}
}
.cover {
min-height: 100%;
}
/* Animate state between .navbar and .navbar-ontop */
.navbar {
transition: background-color .5s ease-out;
}
.navbar-ontop {
background-color: transparent !important;
}
/* Animate on entrance */
.animate-in-down {
transition: all 1.3s ease-out;
position:relative;
opacity:1;
top:0px;
&.out-of-viewport {
top:40px;
opacity:0;
}
}
.animate-in-left {
transition: all 1.0s ease-out;
position:relative;
opacity:1;
left:0%;
&.out-of-viewport {
opacity:0;
left:-5%;
}
}
.animate-in-right {
transition: all 1.0s ease-out;
position:relative;
opacity:1;
left:0%;
&.out-of-viewport {
opacity:0;
left:5%;
}
}
.filter-light {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'light'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'light'),0.75);
}
}
This source diff could not be displayed because it is too large. You can view the blob instead.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="phuket1.css" type="text/css"> </head>
<body class="text-center bg-primary">
<div class="text-center text-capitalize w-100" style="background-image: url('C:/Users/User/Desktop/nid/mancora-peru-sky-sea-ocean-umbrella-couch-beach-sand-beach.jpg');background-size:cover;background-position:center center;">
<div class="container py-5">
<div class="row">
<div class="border-primary col-md-4 col-xl-9">
<h1 class="display-3 mb-4 navbar-light text-left text-dark text-uppercase">Phuket&nbsp;
<br>&nbsp; &nbsp; &nbsp; Travel</h1>
</div>
</div>
</div>
</div>
<div class="py-2 bg-dark w-100">
<div class="container">
<div class="row">
<div class="col-md-3">
<a class="btn btn-lg btn-primary" href="home.html"> หน้าหลัก </a>
</div>
<div class="col-md-3">
<a class="btn btn-lg btn-primary" href="tp0.html"> แพ็คเกจและโปรโมชั่น </a>
</div>
<div class="col-md-3">
<div class="btn-group btn-group-lg">
<button class="btn dropdown-toggle btn-secondary" data-toggle="dropdown"> เที่ยวภูเก็ต </button>
<div class="dropdown-menu">
<a class="dropdown-item" href="phuket1.html">ที่กิน</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket2.html">ที่เที่ยว</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket3.html">ที่พัก</a>
</div>
</div>
</div>
<div class="col-md-3">
<a class="btn btn-primary btn-lg" href="about.html"> เกี่ยวกับ </a>
</div>
</div>
</div>
</div>
<div class="py-5 bg-primary filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="display-4"> ร้านอาหารแนะนำในภูเก็ต จะเด็ดแค่ไหนไปดูกัน </h1>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">1.ปากน้ำซีฟู้ด </p>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/1.ปากน้ำซีฟู้ด1.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/1.ปากน้ำซีฟู้ด2.jpg"> </div>
</div>
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/1.ปากน้ำซีฟู้ด3.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/1.ปากน้ำซีฟู้ด4.jpg"> </div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead text-left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ปากน้ำซีฟู้ด ร้านอาหารทะเลท่ามกลางบรรยากาศสบายๆ ร่มรื่นไปด้วยต้นไม้น้อยใหญ่ เมนูเด่นที่เหมือนกันทุกสาขา คือ เต๋าเต้ยหม้อไฟ ปลาเต๋าเต้ยเป็นปลาสายพันธุ์เดียวกับปลาจาระเม็ด อาศัยอยู่ในทะเลน้ำลึก รสชาตินุ่มและหวานกว่า
ทางร้านจะแล่มาบางๆ จัดจานมาอย่างสวยงามพร้อมเครื่องเคียงต่างๆ และน้ำซุปหม้อไฟร้อนๆ เพียงแค่นำเนื้อปลาจุ่มลงตัวในน้ำซุปรสกลมกล่อม ทานคู่กับน้ำจิ้มสูตรพิเศษของทางร้าน
<br>
<br>ที่อยู่ : 52/220 ถ.รัษฎานุสรณ์ ต.รัษฎา อ.เมืองภูเก็ต จ.ภูเก็ต 83000&nbsp;
<br>โทรศัพท์ : 076240240 , 0817970474&nbsp;
<br>เปิดทุกวัน เวลา 10.30 - 22.30 น.&nbsp;
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">2.ปากน้ำซีฟู้ด ถลาง (ภูเก็ต) </p>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/2.ปากน้ำซีฟู้ด ถลาง (ภูเก็ต).jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/2.ปากน้ำซีฟู้ด ถลาง (ภูเก็ต)2.jpg"> </div>
</div>
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/2.ปากน้ำซีฟู้ด ถลาง (ภูเก็ต)3.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/2.ปากน้ำซีฟู้ด ถลาง (ภูเก็ต)4.jpg"> </div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead text-left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ปากน้ำซีฟู้ด สาขาถลาง ร้านอาหารทะเลแสนอร่อยแห่งเมืองภูเก็ต ม้พื้นที่เล็กกว่าสาขาที่ถนนรัษฎานุสรณ์ แต่การตกแต่งทันสมัยกว่า ด้วยผนังอิฐเปลือย และเฟอร์นิเจอร์สไตล์โมเดิร์น ภายในห้องแอร์เย็นฉ่ำ เมนูความอร่อยของร้านนี้ยังมีเมนู
ราวท้องนึ่งซีอิ๊ว &nbsp; &nbsp; ปูไข่หลน แกงส้มชะอมกุ้ง รสชาติกลมกล่อม อร่อยได้รสชาติอาหารทะเลที่สดใหม่
<br>
<br>ที่อยู่ : 169/7 ม.1 ถ.เทพกระษัตรี ต.เทพกระษัตรี อ.ถลาง จ.ภูเก็ต 83110
<br>โทรศัพท์ : 076313388 , 0936120387&nbsp;
<br>เปิดทุกวัน เวลา 11.00 - 24.00 น.
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">3.กันเองแอทเพียร์ </p>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/3.กันเองแอทเพียร์.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/3.กันเองแอทเพียร์2.jpg"> </div>
</div>
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/3.กันเองแอทเพียร์3.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/3.กันเองแอทเพียร์4.jpg"> </div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead text-left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; กันเองแอทเพียร์ ปรับโฉมให้ดูโมเดิร์นและเพิ่มความสะดวกสบายมากขึ้น จึงเหมาะกับการแวะมาทานอาหารทะเลอันเลื่องชื่อพร้อมชมวิวสวยๆ ของภูเก็ตไปพร้อมๆ กัน ถ้ามองหาอาหารจานหลักต้องเมนูอาหารทะเลเผา ที่มีทั้ง ปลา กุ้ง
หมึกเผามาร้อนๆ ทานคู่น้ำจิ้มซีฟู้ดรสจัดจ้าน
<br>
<br>ที่อยู่ : 44/1 ม.5 ถ.วิเศษ ต.ราไวย์ อ.เมืองภูเก็ต จ.ภูเก็ต 33130&nbsp;
<br>โทรศัพท์ : 076381212 , 076381715 , 0831731187&nbsp;
<br>เปิดทุกวัน เวลา 10.30 - 23.00 น.&nbsp;
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">4.แหลมหินซีฟู้ด </p>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/4.แหลมหินซีฟู้ด.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/4.แหลมหินซีฟู้ด2.jpg"> </div>
</div>
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/4.แหลมหินซีฟู้ด3.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/4.แหลมหินซีฟู้ด4.jpg"> </div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead text-left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;แหลมหินซีฟู้ด ร้านสวยริมทะเลที่ได้เปรียบในเรื่องของโลเคชั่น นอกจากที่นี่จะมีจุดเด่นของโลเคชั่นที่สวยงามแล้ว ยังรับประกันในเรื่องความสดใหม่ของอาหารทะเลที่ส่งตรงมาจากท่าเรือทุกวัน มาร้านนี้ เมนูที่ไม่ควรพลาดก็คือ
ปูทะเลผัดพริกไทยดำ&nbsp;
<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;
<br>ที่อยู่ : 90/11 ม.7 ต.เกาะแก้ว อ.เมืองภูเก็ต จ.ภูเก็ต 83200&nbsp;
<br>โทรศัพท์ : 076239357 , 076238156&nbsp;
<br>เปิดทุกวัน เวลา 10.00 - 22.00 น.
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">5.ศาลาลอย </p>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/5.ศาลาลอย.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/5.ศาลาลอย2.jpg"> </div>
</div>
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/5.ศาลาลอย3.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/5.ศาลาลอย4.jpg"> </div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead text-left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ศาลาลอย เป็นร้านอาหารอยู่ติดริมชายหาด โซนด้านนอก มีโต๊ะทานอาหารใต้ต้นสน มองเห็นวิวท้องทะเลไปจนสุดสายตา ส่วนด้านในเป็นห้องแอร์ ตกแต่งแบบเรียบหรู เมนูความอร่อยเริ่มต้นที่ ทอดมันกุ้ง กุ้งทอดซอสมะขาม และปลาหมึกไข่นึ่งมะนาว
ที่รสชาติจัดจ้านด้วยรสชาติน้ำยำ เสิร์ฟมาแบบหม้อไฟ ร้อนๆ
<br>
<br>ที่อยู่ : 52/2 ถ.วิเศษ ต.ราไวย์ อ.เมืองภูเก็ต จ.ภูเก็ต 83000&nbsp;
<br>โทรศัพท์ : 076613740&nbsp;
<br>เปิดทุกวัน เวลา 10.00 - 22.30 น. &nbsp; &nbsp; &nbsp; &nbsp;
<br>&nbsp; &nbsp;&nbsp;</p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">6.กันเอง 2 </p>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/6.กันเอง 2.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/6.กันเอง 22.jpg"> </div>
</div>
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/6.กันเอง 23.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/6.กันเอง 24.jpg"> </div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead text-left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; กันเอง 2 ที่นี่ยกเมนูความอร่อยมาแบบครบถ้วนมาตรฐาน การตกแต่งของที่นี่จะเป็นสไตล์บาหลีผสมผสานความเป็นโมเดิร์น และยังคงสร้างให้กลมกลืนไปกับธรรมชาติด้วยอาคารไม้หลังคามุงหญ้าคา โต๊ะทานอาหารโซนด้านนอกจะจัดให้มองเห็นทะเลอันสวยงาม
พร้อมห้องจัดเลี้ยงที่เหมาะกับการประชุม สัมมนา จัดงานแต่งงานและรองรับกรุ๊ปทัวร์ขนาดใหญ่ได้อย่างสบายๆ
<br>
<br>ที่อยู่ : 9/3 ม.9 ถ.เจ้าฟ้า ต.ฉลอง อ.เมืองภูเก็ต จ.ภูเก็ต 83130&nbsp;
<br>โทรศัพท์ : 076381323&nbsp;
<br>เปิดทุกวัน เวลา 10.30 - 23.00 น.
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">7.ป่าหล่ายซีฟู้ด </p>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/7.ป่าหล่ายซีฟู้ด.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/7.ป่าหล่ายซีฟู้ด2.jpg"> </div>
</div>
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/7.ป่าหล่ายซีฟู้ด3.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/7.ป่าหล่ายซีฟู้ด4.jpg"> </div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead text-left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ป่าหล่ายซีฟู้ด เปิดมาแล้วกว่า 15ปี ตัวร้านเปิดโล่ง อยู่ติดริมชายทะเล ด้านหน้า มองออกไปเห็นทิวทัศน์ของท้องทะเลเป็นแนวยาว สวยงามมาก
<br>
<br>ที่อยู่ : 32 ม.3 ซ.ป่าหลาย ถ.เจ้าฟ้า ต.ฉลอง อ.เมืองภูเก็ต จ.ภูเก็ต 83000&nbsp;
<br>โทรศัพท์ : 076282174&nbsp;
<br>เปิดบริการทุกวัน เวลา 09.00 - 22.00 น.
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">8.หมี่ต้นโพธิ์ </p>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/8.หมี่ต้นโพธิ์.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/8.หมี่ต้นโพธิ์2.jpg"> </div>
</div>
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/8.หมี่ต้นโพธิ์3.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/8.หมี่ต้นโพธิ์4.jpg"> </div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead text-left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; หมี่ต้นโพธิ์ มาภูเก็ต ถ้าไม่แวะทานหมี่ต้นโพธิ์ ถือว่ามาไม่ถึง ที่จริงแล้ว เมนูของร้านก็คือ หมี่ฮกเกี้ยน จุดเด่นของ หมี่ฮกเกี้ยน อยู่ที่ขั้นตอนการทำเส้นที่สดใหม่ ด้วยคุณสมบัติของเส้นที่เหนียวนุ่ม เมื่อนำไปผัดด้วยไฟแรงพร้อมเครื่องปรุงต่างๆ
เพิ่มความอร่อยด้วยน้ำซุปรสกลมกล่อม ผัดด้วยกรรมวิธีแบบดั้งเดิม บนเตาถ่านแบบโบราณจะช่วยให้มีความหอมมากยิ่งขึ้น
<br>
<br>ที่อยู่ : 214/7-8 ถ.ภูเก็ต ต.ตลาดใหญ่ อ.เมืองภูเก็ต จ.ภูเก็ต 83000&nbsp;
<br>โทรศัพท์ : 076216293 , 0897299638&nbsp;
<br>เปิดทุกวัน เวลา 10.00 - 18.30 น. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">9.โพงพางซีฟู้ด </p>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/9.โพงพางซีฟู้ด.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/9.โพงพางซีฟู้ด2.jpg"> </div>
</div>
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/9.โพงพางซีฟู้ด3.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/9.โพงพางซีฟู้ด4.jpg"> </div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead text-left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; โพงพางซีฟู้ด จุดเด่นของร้านนี้ก็คือ การตั้งอยู่ริมทะเล ระหว่างการทานอาหารสามารถมองเห็นวิวทะเลที่อยู่ตรงหน้า ไปจนสุดสวยตา สวยงามมากๆ โดยเฉพาะช่วงพระอาทิตย์ตกดิน จะบรรยากาศดี เหมาะกับการนั่งรับลมทะเล ถ่ายภาพเพลินๆ
<br>
<br>ที่อยู่ : 22/2 ม.3 ซ.ป่าหล่าย ถ.เจ้าฟ้า ต.ฉลอง อ.เมืองภูเก็ต จ.ภูเก็ต 83000&nbsp;
<br>โทรศัพท์ : 076282270 , 0835500971&nbsp;
<br>เปิดทุกวัน เวลา 10.00 - 22.00 น. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">9.โพงพางซีฟู้ด </p>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/9.โพงพางซีฟู้ด.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/9.โพงพางซีฟู้ด2.jpg"> </div>
</div>
<div class="row">
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/9.โพงพางซีฟู้ด3.jpg"> </div>
<div class="col-md-6">
<img class="img-fluid d-block rounded-circle" src="../../nid/9.โพงพางซีฟู้ด4.jpg"> </div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead text-left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; โพงพางซีฟู้ด จุดเด่นของร้านนี้ก็คือ การตั้งอยู่ริมทะเล ระหว่างการทานอาหารสามารถมองเห็นวิวทะเลที่อยู่ตรงหน้า ไปจนสุดสวยตา สวยงามมากๆ โดยเฉพาะช่วงพระอาทิตย์ตกดิน จะบรรยากาศดี เหมาะกับการนั่งรับลมทะเล ถ่ายภาพเพลินๆ
<br>
<br>ที่อยู่ : 22/2 ม.3 ซ.ป่าหล่าย ถ.เจ้าฟ้า ต.ฉลอง อ.เมืองภูเก็ต จ.ภูเก็ต 83000&nbsp;
<br>โทรศัพท์ : 076282270 , 0835500971&nbsp;
<br>เปิดทุกวัน เวลา 10.00 - 22.00 น. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
<br>
<br> </p>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<pingendo onclick="window.open('https://pingendo.com/', '_blank')" style="cursor:pointer;position: fixed;bottom: 10px;right:10px;padding:4px;background-color: #00b0eb;border-radius: 8px; width:180px;display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:14px;color:white">Made with Pingendo&nbsp;&nbsp;
<img src="https://pingendo.com/site-assets/Pingendo_logo_big.png" class="d-block" alt="Pingendo logo" height="16">
</pingendo>
</body>
</html>
\ No newline at end of file
/*!
* Based on Bootstrap v4.0.0 (https://getbootstrap.com)
*/
// Options
//
// Quickly modify global styling by enabling or disabling optional features.
$enable-rounded: true !default;
$enable-shadows: true;
$enable-transitions: true;
$enable-hover-media-query: false;
$enable-grid-classes: true;
$enable-print-styles: true;
// Variables
//
// Colors
$theme-colors: (
primary: #f1cd31,
secondary: #f70655,
light: #f3f3f3,
dark: #303030,
info: #009ac0,
success: #28a745,
warning: #ffc107,
danger: #dc3545
);
$body-bg: #111;
$body-color: #efefef;
$body-color-inverse: invert($body-color) !default;
$link-color: #f1cd31;
// Fonts
$font-family-base: 'Comic Sans MS', cursive, sans-serif;
$headings-font-family: 'Comic Sans MS', cursive, sans-serif;
$display-font-family: 'Comic Sans MS', cursive, sans-serif;
$font-weight-normal: 200;
$headings-font-weight: 200;
$lead-font-size: 1.30rem;
$spacer: 1.5rem;
$font-size-base: 0.85rem;
$border-radius: 1rem;
$border-radius-lg: $border-radius * 1.2;
$border-radius-sm: $border-radius * .8;
@import 'bootstrap-4.0.0';
html,body {
height:100%;
}
.cover {
min-height:100%;
display:flex;
align-items:center
}
.bg-gradient {
overflow: hidden;
color: color-yiq(map-get($theme-colors, 'primary'));
background: linear-gradient(-30deg, theme-color("secondary") 0%, theme-color("primary") 50%, theme-color("primary") 100%);
}
.filter-dark {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'dark'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'dark'), 0.75);
}
}
.filter-light {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'light'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'light'),0.75);
}
}
.filter-color {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'primary'), 0.75);
}
}
.filter-gradient {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient(-30deg, transparentize(theme-color("secondary"), 0.1) 0%, transparentize(theme-color("primary"), 0.1) 50%, transparentize(theme-color("primary"), 0.05) 100%);
}
}
.filter-fade-in {
overflow: hidden;
position: relative;
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient($body-bg, transparentize($body-bg, 0.2),transparentize($body-bg, 0.9),transparentize($body-bg, 1));
}
}
This source diff could not be displayed because it is too large. You can view the blob instead.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="phuket2.css" type="text/css"> </head>
<body class="text-center bg-primary">
<div class="text-center text-capitalize w-100" style="background-image: url('C:/Users/User/Desktop/nid/mancora-peru-sky-sea-ocean-umbrella-couch-beach-sand-beach.jpg');background-size:cover;background-position:center center;">
<div class="container py-5">
<div class="row">
<div class="border-primary col-md-4 col-xl-9">
<h1 class="display-3 mb-4 navbar-light text-left text-dark text-uppercase">Phuket&nbsp;
<br>&nbsp; &nbsp; &nbsp; Travel</h1>
</div>
</div>
</div>
</div>
<div class="py-2 bg-dark w-100">
<div class="container">
<div class="row">
<div class="col-md-3">
<a class="btn btn-lg btn-primary" href="home.html"> หน้าหลัก </a>
</div>
<div class="col-md-3">
<a class="btn btn-lg btn-primary" href="tp0.html"> แพ็คเกจและโปรโมชั่น </a>
</div>
<div class="col-md-3">
<div class="btn-group btn-group-lg">
<button class="btn dropdown-toggle btn-secondary" data-toggle="dropdown"> เที่ยวภูเก็ต </button>
<div class="dropdown-menu">
<a class="dropdown-item" href="phuket1.html">ที่กิน</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket2.html">ที่เที่ยว</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket3.html">ที่พัก</a>
</div>
</div>
</div>
<div class="col-md-3">
<a class="btn btn-primary btn-lg" href="about.html"> เกี่ยวกับ </a>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="display-4">ที่เที่ยวภูเก็ต&nbsp;
<br>สัมผัสเสน่ห์เมืองสุดคลาสสิกไม่เสื่อมคลาย</h1>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">1. ย่านเมืองเก่าตึกแถวโบราณ อาคารชิโน-โปรตุกีส</p>
</div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<img class="img-fluid d-block my-5 mx-auto" src="../../nid/1. ย่านเมืองเก่าตึกแถวโบราณ อาคารชิโน-โปรตุกีส.jpg" width="80%" height="80%">
<p class="lead">&nbsp; &nbsp;ที่อยู่ : อำเภอเมือง บริเวณถนนถลาง ถนนดีบุก ถนนเยาวราช ถนนพังงา และรอบ ๆ&nbsp;
<br>โทรศัพท์ : 08 6470 4823&nbsp;
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">2. สวนน้ำ Splash Jungle</p>
</div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<img class="img-fluid d-block my-5 mx-auto" src="../../nid/สวนน้ำ Splash Jungle 3.jpg" width="80%" height="80%">
<p class="lead">&nbsp; &nbsp;ที่อยู่ : ซอยไม้ขาว 4 ตำบลไม้ขาว อำเภอถลาง จังหวัดภูเก็ต
<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;เวลาเปิด-ปิด : เปิดทุกวัน ตั้งแต่เวลา 10.00-18.00 น.
<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;โทรศัพท์ : 076 372 111
<br>
<br>
</p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">3. จุดชมวิวเขารัง</p>
</div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<img class="img-fluid d-block my-5 mx-auto" src="../../nid/3. จุดชมวิวเขารัง.jpg" width="80%" height="80%">
<p class="lead">&nbsp; &nbsp; &nbsp;ที่อยู่ : จากที่ว่าการอำเภอมาทางถนนแม่หลวน จากนั้นเลี้ยวขวาเข้าถนนคอซิมบี้ไปจนสุดทาง หรือจะเข้าจากถนนวชิระข้างโรงพยาบาลวชิระภูเก็ตก็ได้&nbsp;
<br>เวลาเปิด-ปิด : เปิดทุกวัน&nbsp;
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">4. แหลมพรหมเทพ</p>
</div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<img class="img-fluid d-block my-5 mx-auto" src="../../nid/4.แหลมพรหมเทพ.jpg" width="80%" height="80%">
<p class="lead">&nbsp; &nbsp;ที่อยู่ : ราไวย์ เมืองภูเก็ต จังหวัดภูเก็ต ห่างจากตัวเมืองประมาณ 19 กิโลเมตร ห่างจากหาดราไวย์เลี้ยวขวาไปประมาณ 2 กิโลเมตร เวลาเปิด-ปิด : เปิดทุกวัน
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">5.&nbsp;วัดฉลอง</p>
</div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<img class="img-fluid d-block my-5 mx-auto" src="../../nid/5.วัดฉลอง.jpg" width="80%" height="80%">
<p class="lead">&nbsp; &nbsp;ที่อยู่ : 70 บ้านฉลอง ถนนเจ้าฟ้า หมู่ที่ 6 ตำบลฉลอง อำเภอเมืองภูเก็ต จังหวัดภูเก็ต&nbsp;
<br>เวลาเปิด-ปิด : เปิดทุกวัน ตั้งแต่เวลา 07.00-17.00 น.
<br>&nbsp;&nbsp;</p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">6.&nbsp;หาดป่าตอง </p>
</div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<img class="img-fluid d-block my-5 mx-auto" src="../../nid/6หาดป่าตอง.jpg" width="80%" height="80%">
<p class="lead">&nbsp; ที่อยู่ : อำเภอกะทู้ ริมถนนทวีวงศ์ (ทางหลวง 4233) จากตัวเมืองมาตามทางหลวง 4029 ผ่านวัดสุวรรณคีรีวงก์ เลี้ยวซ้ายเข้าถนนราษฎร์อุทิศ 200 ปี จากนั้นเลี้ยวขวาเข้าถนนประชานุเคราะห์&nbsp;
<br>เวลาเปิด-ปิด : เปิดทุกวัน&nbsp;
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">7.&nbsp;หาดกะรน </p>
</div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<img class="img-fluid d-block my-5 mx-auto" src="../../nid/7.หาดกะรน .jpg" width="80%" height="80%">
<p class="lead">&nbsp; &nbsp;ที่อยู่ : อำเภอเมือง จาดหาดป่าตองลงมาทางทิศใต้ ตามทางหลวง 4233 (ทางขึ้นเขาประมาณ 3 กิโลเมตร)&nbsp;
<br>เวลาเปิด-ปิด : เปิดทุกวัน
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">8.&nbsp;หาดกะตะน้อย หาดกะตะใหญ่ </p>
</div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<img class="img-fluid d-block my-5 mx-auto" src="../../nid/8.หาดกะตะน้อย หาดกะตะใหญ่.jpg" width="80%" height="80%">
<p class="lead">&nbsp;ที่อยู่ : อำเภอเมือง จากตัวเมืองมาถึงห้าแยกฉลอง เลี้ยวขวาไปตามทางหลวง 4028 จะถึงหาดกะตะน้อยก่อน ขับขึ้นมาทางทิศเหนือประมาณ 5 นาทีก็จะถึงหาดกะตะ&nbsp;
<br>เวลาเปิด-ปิด : เปิดทุกวัน&nbsp;
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">9.&nbsp; ภูเก็ตแฟนตาซี</p>
</div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<img class="img-fluid d-block my-5 mx-auto" src="../../nid/9. ภูเก็ตแฟนตาซี.jpg" width="80%" height="80%">
<p class="lead">&nbsp;ที่อยู่ : 99 หมู่ 3 ตำบลกมลา อำเภอกะทู้ จังหวัดภูเก็ต 83150&nbsp;
<br>เวลาเปิด-ปิด : เปิดบริการทุกวัน ยกเว้นวันพฤหัสบดี (หากวันพฤหัสบดีตรงกับวันหยุดนักขัตฤกษ์อาจเปิดให้บริการตามปกติ)&nbsp;
<br>ตั้งแต่เวลา 17.30-23.30 น.&nbsp;
<br>โทรศัพท์ : 076 385 000
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">10.&nbsp; Flying Hanuman</p>
</div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<img class="img-fluid d-block my-5 mx-auto" src="../../nid/10.Flying Hanuman.jpg" width="80%" height="80%">
<p class="lead">&nbsp; &nbsp; &nbsp;ที่อยู่ : 89/16 หมู่ 6 ซอยน้ำตกกะทู้ ถนนวิชิตสงคราม ตำบลกะทู้ อำเภอกะทู้ จังหวัดภูเก็ต&nbsp;
<br>เวลาเปิด-ปิด : เปิดทุกวัน ตั้งแต่เวลา 08.00-18.00 น.&nbsp;
<br>โทรศัพท์ : 081 979 2332
<br>
<br> </p>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<pingendo onclick="window.open('https://pingendo.com/', '_blank')" style="cursor:pointer;position: fixed;bottom: 10px;right:10px;padding:4px;background-color: #00b0eb;border-radius: 8px; width:180px;display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:14px;color:white">Made with Pingendo&nbsp;&nbsp;
<img src="https://pingendo.com/site-assets/Pingendo_logo_big.png" class="d-block" alt="Pingendo logo" height="16">
</pingendo>
</body>
</html>
\ No newline at end of file
/*!
* Based on Bootstrap v4.0.0 (https://getbootstrap.com)
*/
// Options
//
// Quickly modify global styling by enabling or disabling optional features.
$enable-rounded: true !default;
$enable-shadows: true;
$enable-transitions: true;
$enable-hover-media-query: false;
$enable-grid-classes: true;
$enable-print-styles: true;
// Variables
//
// Colors
$theme-colors: (
primary: #f1cd31,
secondary: #f70655,
light: #f3f3f3,
dark: #303030,
info: #009ac0,
success: #28a745,
warning: #ffc107,
danger: #dc3545
);
$body-bg: #111;
$body-color: #efefef;
$body-color-inverse: invert($body-color) !default;
$link-color: #f1cd31;
// Fonts
$font-family-base: 'Comic Sans MS', cursive, sans-serif;
$headings-font-family: 'Comic Sans MS', cursive, sans-serif;
$display-font-family: 'Comic Sans MS', cursive, sans-serif;
$font-weight-normal: 200;
$headings-font-weight: 200;
$lead-font-size: 1.30rem;
$spacer: 1.5rem;
$border-radius: 1rem;
$border-radius-lg: $border-radius * 1.2;
$border-radius-sm: $border-radius * .8;
$font-size-base: 0.85rem;
@import 'bootstrap-4.0.0';
html,body {
height:100%;
}
.cover {
min-height:100%;
display:flex;
align-items:center
}
.bg-gradient {
overflow: hidden;
color: color-yiq(map-get($theme-colors, 'primary'));
background: linear-gradient(-30deg, theme-color("secondary") 0%, theme-color("primary") 50%, theme-color("primary") 100%);
}
.filter-dark {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'dark'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'dark'), 0.75);
}
}
.filter-light {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'light'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'light'),0.75);
}
}
.filter-color {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'primary'), 0.75);
}
}
.filter-gradient {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient(-30deg, transparentize(theme-color("secondary"), 0.1) 0%, transparentize(theme-color("primary"), 0.1) 50%, transparentize(theme-color("primary"), 0.05) 100%);
}
}
.filter-fade-in {
overflow: hidden;
position: relative;
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient($body-bg, transparentize($body-bg, 0.2),transparentize($body-bg, 0.9),transparentize($body-bg, 1));
}
}
This source diff could not be displayed because it is too large. You can view the blob instead.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="phuket3.css" type="text/css"> </head>
<body class="text-center bg-primary">
<div class="text-center text-capitalize w-100" style="background-image: url('C:/Users/User/Desktop/nid/mancora-peru-sky-sea-ocean-umbrella-couch-beach-sand-beach.jpg');background-size:cover;background-position:center center;">
<div class="container py-5">
<div class="row">
<div class="border-primary col-md-4 col-xl-9">
<h1 class="display-3 mb-4 navbar-light text-left text-dark text-uppercase">Phuket&nbsp;
<br>&nbsp; &nbsp; &nbsp; Travel</h1>
</div>
</div>
</div>
</div>
<div class="py-2 bg-dark w-100">
<div class="container">
<div class="row">
<div class="col-md-3">
<a class="btn btn-lg btn-primary" href="home.html"> หน้าหลัก </a>
</div>
<div class="col-md-3">
<a class="btn btn-lg btn-primary" href="#"> แพ็คเกจและโปรโมชั่น </a>
</div>
<div class="col-md-3">
<div class="btn-group btn-group-lg">
<button class="btn dropdown-toggle btn-secondary" data-toggle="dropdown"> เที่ยวภูเก็ต </button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">ที่กิน</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">ที่เที่ยว</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">ที่พัก</a>
</div>
</div>
</div>
<div class="col-md-3">
<a class="btn btn-primary btn-lg" href="#"> เกี่ยวกับ </a>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="display-4">ที่พักภูเก็ต</h1>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">1. โฟโต้ โฮเต็ล ภูเก็ต
<br> </p>
</div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<div id="carousel" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block img-fluid w-100 my-5" src="../../nid/1. โฟโต้ โฮเต็ล ภูเก็ต.jpg"> </div>
<div class="carousel-item">
<img class="d-block img-fluid w-100 my-5" src="../../nid/1. โฟโต้ โฮเต็ล ภูเก็ต2.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid my-5" src="../../nid/1. โฟโต้ โฮเต็ล ภูเก็ต3.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid my-5" src="../../nid/1. โฟโต้ โฮเต็ล ภูเก็ต4.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid my-5" src="../../nid/1. โฟโต้ โฮเต็ล ภูเก็ต5.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid my-5" src="../../nid/1. โฟโต้ โฮเต็ล ภูเก็ต6.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid my-5" src="../../nid/1. โฟโต้ โฮเต็ล ภูเก็ต7.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid my-5" src="../../nid/1. โฟโต้ โฮเต็ล ภูเก็ต8.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid my-5" src="../../nid/1. โฟโต้ โฮเต็ล ภูเก็ต9.jpg"> </div>
</div>
<a class="carousel-control-prev" href="#carousel" role="button" data-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a>
<a class="carousel-control-next" href="#carousel" role="button" data-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="sr-only">Next</span> </a>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<p class="lead">-- ราคาเริ่มต้น 9,000/คืน --</p>
</div>
</div>
<div class="row">
<div class="col-md-5 col-lg-6 text-center">
<p class="lead text-left">
<br>
<u>สิ่งอำนวยความสะดวกยอดนิยม</u>&nbsp;
<br>&nbsp; &nbsp; &nbsp;- สระว่ายน้ำ&nbsp;
<br>&nbsp; &nbsp; &nbsp;- รวมบริการอินเทอร์เน็ตไร้สาย (Wi-Fi) ฟรี&nbsp;
<br>&nbsp; &nbsp; &nbsp;- สระว่ายน้ำกลางแจ้ง&nbsp;
<br>&nbsp; &nbsp; &nbsp;- รถรับส่งสนามบิน
<br>&nbsp; &nbsp; &nbsp;- ศูนย์ออกกำลังกาย&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ที่จอดรถส่วนตัว (ฟรี)&nbsp;
<br>&nbsp; &nbsp; &nbsp;- บาร์&nbsp;
<br>&nbsp; &nbsp; &nbsp;- อาหารเช้าดีมาก
<br>
<br> </p>
<u> </u>
</div>
<div class="col-md-5 col-lg-6">
<p class="lead text-left">
<br>
<u>สถานที่สำคัญซึ่งอยู่ใกล้ที่สุด</u>&nbsp;
<br>&nbsp; &nbsp; &nbsp;- เซิร์ฟเฮาส์ ภูเก็ต 0.6 กม.&nbsp;
<br>&nbsp; &nbsp; &nbsp;- หาดกะตะน้อย 0.8 กม.
<br>&nbsp; &nbsp; &nbsp;- เดอะคอฟฟี่คลับ หาดกะตะ 1.5 กม.&nbsp;
<br>&nbsp; &nbsp; &nbsp;- SC Plaza Kata 1.6 กม.&nbsp;
<br>&nbsp; &nbsp; &nbsp;- จุดชมวิวกะตะ 1.7 กม.&nbsp;
<br>&nbsp; &nbsp; &nbsp;- สตาร์บัคส์ หาดกะตะ 1.7 กม.
<br>&nbsp; &nbsp; &nbsp;- ไดโนปาร์ค มินิกอล์ฟ 1.9 กม.&nbsp;
<br>&nbsp; &nbsp; &nbsp;- พระพุทธมิ่งมงคลเอกนาคคีรี (พระใหญ่) 2.1 กม.
<br>&nbsp; &nbsp; &nbsp;- กะรนไนต์มาร์เก็ต 3.5 กม.&nbsp;
<br>&nbsp; &nbsp; &nbsp;- สนามยิงปืนภูเก็ต 3.6 กม. </p>
<u>
<u> </u>
</u>
</div>
<u>
<u> </u>
</u>
</div>
<div class="row">
<div class="col-md-12">
<p class="lead">
<br>ที่อยู่: 218/9 Kata-Saiyaun Rd. Kata Beach Karon Muang Phuket ภูเก็ต 83100 &nbsp;
<br>โทรศัพท์: 076 680 900
<br>
<br> </p>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<pingendo onclick="window.open('https://pingendo.com/', '_blank')" style="cursor:pointer;position: fixed;bottom: 10px;right:10px;padding:4px;background-color: #00b0eb;border-radius: 8px; width:180px;display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:14px;color:white">Made with Pingendo&nbsp;&nbsp;
<img src="https://pingendo.com/site-assets/Pingendo_logo_big.png" class="d-block" alt="Pingendo logo" height="16">
</pingendo>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">2.&nbsp;เดอะชอร์ แอท กะตะธานี</p>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<div id="carousel" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block img-fluid w-100" src="../../nid/2. เดอะชอร์ แอท กะตะธานี.jpg"> </div>
<div class="carousel-item">
<img class="d-block img-fluid w-100" src="../../nid/2. เดอะชอร์ แอท กะตะธานี2.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/2. เดอะชอร์ แอท กะตะธานี3.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/2. เดอะชอร์ แอท กะตะธานี4.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/2. เดอะชอร์ แอท กะตะธานี5.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/2. เดอะชอร์ แอท กะตะธานี6.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/2. เดอะชอร์ แอท กะตะธานี7.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/2. เดอะชอร์ แอท กะตะธานี8.jpg"> </div>
</div>
<a class="carousel-control-prev" href="#carousel" role="button" data-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a>
<a class="carousel-control-next" href="#carousel" role="button" data-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="sr-only">Next</span> </a>
</div>
</div>
</div>
</div>
</div>
<div class="bg-primary filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">-- ราคาเริ่มต้น 18,000/คืน --
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<u> </u>
</div>
<div class="col-md-6">
<u>
<u> </u>
</u>
</div>
<u>
<u> </u>
</u>
</div>
<div class="bg-primary filter-light">
<div class="container">
<div class="row">
<div class="col-md-6">
<p class="lead text-left">
<u>สิ่งอำนวยความสะดวกยอดนิยม</u>&nbsp;
<br>&nbsp; &nbsp; &nbsp;- สระว่ายน้ำ&nbsp;
<br>&nbsp; &nbsp; &nbsp;- รวมบริการอินเทอร์เน็ตไร้สาย (Wi-Fi) ฟรี&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ติดชายหาด&nbsp;
<br>&nbsp; &nbsp; &nbsp;- สระว่ายน้ำกลางแจ้ง&nbsp;
<br>&nbsp; &nbsp; &nbsp;- รถรับส่งสนามบิน&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ศูนย์ออกกำลังกาย&nbsp;
<br>&nbsp; &nbsp; &nbsp;- อุปกรณ์ชงชา/กาแฟในทุกห้องพัก&nbsp;
<br>&nbsp; &nbsp; &nbsp;- บาร์&nbsp;
<br>&nbsp; &nbsp; &nbsp;- อาหารเช้าดีเลิศ </p>
</div>
<div class="col-md-6">
<p class="lead text-left">
<u>สถานที่สำคัญซึ่งอยู่ใกล้ที่สุด</u>&nbsp;
<br>&nbsp; &nbsp; &nbsp;- หาดกะตะน้อย พื้นที่ยอดนิยม 0.2 กม.&nbsp;
<br>&nbsp; &nbsp; &nbsp;- จุดชมวิวกะตะ พื้นที่ยอดนิยม 0.9 กม.
<br>&nbsp; &nbsp; &nbsp;- เซิร์ฟเฮาส์ ภูเก็ต พื้นที่ยอดนิยม 1.3 กม.
<br>&nbsp; &nbsp; &nbsp;- เดอะคอฟฟี่คลับ หาดกะตะ พื้นที่ยอดนิยม 2.3 กม.
<br>&nbsp; &nbsp; &nbsp;- SC Plaza Kata พื้นที่ยอดนิยม 2.4 กม.&nbsp;
<br>&nbsp; &nbsp; &nbsp;- สตาร์บัคส์ หาดกะตะ พื้นที่ยอดนิยม 2.5 กม.&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ไดโนปาร์ค มินิกอล์ฟ สถานที่ท่องเที่ยว 2.6 กม.&nbsp;
<br>&nbsp; &nbsp; &nbsp;- พระพุทธมิ่งมงคลเอกนาคคีรี (พระใหญ่)&nbsp;
<br>สถานที่สำคัญ 2.9 กม.&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ทะเลสาบในหาน ท่าเรือ 3.1 กม.&nbsp;
<br>&nbsp; &nbsp; &nbsp;- หาดในหาน พื้นที่ยอดนิยม 3.1 กม. </p>
</div>
</div>
<div class="row">
<div class="col-md-12">
<p class="lead">
<br>ที่อยู่: น้อย ตำบล กะ รน 83000 อำเภอ เมือง ภูเก็ต ภูเก็ต 83100 18 ถนน กะตะ ตำบล กะรน อำเภอเมืองภูเก็ต ภูเก็ต 83100
<br>โทรศัพท์: 076 330 124
<br>
<br> </p>
</div>
</div>
</div>
</div>
<div class="bg-success">
<div class="container">
<div class="row">
<div class="col-md-12">
<p class="lead">3.&nbsp;ชูการ์ ปาล์ม แกรนด์ ฮิลล์ไซด์</p>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light">
<div class="container">
<div class="row">
<div class="col-md-12">
<div id="carousel" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block img-fluid w-100" src="../../nid/3.ชูการ์ ปาล์ม แกรนด์ ฮิลล์ไซด์.jpg"> </div>
<div class="carousel-item">
<img class="d-block img-fluid w-100" src="../../nid/3.ชูการ์ ปาล์ม แกรนด์ ฮิลล์ไซด์3.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/3.ชูการ์ ปาล์ม แกรนด์ ฮิลล์ไซด์2.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/3.ชูการ์ ปาล์ม แกรนด์ ฮิลล์ไซด์4.jpg"> </div>
<div class="carousel-item">
<img class="img-fluid" src="../../nid/3.ชูการ์ ปาล์ม แกรนด์ ฮิลล์ไซด์5.jpg"> </div>
</div>
<a class="carousel-control-prev" href="#carousel" role="button" data-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a>
<a class="carousel-control-next" href="#carousel" role="button" data-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="sr-only">Next</span> </a>
</div>
</div>
</div>
</div>
</div>
<div class="filter-light">
<div class="container">
<div class="row">
<div class="col-md-4">
<p class="lead text-left">
<u>รายละเอียดโรงแรม</u>&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ที่จอดรถฟรี&nbsp;
<br>&nbsp; &nbsp; &nbsp;- บริการซักรีด&nbsp;
<br>&nbsp; &nbsp; &nbsp;- เหมาะสำหรับเด็ก
<br>&nbsp; &nbsp; &nbsp;- ร้านอาหาร&nbsp;
<br>&nbsp; &nbsp; &nbsp;- อ่างน้ำร้อน&nbsp;
<br>&nbsp; &nbsp; &nbsp;- บาร์
<br>
<br>
<br>
<br>
</p>
</div>
<div class="col-md-8">
<p class="lead">
<br>-- ราคาเริ่มต้น 2,000/คืน --
<br>
<br>
<br>ที่อยู่: 1, Khoktanod soi 3 Road,Karon, Meuang, Phuket 83100&nbsp;
<br>โทรศัพท์: 076 330 388</p>
</div>
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
/*!
* Based on Bootstrap v4.0.0 (https://getbootstrap.com)
*/
// Options
//
// Quickly modify global styling by enabling or disabling optional features.
$enable-rounded: true !default;
$enable-shadows: true;
$enable-transitions: true;
$enable-hover-media-query: false;
$enable-grid-classes: true;
$enable-print-styles: true;
// Variables
//
// Colors
$theme-colors: (
primary: #f1cd31,
secondary: #f70655,
light: #f3f3f3,
dark: #303030,
info: #009ac0,
success: #28a745,
warning: #ffc107,
danger: #dc3545
);
$body-bg: #111;
$body-color: #efefef;
$body-color-inverse: invert($body-color) !default;
$link-color: #f1cd31;
// Fonts
$font-family-base: 'Comic Sans MS', cursive, sans-serif;
$headings-font-family: 'Comic Sans MS', cursive, sans-serif;
$display-font-family: 'Comic Sans MS', cursive, sans-serif;
$font-weight-normal: 200;
$headings-font-weight: 200;
$lead-font-size: 1.30rem;
$spacer: 1.5rem;
$font-size-base: 0.85rem;
$border-radius: 1rem;
$border-radius-lg: $border-radius * 1.2;
$border-radius-sm: $border-radius * .8;
@import 'bootstrap-4.0.0';
html,body {
height:100%;
}
.cover {
min-height:100%;
display:flex;
align-items:center
}
.bg-gradient {
overflow: hidden;
color: color-yiq(map-get($theme-colors, 'primary'));
background: linear-gradient(-30deg, theme-color("secondary") 0%, theme-color("primary") 50%, theme-color("primary") 100%);
}
.filter-dark {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'dark'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'dark'), 0.75);
}
}
.filter-light {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'light'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'light'),0.75);
}
}
.filter-color {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'primary'), 0.75);
}
}
.filter-gradient {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient(-30deg, transparentize(theme-color("secondary"), 0.1) 0%, transparentize(theme-color("primary"), 0.1) 50%, transparentize(theme-color("primary"), 0.05) 100%);
}
}
.filter-fade-in {
overflow: hidden;
position: relative;
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient($body-bg, transparentize($body-bg, 0.2),transparentize($body-bg, 0.9),transparentize($body-bg, 1));
}
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- PAGE settings -->
<link rel="icon" href="https://templates.pingendo.com/assets/Pingendo_favicon.ico">
<title>Styleguide</title>
<meta name="author" content="Pingendo">
<!-- CSS dependencies -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="neon.css" type="text/css"> </head>
<body>
<div class="py-5 text-center">
<div class="container">
<div class="row">
<div class="col-12">
<h1 class="display-3 text-capitalize">neon style guide</h1>
<p class="lead text-muted">Components designed to fit nicely together </p>
</div>
</div>
</div>
</div>
<div class="py-4">
<div class="container">
<div class="row">
<div class="col-12">
<h2>Color palette</h2>
<hr>
<div class="row text-center">
<div class="col-md-2 bg-primary m-2">
<p class="m-0 p-4">Primary</p>
</div>
<div class="col-md-2 bg-secondary m-2">
<p class="m-0 p-4">Secondary</p>
</div>
<div class="col-md-2 bg-info m-2">
<p class="m-0 p-4">Info</p>
</div>
<div class="col-md-2 bg-light m-2">
<p class="m-0 p-4">Light</p>
</div>
<div class="col-md-2 bg-dark m-2">
<p class="m-0 p-4">Dark</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="py-4">
<div class="container">
<div class="row">
<div class="col-12">
<h2>Typography</h2>
<hr>
<h1 class="display-4"> Display </h1>
<h1>Heading</h1>
<p class="lead">Lead paragraph </p>
<p>Paragraph. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
<br><i>Italic. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</i>
<br><b>Bold. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</b></p>
<div class="blockquote">
<p class="mb-0">Blockquoute</p>
<div class="blockquote-footer">Someone famous in <cite>My memories</cite></div>
</div>
</div>
</div>
</div>
</div>
<div class="py-4">
<div class="container">
<div class="row">
<div class="col-12">
<h2>Buttons</h2>
<hr> </div>
</div>
<div class="row">
<div class="col-12">
<a class="btn btn-primary m-2" href="#">Primary</a>
<a class="btn btn-secondary m-2" href="#">Secondary</a>
<a class="btn btn-info m-2" href="#">Info</a>
<a class="btn btn-light m-2" href="#">Light</a>
<a class="btn btn-dark m-2" href="#">Dark</a>
<a class="btn btn-link m-2" href="#">Link</a>
</div>
</div>
<div class="row">
<div class="col-12">
<a class="btn btn-outline-primary m-2" href="#">Primary</a>
<a class="btn btn-outline-secondary m-2" href="#">Secondary</a>
<a class="btn btn-outline-info m-2" href="#">Info</a>
<a class="btn btn-outline-light m-2" href="#">Light</a>
<a class="btn btn-outline-dark m-2" href="#">Dark</a>
</div>
</div>
<div class="row">
<div class="col-12">
<a class="btn btn-primary m-2" href="" data-toggle="button" aria-pressed="false" autocomplete="off">Toggle</a>
<div class="btn-group m-2">
<a href="#" class="btn btn-primary">Btn 1</a>
<a href="#" class="btn btn-primary">Btn 2</a>
<a href="#" class="btn btn-primary">Btn 3</a>
</div>
<div class="btn-group m-2">
<button class="btn btn-primary dropdown-toggle" data-toggle="dropdown">Dropdown </button>
<div class="dropdown-menu">
<h6 class="dropdown-header">Dropdown header</h6>
<a class="dropdown-item" href="#">Option 1</a>
<a class="dropdown-item" href="#">Option 2</a>
<a class="dropdown-item disabled" href="#">Disabled option</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Separated link</a>
</div>
</div>
<div class="btn-group m-2">
<button type="button" class="btn btn-primary" href="#">Split dropdown</button>
<button type="button" class="btn dropdown-toggle dropdown-toggle-split btn-primary" data-toggle="dropdown" aria-expanded="false" aria-haspopup="true"></button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Separated link</a>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<a class="btn btn-primary m-2" href="">Badge<span class="badge badge-secondary ml-1">New!</span></a>
<a class="btn btn-primary m-2" href="#"><i class="fa fa-user fa-fw"></i>Icon</a>
<a class="btn active btn-primary m-2" href="">Active</a>
<a class="btn disabled btn-primary m-2" href="">Disabled</a>
<a class="btn btn-sm btn-primary m-2" href="">Small</a>
<a class="btn btn-primary m-2" href="">Regular</a>
<a class="btn btn-lg btn-primary m-2" href="">Large</a>
</div>
</div>
</div>
</div>
<div class="py-4">
<div class="container">
<div class="row">
<div class="col-12">
<h2>Navs and components</h2>
<hr> </div>
</div>
<div class="row">
<div class="col-md-6">
<ul class="nav">
<li class="nav-item">
<a class="nav-link" href="#">Item</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Item</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">Item</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Disabled</a>
</li>
</ul>
<ul class="nav nav-pills my-4">
<li class="nav-item">
<a href="#" class="nav-link active">Nav pills</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="fa fa-lg fa-child"></i> Item</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="fa fa-lg fa-anchor mt-1"></i></a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Dropdown</a>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Option 1</a>
<a class="dropdown-item" href="#">Option 2</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Separated link</a>
</div>
</li>
</ul>
<ul class="nav nav-tabs">
<li class="nav-item">
<a href="#home" class="nav-link active" aria-controls="home" aria-selected="true" data-toggle="tab" id="home-tab" role="tab">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#profile" aria-controls="profile" aria-selected="false" data-toggle="tab" id="profile-tab" role="tab">Profile</a>
</li>
<li class="nav-item">
<a href="#contact" class="nav-link" aria-controls="contact" aria-selected="false" data-toggle="tab" id="contact-tab" role="tab">Contact <span class="badge badge-pill badge-warning">!</span></a>
</li>
</ul>
<div class="tab-content my-2" id="myTabContent">
<div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</div>
<div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">Quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</div>
<div class="tab-pane fade" id="contact" role="tabpanel"
aria-labelledby="contact-tab">Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Consectetur adipiscing elit, sed do eiusmod tempor incididunt. </div>
</div>
</div>
<div class="col-md-6">
<ul class="breadcrumb">
<li class="breadcrumb-item">
<a href="#">Home</a>
</li>
<li class="breadcrumb-item">
<a href="#">Parent</a>
</li>
<li class="breadcrumb-item active">Page</li>
</ul>
<ul class="pagination">
<li class="page-item">
<a class="page-link" href="#" aria-label="Previous"> <span aria-hidden="true">«</span> <span class="sr-only">Previous</span> </a>
</li>
<li class="page-item">
<a class="page-link" href="#">1</a>
</li>
<li class="page-item">
<a class="page-link" href="#">2</a>
</li>
<li class="page-item active">
<a class="page-link" href="#">3</a>
</li>
<li class="page-item disabled">
<a class="page-link" href="#">4</a>
</li>
<li class="page-item">
<a class="page-link" href="#" aria-label="Next"> <span aria-hidden="true">»</span> <span class="sr-only">Next</span> </a>
</li>
</ul>
<div class="progress my-4">
<div class="progress-bar progress-bar-striped" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">50%</div>
</div>
<div class="alert alert-info" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close">×</button>
<h4 class="alert-heading">Well done! </h4>
<p class="mb-0">This is an info panel.</p>
</div>
</div>
</div>
</div>
</div>
<div class="py-4">
<div class="container">
<div class="row">
<div class="col-12">
<h2>Forms</h2>
<hr> </div>
</div>
<div class="row">
<div class="col-md-6 p-3">
<form method="post" action="">
<div class="form-group mb-1">
<input type="email" name="email" class="form-control" placeholder="Enter email"> </div> <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>
<div class="form-group my-3"><select class="form-control"><option value="1">1</option><option value="2">2</option><option value="3">3</option></select></div>
<div class="form-group my-3">
<div class="input-group">
<div class="input-group-prepend"><span class="input-group-text" id="basic-addon1">@</span></div>
<input type="text" class="form-control" id="inlineFormInputGroup" placeholder="Username"> </div>
</div>
<div class="form-group my-3">
<input type="file" class="form-control-file" id="exampleFormControlFile1"> </div>
<div class="form-check form-check-inline"> <label class="form-check-label">
<input class="form-check-input" type="radio" value="option1" id="inlineRadio1" name="inlineRadioOptions"> 1
</label> </div>
<div class="form-check form-check-inline"> <label class="form-check-label">
<input class="form-check-input" type="radio" value="option2" id="inlineRadio2" name="inlineRadioOptions"> 2
</label> </div>
<div class="form-check form-check-inline disabled"> <label class="form-check-label">
<input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio3" value="option3" disabled=""> 3
</label> </div>
<div class="form-check mt-2">
<input class="form-check-input" type="checkbox" id="exampleCheck1" value="on"><label class="form-check-label" for="exampleCheck1">Remember me</label></div>
<div class="form-check disabled"> <label class="form-check-label"> <input class="form-check-input" type="checkbox" value="" disabled=""> Disabled option </label> </div>
<button type="submit" class="btn btn-primary my-2">Submit button</button>
</form>
</div>
<div class="col-md-6 p-3">
<form class="" method="post" action="">
<div class="form-group">
<input type="email" class="form-control form-control-sm" placeholder="Small input" name="email"> </div>
<div class="form-group">
<input type="email" class="form-control" name="email" placeholder="Default input"> </div>
<div class="form-group">
<input type="text" class="form-control form-control-lg" placeholder="Large input"> </div>
</form>
<form class="my-3" method="post" action="">
<div class="form-group">
<input type="text" class="form-control" placeholder="Disabled input" id="disabledTextInput" disabled=""> </div>
<div class="form-group">
<input type="text" class="form-control is-valid" placeholder="First name" id="validationServer01" required="" value="Valid"> </div>
<div class="form-group">
<input type="text" class="form-control is-invalid" placeholder="First name" id="validationServer01" required="" value="Invalid">
<div class="invalid-feedback">Please provide a valid input.</div>
</div>
</form>
<form>
<div class="form-group">
<div class="form-check">
<input class="form-check-input" type="checkbox" id="exampleCheck1" value="on"><label class="form-check-label" for="exampleCheck1">Checkbox</label></div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="py-4">
<div class="container">
<div class="row">
<div class="col-md-12">
<h2>Pictures</h2>
<hr> </div>
</div>
<div class="row text-center">
<div class="col-md-4">
<img class="img-fluid p-3" src="assets/styleguide/people_1.jpg" alt="Card image"> </div>
<div class="col-md-4">
<img class="img-fluid rounded-circle p-3" src="assets/styleguide/people_2.jpg" alt="Card image"> </div>
<div class="col-md-4">
<img class="img-fluid img-thumbnail p-3" src="assets/styleguide/people_3.jpg" alt="Card image"> </div>
</div>
<div class="row">
<div class="col-md-6">
<div class="carousel slide my-3" data-ride="carousel" id="carousel-1">
<div class="carousel-inner" role="listbox">
<div class="carousel-item active">
<img class="d-block img-fluid" src="assets/styleguide/cover_2.jpg" data-holder-rendered="true">
<div class="carousel-caption">
<h4>Caption #1</h4>
<p class="mb-0">Paragraph. Lorem ipsum dolor sit&nbsp;</p>
</div>
</div>
<div class="carousel-item">
<img class="d-block img-fluid" src="assets/styleguide/cover_3.jpg" data-holder-rendered="true">
<div class="carousel-caption">
<h4>Caption #2</h4>
<p class="mb-0">Paragraph. Lorem ipsum dolor sit&nbsp;</p>
</div>
</div>
</div>
<a class="carousel-control-prev" role="#carousel-1" data-slide="prev" href="#carousel-1"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a>
<a class="carousel-control-next" role="button" data-slide="next" href="#carousel-1"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="sr-only">Next</span> </a>
</div>
</div>
<div class="col-md-6">
<div class="carousel slide my-3" data-ride="carousel" id="carousel-2" data-interval="5000">
<ol class="carousel-indicators">
<li data-target="#carousel-2" data-slide-to="0" class="active">&nbsp;</li>
<li data-target="#carousel-2" data-slide-to="1">&nbsp;</li>
<li data-target="#carousel-2" data-slide-to="2">&nbsp;</li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="carousel-item active">
<img class="d-block img-fluid" src="assets/styleguide/cover_1.jpg" data-holder-rendered="true">
<div class="carousel-caption">
<p class="lead">Caption #1</p>
</div>
</div>
<div class="carousel-item">
<img class="d-block img-fluid" src="assets/styleguide/cover_4.jpg" data-holder-rendered="true">
<div class="carousel-caption">
<p class="lead">Caption #2</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="py-4">
<div class="container">
<div class="row">
<div class="col-12">
<h2>Cards</h2>
<hr class="mb-4"> </div>
</div>
<div class="row">
<div class="col-md-4 p-3">
<div class="card">
<div class="card-body">
<h5>A Card</h5>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
</div>
</div>
<div class="card my-4">
<div class="card-header bg-primary">
<h5 class="mb-0 text-center">A Card Header</h5>
</div>
<div class="card-body">
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
</div>
<div class="card-footer">A Card footer</div>
</div>
</div>
<div class="col-md-4 p-3">
<div class="bg-primary card">
<img class="img-fluid rounded-circle w-75 mx-auto mt-3" src="assets/styleguide/people_5.jpg" alt="Card image">
<div class="card-body">
<h4 class="card-title">Card</h4>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
</div>
</div>
</div>
<div class="col-md-4 p-3">
<div class="card">
<div class="card-img-overlay align-items-center d-flex">
<h4 class="w-100 text-center mb-0 text-white"><b>Card Image Overlay</b></h4>
</div>
<img class="img-fluid w-100 rounded" src="assets/styleguide/people_6.jpg" alt="Card image"> </div>
</div>
</div>
</div>
</div>
<div class="py-5">
<div class="container">
<div class="row">
<div class="col-12">
<h2>Listing</h2>
<hr class="mb-4"> </div>
</div>
<div class="row">
<div class="col-md-6 p-3">
<ul class="list-group">
<li class="list-group-item">List group <i class="fa fa-fw fa-bicycle"></i> </li>
<li class="list-group-item active"> Active list item</li>
<li class="list-group-item disabled">Disabled list item</li>
<a href="#" class="list-group-item list-group-item-action">Link list item</a>
</ul>
</div>
<div class="col-md-6 p-3">
<table class="table table-hover table-striped table-bordered">
<thead class="thead-inverse">
<tr>
<th scope="col">#</th>
<th scope="col">Striped table</th>
<th scope="col">bordered</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>example</td>
<td>one</td>
</tr>
<tr>
<th scope="row">2</th>
<td>example</td>
<td>two</td>
</tr>
<tr class="bg-info">
<th scope="row">3</th>
<td>example</td>
<td>three</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="pt-5">
<div class="container">
<div class="row">
<div class="col-12">
<h2>Navigation</h2>
<hr class="mb-4"> </div>
</div>
</div>
</div>
<nav class="navbar navbar-expand-md navbar-dark bg-primary">
<div class="container">
<a class="navbar-brand" href="#"><b>Navbar Primary&nbsp;</b></a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarPrimarySupportedContent" aria-controls="navbar2SupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span> </button>
<div class="collapse navbar-collapse text-center justify-content-end" id="navbarPrimarySupportedContent">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#"> Nav item</a>
</li>
</ul>
<a class="btn navbar-btn ml-2 btn-secondary" href="#"> Button</a>
</div>
</div>
</nav>
<nav class="navbar navbar-expand-md navbar-dark bg-secondary my-3">
<div class="container">
<a class="navbar-brand" href="#"><b>Navbar Secondary</b></a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSecondarySupportedContent" aria-controls="navbar2SupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span> </button>
<div class="collapse navbar-collapse text-center justify-content-end" id="navbarSecondarySupportedContent">
<ul class="navbar-nav">
<li class="nav-item mx-2">
<a class="nav-link" href="#"><i class="fa d-inline fa-lg fa-bookmark-o"></i></a>
</li>
</ul>
<a class="btn navbar-btn ml-2 text-white btn-primary" href="#"><i class="fa d-inline fa-lg fa-user-circle-o ml-1"></i>&nbsp;</a>
</div>
</div>
</nav>
<nav class="navbar navbar-expand-md my-3 navbar-light bg-light">
<div class="container">
<a class="navbar-brand" href="#"><b>Navbar Light</b></a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarLightSupportedContent" aria-controls="navbar2SupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span> </button>
<div class="collapse navbar-collapse text-center justify-content-end" id="navbarLightSupportedContent">
<ul class="navbar-nav">
<li class="nav-item mx-1">
<a class="nav-link" href="#"><i class="fa d-inline fa-facebook-square"></i>&nbsp; share</a>
</li>
<li class="nav-item mx-1">
<a class="nav-link" href="#"><i class="fa d-inline fa-twitter"></i>&nbsp; tweet</a>
</li>
<li class="nav-item mx-1">
<a class="nav-link" href="#"><i class="fa d-inline fa-pinterest"></i>&nbsp; pin</a>
</li>
</ul>
</div>
</div>
</nav>
<nav class="navbar navbar-expand-md my-3 navbar-dark bg-dark">
<div class="container">
<a class="navbar-brand" href="#"><b>Navbar Dark</b></a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarDarkSupportedContent" aria-controls="navbar2SupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span> </button>
<div class="collapse navbar-collapse text-center justify-content-end" id="navbarDarkSupportedContent">
<ul class="navbar-nav"></ul>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="text" placeholder="Search">
<button class="btn my-2 my-sm-0 btn-primary" type="submit">Search</button>
</form>
</div>
</div>
</nav>
<div class="pt-5">
<div class="container">
<div class="row">
<div class="col-md-12">
<h2>Sections</h2>
<hr class="mb-4">
</div>
</div>
</div>
</div>
<div class="py-5 text-center section-fade-in-out" style="background-image: url(&quot;assets/styleguide/cover_1.jpg&quot;);">
<div class="container py-5">
<div class="row">
<div class="col-md-12">
<h1 class="display-4 mb-0">Fade in &amp; out</h1>
</div>
</div>
</div>
</div>
<div class="py-5 text-center section-fade-in" style="background-image: url(&quot;assets/styleguide/cover_4.jpg&quot;);">
<div class="container py-5">
<div class="row">
<div class="col-md-12">
<h1 class="display-4 mb-0">Fade in</h1>
</div>
</div>
</div>
</div>
<div class="py-5 text-center section-fade-out" style="background-image: url(&quot;assets/styleguide/cover_3.jpg&quot;);">
<div class="container py-5">
<div class="row">
<div class="col-md-12">
<h1 class="display-4 mb-0">Fade out</h1>
</div>
</div>
</div>
</div>
<script src="http://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
</body>
</html>
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="tp.css" type="text/css"> </head>
<body class="text-center bg-primary">
<div class="text-center text-capitalize w-100" style="background-image: url('../../nid/mancora-peru-sky-sea-ocean-umbrella-couch-beach-sand-beach.jpg');background-size:cover;background-position:center center;">
<div class="container py-5">
<div class="row">
<div class="border-primary col-md-4 col-xl-9">
<h1 class="display-3 mb-4 navbar-light text-left text-dark text-uppercase">Phuket&nbsp;
<br>&nbsp; &nbsp; &nbsp; Travel</h1>
</div>
</div>
</div>
</div>
<div class="py-2 bg-dark w-100">
<div class="container">
<div class="row">
<div class="col-md-3">
<a class="btn btn-lg btn-primary" href="home.html"> หน้าหลัก </a>
</div>
<div class="col-md-3">
<a class="btn btn-lg btn-secondary" href="tp0.html"> แพ็คเกจและโปรโมชั่น </a>
</div>
<div class="col-md-3">
<div class="btn-group btn-group-lg">
<button class="btn btn-primary dropdown-toggle" data-toggle="dropdown"> เที่ยวภูเก็ต </button>
<div class="dropdown-menu">
<a class="dropdown-item" href="phuket1.html">ที่กิน</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket2.html">ที่เที่ยว</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket3.html">ที่พัก</a>
</div>
</div>
</div>
<div class="col-md-3">
<a class="btn btn-primary btn-lg" href="about.html"> เกี่ยวกับ </a>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light" style="background-position:left">
<div class="container">
<div class="row">
<div class="col-md-3">
<ul class="list-group">
<li class="list-group-item d-flex justify-content-between align-items-center px-5 list-group-item-danger"> แพ็คเกจทัวร์ภูเก็ต </li>
<a class="list-group-item d-flex justify-content-between align-items-center" href="tp0.html"> แพ็คเกจทัวร์ภูเก็ต 2 วัน 1 คืน </a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="tp.html"> แพ็คเกจทัวร์ภูเก็ต 3 วัน 2 คืน </a>
<li class="list-group-item d-flex justify-content-between align-items-center px-5 list-group-item-danger">&nbsp; &nbsp;โปรโมชั่นที่พัก </li>
<a class="list-group-item align-items-center justify-content-between d-flex" href="tp3.html"> โปรโมชั่นโรงแรมถาวรบีชวิลเลจรีสอร์ทแอนด์สปาภูเก็ต </a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="tp4.html"> โปรโมชั่นโรงแรมศรีพันวาภูเก็ต </a>
</ul>
</div>
<div class="col-md-9">
<h3 class="display-4">
<u>แพ็คเกจทัวร์ภูเก็ต</u>&nbsp;
<br> </h3>
<h1 class="text-dark">ทัวร์เกาะรายา – เกาะเฮ - เกาะพีพี – เกาะไข่&nbsp;
<br>เรือเร็ว&nbsp;3 วัน 2 คืน
<u>เริ่มต้นเพียง</u> 4,190 บาท
<br>
<br> </h1>
<div class="mx-5 col-lg-10 col-md-6">
<div class="card shadowed">
<div class="card-block text-center card-primary p-2 bg-info bg-gradient">
<h2 class="">Day 1
<br> </h2>
<p class="lead">รถรับสนามบินภูเก็ต – ส่งท่านยังที่พัก</p>
</div>
<ul class="list-group list-group-flush">
<li class="list-group-item text-left"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;XX.XX เจ้าหน้าที่รอรับท่านที่สนามบินนานาชาติภูเก็ต เพื่อนำท่านไปยังโรงแรมที่พัก&nbsp;
<br>&nbsp; &nbsp; &nbsp; - ส่งท่านยังโรงแรมที่พัก และพักผ่อนตามอัธยาศัย</li>
</ul>
</div>
</div>
<div class="col-md-10 col-lg-10 py-5 mx-5">
<div class="card shadowed">
<div class="card-block text-center card-primary p-2 bg-info bg-gradient">
<h2>Day 2</h2>
<p class="lead">ทัวร์เกาะรายา – เกาะเฮ โดยเรือเร็ว (อาหารเช้า - อาหารเที่ยง)</p>
</div>
<ul class="list-group list-group-flush text-left">
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;08.30 - 09.00 น. รถรับท่านจากโรงแรมที่พัก (เวลารับที่แน่นอนขึ้นอยู่ที่ตั้งของโรงแรมที่คุณพัก)</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;09.00 น.ภูเก็ตเดินทางถึงท่าเทียบเรือฉลอง เช็คอินก่อนออกเดินทางโดยเรือเร็ว&nbsp;
<br>ใช้เวลาเดินทางประมาณ 15-20 นาที</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;09.30 น.ภูเก็ตถึงเกาะเฮ เล่นน้ำ หรือเลือกพักผ่อนตามอัธยาศัยที่หาด เลือกสนุกกับกิจกรรมทางน้ำมากมาย เช่น ภูเก็ตพาราเซลลิ่ง บานาน่าโบ๊ท ซีวอล์กเกอร์ (กิจกรรมนี้ไม่รวมในโปรแกรมทัวร์)</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;10.30 น.ภูเก็ตออกเดินทางต่อไปยังเกาะรายา เล่นน้ำ ดำผิวน้ำชมปะการัง บริเวณอ่าวปะตก&nbsp;
<br>(ขึ้นอยู่กับกระแสน้ำและคลื่นลมทะเล) สนุกสนานกับการเล่นน้ำ ดำน้ำชมปะการัง ตื่นตาตื่นใจ ภูเก็ตกับปะการังหลากสีสัน ปลานานาชนิด และชีวิตได้ทะเลหลากหลายชนิด หรือเลือกพักผ่อนตามอัธยาศัย</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;12.30 น.ภูเก็ตรับประทานอาหารกลางวัน ที่ร้านอาหารบนเกาะ หลังจากนั้นท่านสามารถเล่นน้ำชมฝูงปลานานาชนิด ภูเก็ตหรือเลือกพักผ่อนบนชายหาดตามอัธยาศัย</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;15.00 น.ภูเก็ตเดินทางกลับท่าเรืออ่าวฉลอง โดยใช้เวลาเดินทางประมาณ 30 นาที</li>
<li class="list-group-item text-left"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;17.30 น.ภูเก็ตส่งท่านยังที่พักที่โรงแรม </li>
</ul>
</div>
</div>
<img class="img-fluid d-block mx-5 px-5 rounded-circle" src="../../nid/day2.jpg">
<div class="col-md-10 col-lg-10 py-5 mx-5">
<div class="card shadowed">
<div class="card-block text-center card-primary p-2 bg-info bg-gradient">
<h2>Day 3</h2>
<p class="lead">ทัวร์เกาะพีพี – เกาะไข่ โดยเรือเร็ว – ส่งสนามบิน (อาหารเช้า - อาหารเที่ยง)</p>
</div>
<ul class="list-group list-group-flush text-left">
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;07.15 - 07.30 น. รถรับจากโรงแรม เพื่อเดินทางไปยังท่าเทียบเรือ (เวลารับที่แน่นอนขึ้นอยู่ที่ตั้งของโรงแรมที่คุณพัก) ภูเก็ตเช็คเอาท์พร้อมนำกระเป๋าเดินทางติดตัวมาด้วยค่ะ</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;08.30 น.ภูเก็ตถึงท่าเรือ รับบริการชา, กาแฟ</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;09.00 น.ภูเก็ตเรือออกจากท่าเรือ มุ่งหน้าสู่เกาะพีพี</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;10.20 น.ภูเก็ตถึงเกาะพีพี อ่าวมาหยา ชมสถานที่ถ่ายทำภาพยนตร์ ชื่อดังก้องโลก "เดอะบีช" ภูเก็ตชมความงามของอ่าวมาหยา เล่นน้ำ ถ่ายภาพ พักผ่อนตามอัธยาศัย</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;11.20 น.ภูเก็ตออกจากอ่าวมาหยา เดินทางต่อไปยังอ่าวโล๊ะสะมะ เล่นน้ำ ชมปลา ดูปะการัง&nbsp;
<br>ชมความงามของอ่าว</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;12.15 น.ภูเก็ตออกเดินทางสู่อ่าวปิเละ สถานที่ที่ได้รับการขนานนามว่า "สระว่ายน้ำกลางทะเล" ผ่านถ้ำไวกิ้ง ภูเก็ตถ้ำกลางทะเล สถานที่ที่เคยถูกค้นพบโดยนักเดินเรือ พร้อมถ่ายภาพความงดงาม</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;13.00 น.ภูเก็ตอิ่มอร่อยกับอาหารมื้อเที่ยงที่เกาะพีพีดอน พักผ่อนตามอัธยาศัย เดินทางต่อไปยังอ่าวลิง ภูเก็ตสนุกสนานไปกับการให้อาหารลิง ถ่ายภาพเป็นที่ระลึก หลังจากนั้นออกเดินต่อไปยังเกาะไข่นอก
</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;15.00 น.ภูเก็ตถึงเกาะไข่นอก พักผ่อนเล่นน้ำเพลิดเพลินกับฝูงปลามากมาย พักผ่อนตามอัธยาศัย </li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;16.00 น.ภูเก็ตออกจากเกาะไข่นอก เดินทางสู่เกาะภูเก็ต </li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;16.30 น.ภูเก็ตถึงท่าเรือ </li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;18.00 น.ภูเก็ตส่งท่านยังสนามบินภูเก็ต และเดินทางกลับโดยสวัสดิภาพพร้อมความประทับใจ </li>
</ul>
</div>
</div>
<img class="img-fluid d-block" src="../../nid/day3.1.jpg" width="100%">
<img class="img-fluid d-block" src="../../nid/day3.jpg" width="100%" height="100%">
<h3 class="text-secondary m-5 px-0" contenteditable="true">ราคาดังกล่าวเป็นราคาสำหรับเดินทางตั้งแต่ 2 ท่านขึ้นไป</h3>
<div class="list-group">
<a href="#" class="list-group-item list-group-item-action flex-column align-items-start active list-group-item-success">
<div class="d-flex w-100 justify-content-between">
<h5 class="mb-1">จองทัวร์ได้ที่</h5>
</div>
<p class="mb-1">โทร : 085-5769918 / 081-2713400&nbsp;
<br>อีเมลล์ : tourtawan@gmail.com / info@tawantour.com&nbsp;
<br>แฟกซ์ : 076-263215
<br>Line ID : tawantour</p>
</a>
</div>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<pingendo onclick="window.open('https://pingendo.com/', '_blank')" style="cursor:pointer;position: fixed;bottom: 10px;right:10px;padding:4px;background-color: #00b0eb;border-radius: 8px; width:180px;display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:14px;color:white">Made with Pingendo&nbsp;&nbsp;
<img src="https://pingendo.com/site-assets/Pingendo_logo_big.png" class="d-block" alt="Pingendo logo" height="16">
</pingendo>
</body>
</html>
\ No newline at end of file
/*!
* Based on Bootstrap v4.0.0 (https://getbootstrap.com)
*/
// Options
//
// Quickly modify global styling by enabling or disabling optional features.
$enable-rounded: true !default;
$enable-shadows: true;
$enable-transitions: true;
$enable-hover-media-query: false;
$enable-grid-classes: true;
$enable-print-styles: true;
// Variables
//
// Colors
$theme-colors: (
primary: #f1cd31,
secondary: #f70655,
light: #f3f3f3,
dark: #303030,
info: #009ac0,
success: #28a745,
warning: #ffc107,
danger: #dc3545
);
$body-bg: #111;
$body-color: #efefef;
$body-color-inverse: invert($body-color) !default;
$link-color: #f1cd31;
// Fonts
$font-family-base: 'Comic Sans MS', cursive, sans-serif;
$headings-font-family: 'Comic Sans MS', cursive, sans-serif;
$display-font-family: 'Comic Sans MS', cursive, sans-serif;
$font-weight-normal: 200;
$headings-font-weight: 200;
$lead-font-size: 1.30rem;
$spacer: 1.5rem;
$border-radius: 1rem;
$border-radius-lg: $border-radius * 1.2;
$border-radius-sm: $border-radius * .8;
$font-size-base: 0.85rem;
@import 'bootstrap-4.0.0';
html,body {
height:100%;
}
.cover {
min-height:100%;
display:flex;
align-items:center
}
.bg-gradient {
overflow: hidden;
color: color-yiq(map-get($theme-colors, 'primary'));
background: linear-gradient(-30deg, theme-color("secondary") 0%, theme-color("primary") 50%, theme-color("primary") 100%);
}
.filter-dark {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'dark'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'dark'), 0.75);
}
}
.filter-light {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'light'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'light'),0.75);
}
}
.filter-color {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'primary'), 0.75);
}
}
.filter-gradient {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient(-30deg, transparentize(theme-color("secondary"), 0.1) 0%, transparentize(theme-color("primary"), 0.1) 50%, transparentize(theme-color("primary"), 0.05) 100%);
}
}
.filter-fade-in {
overflow: hidden;
position: relative;
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient($body-bg, transparentize($body-bg, 0.2),transparentize($body-bg, 0.9),transparentize($body-bg, 1));
}
}
This source diff could not be displayed because it is too large. You can view the blob instead.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="tp0.css" type="text/css"> </head>
<body class="text-center bg-primary">
<div class="text-center text-capitalize w-100" style="background-image: url('C:/Users/User/Desktop/nid/mancora-peru-sky-sea-ocean-umbrella-couch-beach-sand-beach.jpg');background-size:cover;background-position:center center;">
<div class="container py-5">
<div class="row">
<div class="border-primary col-md-4 col-xl-9">
<h1 class="display-3 mb-4 navbar-light text-left text-dark text-uppercase">Phuket&nbsp;
<br>&nbsp; &nbsp; &nbsp; Travel</h1>
</div>
</div>
</div>
</div>
<div class="py-2 bg-dark w-100">
<div class="container">
<div class="row">
<div class="col-md-3">
<a class="btn btn-lg btn-primary" href="home.html"> หน้าหลัก </a>
</div>
<div class="col-md-3">
<a class="btn btn-lg btn-secondary" href="tp0.html"> แพ็คเกจและโปรโมชั่น </a>
</div>
<div class="col-md-3">
<div class="btn-group btn-group-lg">
<button class="btn btn-primary dropdown-toggle" data-toggle="dropdown"> เที่ยวภูเก็ต </button>
<div class="dropdown-menu">
<a class="dropdown-item" href="phuket1.html">ที่กิน</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket2.html">ที่เที่ยว</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket3.html">ที่พัก</a>
</div>
</div>
</div>
<div class="col-md-3">
<a class="btn btn-primary btn-lg" href="about.html"> เกี่ยวกับ </a>
</div>
</div>
</div>
</div>
<div class="py-5 filter-light bg-primary">
<div class="container">
<div class="row">
<div class="col-md-3">
<ul class="list-group">
<li class="list-group-item d-flex justify-content-between align-items-center px-5 list-group-item-danger"> แพ็คเกจทัวร์ภูเก็ต </li>
<a class="list-group-item d-flex justify-content-between align-items-center" href="tp0.html"> แพ็คเกจทัวร์ภูเก็ต 2 วัน 1 คืน </a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="tp.html"> แพ็คเกจทัวร์ภูเก็ต 3 วัน 2 คืน </a>
<li class="list-group-item d-flex justify-content-between align-items-center px-5 list-group-item-danger">&nbsp; &nbsp;โปรโมชั่นที่พัก </li>
<a class="list-group-item align-items-center justify-content-between d-flex" href="tp3.html"> โปรโมชั่นโรงแรมถาวรบีชวิลเลจรีสอร์ทแอนด์สปาภูเก็ต </a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="tp4.html"> โปรโมชั่นโรงแรมศรีพันวาภูเก็ต </a>
</ul>
</div>
<div class="col-md-9">
<h3 class="display-4">
<u>แพ็คเกจทัวร์ภูเก็ต</u>&nbsp;
<br> </h3>
<h1 class="text-dark">ทัวร์ชมเมืองภูเก็ต – ทัวร์ล่องเรือแคนูชมอ่าวพังงา&nbsp;
<br>เรือใหญ่ 2 วัน 1 คืน
<br> </h1>
<div class="mx-5 col-lg-10 col-md-6 py-5">
<div class="card shadowed">
<div class="card-block text-center card-primary p-2 bg-danger bg-gradient">
<h2 class="">Day 1
<br> </h2>
<p class="lead">รถรับสนามบินภูเก็ต – ทัวร์ชมเมืองภูเก็ต 5 ชั่วโมง – ส่งท่านยังที่พัก&nbsp;
<br>(ทัวร์ส่วนตัว)</p>
</div>
<ul class="list-group list-group-flush">
<li class="list-group-item text-left"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;XX.XXภูเก็ตเดินทางมาถึงภูเก็ต เจ้าหน้าที่รอรับท่านที่ประตูโดยสารขาเข้าภายในประเทศที่สนามบินนานาชาติภูเก็ต ภูเก็ตเพื่อนำท่านไปชมเมืองภูเก็ตประมาณ 5 ชั่วโมง</li>
</ul>
</div>
</div>
<img class="img-fluid d-block" src="../../nid/daa1.jpg" width="100%">
<img class="img-fluid d-block" src="../../nid/daaa11.jpg" width="100%">
<div class="col-md-6 col-lg-10 py-5 mx-5">
<div class="card shadowed">
<div class="card-block text-center card-primary p-2 bg-info bg-gradient">
<h2>Day 2</h2>
<p class="lead">ทัวร์ล่องเรือแคนูชมอ่าวพังงา เรือใหญ่ – ส่งสนามบิน&nbsp;
<br>(อาหารเช้า - อาหารเที่ยง)</p>
</div>
<ul class="list-group list-group-flush text-left">
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;07.30 – 08.00 น. รถรับท่านจากโรงแรมที่พัก ไปยังท่าเรือ (เวลารับที่แน่นอนขึ้นอยู่ที่ตั้งของโรงแรมที่คุณพัก) ภูเก็ตเช็คเอาท์พร้อมนำกระเป๋าเดินทางติดตัวมาด้วยค่ะ</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;09.30 น.ภูเก็ตมาถึงท่าเรือมี ชา กาแฟ และขนมบริการฟรี</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;09.45 น.ภูเก็ตออกจากท่าเรือไปยังอ่าวพังงาโดยเรือใหญ่</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;10.30 น.ภูเก็ตมาถึงเกาะพนัก สนุกกับการพายแคนูเข้าชมภายในถ้ำ</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;11.30 น.ภูเก็ตออกจากเกาะพนักไปยังเกาะห้อง และสนุกกับการพายแคนูชมหินงอกหินย้อย</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;12.30 น.ภูเก็ตรับประทานอาหารบุฟเฟ่ต์บนเรือ</li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;13.30 น.ภูเก็ตเยี่ยมชมเขาตะปู ซึ่งเป็นสถานที่ที่เคยถ่ายทำภาพยนตร์เรื่อง “เจมส์บอนด์ 007”&nbsp;
<br>และชมเขาพิงกันภูเก็ตซื้อของฝาก อาทิ สร้อยมุก กำไลมุก เป็นต้น </li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;14.30 น.ภูเก็ตออกจากเขาตะปูไปยังจุดเล่นน้ำ และให้พักผ่อน 1 ชั่วโมง </li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;15.45 น.ภูเก็ตออกจากจุดเล่นน้ำโดยเรือใหญ่กลับท่าเรือ </li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;16.30 น.ภูเก็ตถึงท่าเรือ เจ้าหน้าที่รอรับท่านที่ท่าเรือ เพื่อนำท่านไปยังสนามบินภูเก็ต </li>
<li class="list-group-item"><i class="mx-auto fa d-inline fa-clock-o text-primary"></i>&nbsp;18.30 น.ภูเก็ตส่งท่านยังสนามบินภูเก็ต และเดินทางกลับโดยสวัสดิภาพพร้อมความประทับใจ </li>
</ul>
</div>
</div>
<div class="list-group">
<a href="#" class="list-group-item list-group-item-action flex-column align-items-start active list-group-item-success">
<div class="d-flex w-100 justify-content-between">
<h5 class="mb-1">จองทัวร์ได้ที่</h5>
</div>
<p class="mb-1">โทร : 085-5769918 / 081-2713400
<br>อีเมลล์ : tourtawan@gmail.com / info@tawantour.com&nbsp;
<br>แฟกซ์ : 076-263215&nbsp;
<br>Line ID : tawantour</p> <small><br></small> </a>
</div>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<pingendo onclick="window.open('https://pingendo.com/', '_blank')" style="cursor:pointer;position: fixed;bottom: 10px;right:10px;padding:4px;background-color: #00b0eb;border-radius: 8px; width:180px;display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:14px;color:white">Made with Pingendo&nbsp;&nbsp;
<img src="https://pingendo.com/site-assets/Pingendo_logo_big.png" class="d-block" alt="Pingendo logo" height="16">
</pingendo>
</body>
</html>
\ No newline at end of file
/*!
* Based on Bootstrap v4.0.0 (https://getbootstrap.com)
*/
// Options
//
// Quickly modify global styling by enabling or disabling optional features.
$enable-rounded: true !default;
$enable-shadows: true;
$enable-transitions: true;
$enable-hover-media-query: false;
$enable-grid-classes: true;
$enable-print-styles: true;
// Variables
//
// Colors
$theme-colors: (
primary: #f1cd31,
secondary: #f70655,
light: #f3f3f3,
dark: #303030,
info: #009ac0,
success: #28a745,
warning: #ffc107,
danger: #dc3545
);
$body-bg: #111;
$body-color: #efefef;
$body-color-inverse: invert($body-color) !default;
$link-color: #f1cd31;
// Fonts
$font-family-base: 'Comic Sans MS', cursive, sans-serif;
$headings-font-family: 'Comic Sans MS', cursive, sans-serif;
$display-font-family: 'Comic Sans MS', cursive, sans-serif;
$font-weight-normal: 200;
$headings-font-weight: 200;
$lead-font-size: 1.30rem;
$spacer: 1.5rem;
$font-size-base: 0.85rem;
$border-radius: 1rem;
$border-radius-lg: $border-radius * 1.2;
$border-radius-sm: $border-radius * .8;
@import 'bootstrap-4.0.0';
html,body {
height:100%;
}
.cover {
min-height:100%;
display:flex;
align-items:center
}
.bg-gradient {
overflow: hidden;
color: color-yiq(map-get($theme-colors, 'primary'));
background: linear-gradient(-30deg, theme-color("secondary") 0%, theme-color("primary") 50%, theme-color("primary") 100%);
}
.filter-dark {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'dark'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'dark'), 0.75);
}
}
.filter-light {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'light'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'light'),0.75);
}
}
.filter-color {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'primary'), 0.75);
}
}
.filter-gradient {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient(-30deg, transparentize(theme-color("secondary"), 0.1) 0%, transparentize(theme-color("primary"), 0.1) 50%, transparentize(theme-color("primary"), 0.05) 100%);
}
}
.filter-fade-in {
overflow: hidden;
position: relative;
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient($body-bg, transparentize($body-bg, 0.2),transparentize($body-bg, 0.9),transparentize($body-bg, 1));
}
}
This source diff could not be displayed because it is too large. You can view the blob instead.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="tp3.css" type="text/css"> </head>
<body class="text-center bg-primary">
<div class="text-center text-capitalize w-100" style="background-image: url('C:/Users/User/Desktop/nid/mancora-peru-sky-sea-ocean-umbrella-couch-beach-sand-beach.jpg');background-size:cover;background-position:center center;">
<div class="container py-5">
<div class="row">
<div class="border-primary col-md-4 col-xl-9">
<h1 class="display-3 mb-4 navbar-light text-left text-dark text-uppercase">Phuket&nbsp;
<br>&nbsp; &nbsp; &nbsp; Travel</h1>
</div>
</div>
</div>
</div>
<div class="py-2 bg-dark w-100">
<div class="container">
<div class="row">
<div class="col-md-3">
<a class="btn btn-lg btn-primary" href="home.html"> หน้าหลัก </a>
</div>
<div class="col-md-3">
<a class="btn btn-lg btn-secondary" href="tp0.html"> แพ็คเกจและโปรโมชั่น </a>
</div>
<div class="col-md-3">
<div class="btn-group btn-group-lg">
<button class="btn btn-primary dropdown-toggle" data-toggle="dropdown"> เที่ยวภูเก็ต </button>
<div class="dropdown-menu">
<a class="dropdown-item" href="phuket1.html">ที่กิน</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket2.html">ที่เที่ยว</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket3.html">ที่พัก</a>
</div>
</div>
</div>
<div class="col-md-3">
<a class="btn btn-primary btn-lg" href="about.html"> เกี่ยวกับ </a>
</div>
</div>
</div>
</div>
<div class="filter-light bg-primary" style="background-position:left bottom;background-size:cover;">
<div class="container">
<div class="row">
<div class="col-md-3 my-5">
<ul class="list-group">
<li class="list-group-item d-flex justify-content-between align-items-center px-5 list-group-item-danger"> แพ็คเกจทัวร์ภูเก็ต </li>
<a class="list-group-item d-flex justify-content-between align-items-center" href="tp0.html"> แพ็คเกจทัวร์ภูเก็ต 2 วัน 1 คืน </a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="tp.html"> แพ็คเกจทัวร์ภูเก็ต 3 วัน 2 คืน </a>
<li class="list-group-item d-flex justify-content-between align-items-center px-5 list-group-item-danger">&nbsp; &nbsp;โปรโมชั่นที่พัก </li>
<a class="list-group-item align-items-center justify-content-between d-flex" href="tp3.html"> โปรโมชั่นโรงแรมถาวรบีชวิลเลจรีสอร์ทแอนด์สปาภูเก็ต </a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="tp4.html"> โปรโมชั่นโรงแรมศรีพันวาภูเก็ต </a>
</ul>
</div>
<div class="col-md-9 my-5">
<h3 class="display-4">
<u>โปรโมชั่นที่พัก</u>&nbsp;
<br> </h3>
<h1 class="text-dark">ถาวร บีช วิลเลจ รีสอร์ท แอนด์ สปา ภูเก็ต&nbsp;
<br>(THAVORN BEACH VILLAGE RESORT&nbsp;
<br>&amp;&nbsp;SPA PHUKET)
<br> </h1>
<img class="img-fluid d-block my-5" src="../../nid/โรงแรมๅ.jpg">
<p class="lead text-left">
<u>โปรโมชั่นโรงแรม ถาวร บีช วิลเลจ รีสอร์ท แอนด์ สปา ภูเก็ต</u>&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ห้องพักพร้อมอาหารเช้า&nbsp;
<br>&nbsp; &nbsp; &nbsp;- Beachfront Cottage, Poolside with bathtub หรือ Hillside Ocean Facing with Jacuzzi
<br>&nbsp; &nbsp; &nbsp;- ลดทันที 50% จากราคา Best Available Rate&nbsp;
<br> -----------------------------------------------------------------------------------------------
<br>
<u>สิทธิพิเศษ</u>&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ฟรี สิทธิ์เข้าใช้บริการ VIP Lounge (มูลค่า 500 บาท)&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ฟรี Wi-Fi&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ลด 15% สำหรับสปา&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ลด 10% สำหรับค่าอาหาและเครื่องดื่ม (ยกเว้นรูมเซอร์วิส)
<br> -----------------------------------------------------------------------------------------------
<br>
<u>1 พ.ย. 60 – 31 มี.ค. 61</u>&nbsp;
<br>&nbsp; &nbsp; &nbsp;- สำรองห้องพักที่ www.thavornbeachvillage.com เท่านั้น (ระบุรหัสโปรโมชั่น ‘KTC17B’ ) &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;- สอบถามรายละเอียดและสำรองห้องพัก โรงแรม ถาวร บีช วิลเลจ รีสอร์ท แอนด์ สปา ภูเก็ต&nbsp;
<br>&nbsp; &nbsp; &nbsp;- โทร: 076 396 035, 076 618 217&nbsp;
<br>&nbsp; &nbsp; &nbsp;- อีเมล์: rsvn@thavornbeachvillage.com, info@thavornbeachvillage.com&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ที่อยู่: 6/2 หมู่ 6 ตำบล กมลา อำเภอ กะทู้ ภูเก็ต 83150
<br>
<br> </p>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<pingendo onclick="window.open('https://pingendo.com/', '_blank')" style="cursor:pointer;position: fixed;bottom: 10px;right:10px;padding:4px;background-color: #00b0eb;border-radius: 8px; width:180px;display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:14px;color:white">Made with Pingendo&nbsp;&nbsp;
<img src="https://pingendo.com/site-assets/Pingendo_logo_big.png" class="d-block" alt="Pingendo logo" height="16">
</pingendo>
</body>
</html>
\ No newline at end of file
/*!
* Based on Bootstrap v4.0.0 (https://getbootstrap.com)
*/
// Options
//
// Quickly modify global styling by enabling or disabling optional features.
$enable-rounded: true !default;
$enable-shadows: true;
$enable-transitions: true;
$enable-hover-media-query: false;
$enable-grid-classes: true;
$enable-print-styles: true;
// Variables
//
// Colors
$theme-colors: (
primary: #f1cd31,
secondary: #f70655,
light: #f3f3f3,
dark: #303030,
info: #009ac0,
success: #28a745,
warning: #ffc107,
danger: #dc3545
);
$body-bg: #111;
$body-color: #efefef;
$body-color-inverse: invert($body-color) !default;
$link-color: #f1cd31;
// Fonts
$font-family-base: 'Comic Sans MS', cursive, sans-serif;
$headings-font-family: 'Comic Sans MS', cursive, sans-serif;
$display-font-family: 'Comic Sans MS', cursive, sans-serif;
$font-weight-normal: 200;
$headings-font-weight: 200;
$lead-font-size: 1.30rem;
$spacer: 1.5rem;
$font-size-base: 0.85rem;
$border-radius: 1rem;
$border-radius-lg: $border-radius * 1.2;
$border-radius-sm: $border-radius * .8;
@import 'bootstrap-4.0.0';
html,body {
height:100%;
}
.cover {
min-height:100%;
display:flex;
align-items:center
}
.bg-gradient {
overflow: hidden;
color: color-yiq(map-get($theme-colors, 'primary'));
background: linear-gradient(-30deg, theme-color("secondary") 0%, theme-color("primary") 50%, theme-color("primary") 100%);
}
.filter-dark {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'dark'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'dark'), 0.75);
}
}
.filter-light {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'light'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'light'),0.75);
}
}
.filter-color {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'primary'), 0.75);
}
}
.filter-gradient {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient(-30deg, transparentize(theme-color("secondary"), 0.1) 0%, transparentize(theme-color("primary"), 0.1) 50%, transparentize(theme-color("primary"), 0.05) 100%);
}
}
.filter-fade-in {
overflow: hidden;
position: relative;
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient($body-bg, transparentize($body-bg, 0.2),transparentize($body-bg, 0.9),transparentize($body-bg, 1));
}
}
This source diff could not be displayed because it is too large. You can view the blob instead.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="tp4.css" type="text/css"> </head>
<body class="text-center bg-primary">
<div class="text-center text-capitalize w-100" style="background-image: url('C:/Users/User/Desktop/nid/mancora-peru-sky-sea-ocean-umbrella-couch-beach-sand-beach.jpg');background-size:cover;background-position:center center;">
<div class="container py-5">
<div class="row">
<div class="border-primary col-md-4 col-xl-9">
<h1 class="display-3 mb-4 navbar-light text-left text-dark text-uppercase">Phuket&nbsp;
<br>&nbsp; &nbsp; &nbsp; Travel</h1>
</div>
</div>
</div>
</div>
<div class="py-2 bg-dark w-100">
<div class="container">
<div class="row">
<div class="col-md-3">
<a class="btn btn-lg btn-primary" href="home.html"> หน้าหลัก </a>
</div>
<div class="col-md-3">
<a class="btn btn-lg btn-secondary" href="tp0.html"> แพ็คเกจและโปรโมชั่น </a>
</div>
<div class="col-md-3">
<div class="btn-group btn-group-lg">
<button class="btn btn-primary dropdown-toggle" data-toggle="dropdown"> เที่ยวภูเก็ต </button>
<div class="dropdown-menu">
<a class="dropdown-item" href="phuket1.html">ที่กิน</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket2.html">ที่เที่ยว</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="phuket3.html">ที่พัก</a>
</div>
</div>
</div>
<div class="col-md-3">
<a class="btn btn-primary btn-lg" href="about.html"> เกี่ยวกับ </a>
</div>
</div>
</div>
</div>
<div class="filter-light" style="background-position:left bottom;background-size:cover;">
<div class="container">
<div class="row">
<div class="col-md-3 my-5">
<ul class="list-group">
<li class="list-group-item d-flex justify-content-between align-items-center px-5 list-group-item-danger"> แพ็คเกจทัวร์ภูเก็ต </li>
<a class="list-group-item d-flex justify-content-between align-items-center" href="tp0.html"> แพ็คเกจทัวร์ภูเก็ต 2 วัน 1 คืน </a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="tp.html"> แพ็คเกจทัวร์ภูเก็ต 3 วัน 2 คืน </a>
<li class="list-group-item d-flex justify-content-between align-items-center px-5 list-group-item-danger">&nbsp; &nbsp;โปรโมชั่นที่พัก </li>
<a class="list-group-item align-items-center justify-content-between d-flex" href="tp3.html"> โปรโมชั่นโรงแรมถาวรบีชวิลเลจรีสอร์ทแอนด์สปาภูเก็ต </a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="tp4.html"> โปรโมชั่นโรงแรมศรีพันวาภูเก็ต </a>
</ul>
</div>
<div class="col-md-9 my-5">
<h3 class="display-4">
<u>โปรโมชั่นที่พัก</u>&nbsp;
<br> </h3>
<h1 class="text-dark">ศรีพันวา ภูเก็ต (Sri Panwa Phuket)
<br>
<br> </h1>
<img class="img-fluid d-block" src="../../nid/โรงแรม2.jpg">
<p class="lead text-left">
<br>
<br>
<br>
<u>โปรโมชั่นโรงแรม ศรีพันวา ภูเก็ต (Sri Panwa Phuket)</u>&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ห้องพักทุกประเภทพร้อมอาหารเช้า&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ลด 35% จากราคา Best Available Rate บนเว็บไซต์&nbsp;
<br>&nbsp; &nbsp; &nbsp;- สำรองห้องพักผ่านเว็บไซต์โรงแรม www.sripanwa.com ใส่รหัสส่วนลด : KTC18SPW&nbsp;
<br>-----------------------------------------------------------------------------------------------
<br>
<u>สิทธิพิเศษ</u>&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ฟรี มินิบาร์ ทุกวัน&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ฟรี Wi-Fi&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ฟรี เครื่องดื่มพิเศษ 1 ขวด มูลค่า 2,119 บาท เมื่อเข้าพัก 2 ห้อง หรือ 4 ท่านขึ้นไป&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ลด 18% สำหรับค่าอาหารและเครื่องดื่มเมนูปกติ (ยกเว้นเครื่องดื่มแอลกอฮอล์)&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ลด 20% สำหรับสปาเมนูปกติ&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ลด 10% สำหรับสปาเมนูแพ็กเกจ&nbsp;
<br>-----------------------------------------------------------------------------------------------
<br>
<u>1 มี.ค. – 31 ต.ค. 61</u>&nbsp;
<br>&nbsp; &nbsp; &nbsp;- สอบถามรายละเอียด ศรีพันวา ภูเก็ต&nbsp;
<br>&nbsp; &nbsp; &nbsp;- โทร : 076 371 000&nbsp;
<br>&nbsp; &nbsp; &nbsp;- อีเมล : chill@sripanwa.com&nbsp;
<br>&nbsp; &nbsp; &nbsp;- ที่อยู่ : 88 หมู่ 8 ถ.ศักดิเดช ต.วิชิต อ.เมือง จ.ภูเก็ต 83000 </p>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<pingendo onclick="window.open('https://pingendo.com/', '_blank')" style="cursor:pointer;position: fixed;bottom: 10px;right:10px;padding:4px;background-color: #00b0eb;border-radius: 8px; width:180px;display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:14px;color:white">Made with Pingendo&nbsp;&nbsp;
<img src="https://pingendo.com/site-assets/Pingendo_logo_big.png" class="d-block" alt="Pingendo logo" height="16">
</pingendo>
</body>
</html>
\ No newline at end of file
/*!
* Based on Bootstrap v4.0.0 (https://getbootstrap.com)
*/
// Options
//
// Quickly modify global styling by enabling or disabling optional features.
$enable-rounded: true !default;
$enable-shadows: true;
$enable-transitions: true;
$enable-hover-media-query: false;
$enable-grid-classes: true;
$enable-print-styles: true;
// Variables
//
// Colors
$theme-colors: (
primary: #f1cd31,
secondary: #f70655,
light: #f3f3f3,
dark: #303030,
info: #009ac0,
success: #28a745,
warning: #ffc107,
danger: #dc3545
);
$body-bg: #111;
$body-color: #efefef;
$body-color-inverse: invert($body-color) !default;
$link-color: #f1cd31;
// Fonts
$font-family-base: 'Comic Sans MS', cursive, sans-serif;
$headings-font-family: 'Comic Sans MS', cursive, sans-serif;
$display-font-family: 'Comic Sans MS', cursive, sans-serif;
$font-weight-normal: 200;
$headings-font-weight: 200;
$lead-font-size: 1.30rem;
$spacer: 1.5rem;
$font-size-base: 0.85rem;
$border-radius: 1rem;
$border-radius-lg: $border-radius * 1.2;
$border-radius-sm: $border-radius * .8;
@import 'bootstrap-4.0.0';
html,body {
height:100%;
}
.cover {
min-height:100%;
display:flex;
align-items:center
}
.bg-gradient {
overflow: hidden;
color: color-yiq(map-get($theme-colors, 'primary'));
background: linear-gradient(-30deg, theme-color("secondary") 0%, theme-color("primary") 50%, theme-color("primary") 100%);
}
.filter-dark {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'dark'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'dark'), 0.75);
}
}
.filter-light {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'light'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'light'),0.75);
}
}
.filter-color {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: rgba(map-get($theme-colors, 'primary'), 0.75);
}
}
.filter-gradient {
overflow: hidden;
position: relative;
color: color-yiq(map-get($theme-colors, 'primary'));
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient(-30deg, transparentize(theme-color("secondary"), 0.1) 0%, transparentize(theme-color("primary"), 0.1) 50%, transparentize(theme-color("primary"), 0.05) 100%);
}
}
.filter-fade-in {
overflow: hidden;
position: relative;
&:before {
position: absolute;
top:0px;
left:0px;
width:100%;
height: 100%;
content: ' ';
background: linear-gradient($body-bg, transparentize($body-bg, 0.2),transparentize($body-bg, 0.9),transparentize($body-bg, 1));
}
}
projects @ 377e88f5
Subproject commit 377e88f5235d054b048c10366891be245cf07888
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment