47 changed files with 0 additions and 1094 deletions
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 2.2 MiB |
@ -1,21 +0,0 @@
@@ -1,21 +0,0 @@
|
||||
<!DOCTYPE html> |
||||
<html> |
||||
<head> |
||||
<meta charset="utf-8"> |
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
||||
<title></title> |
||||
<style type="text/css"> |
||||
body{ |
||||
background: url(images/background-photo.jpg); |
||||
} |
||||
@media only screen and (max-width: 768px){ |
||||
body{ |
||||
background: #5DCAD5; |
||||
} |
||||
} |
||||
</style> |
||||
</head> |
||||
<body> |
||||
|
||||
</body> |
||||
</html> |
||||
|
Before Width: | Height: | Size: 2.2 MiB |
@ -1,17 +0,0 @@
@@ -1,17 +0,0 @@
|
||||
<!DOCTYPE html> |
||||
<html> |
||||
<head> |
||||
<meta charset="utf-8"> |
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
||||
<title></title> |
||||
<style type="text/css"> |
||||
body{ |
||||
background: url(images/background-photo.jpg) center; |
||||
} |
||||
</style> |
||||
<link rel="stylesheet" href="mobile.css" media="only screen and (max-width:480px)"> |
||||
</head> |
||||
<body> |
||||
|
||||
</body> |
||||
</html> |
||||
@ -1,3 +0,0 @@
@@ -1,3 +0,0 @@
|
||||
body{ |
||||
background: #5DCAD5; |
||||
} |
||||
@ -1,9 +0,0 @@
@@ -1,9 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?> |
||||
<module type="JAVA_MODULE" version="4"> |
||||
<component name="NewModuleRootManager" inherit-compiler-output="true"> |
||||
<exclude-output /> |
||||
<content url="file://$MODULE_DIR$" /> |
||||
<orderEntry type="inheritedJdk" /> |
||||
<orderEntry type="sourceFolder" forTests="false" /> |
||||
</component> |
||||
</module> |
||||
@ -1,6 +0,0 @@
@@ -1,6 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?> |
||||
<project version="4"> |
||||
<component name="JavaScriptSettings"> |
||||
<option name="languageLevel" value="ES6" /> |
||||
</component> |
||||
</project> |
||||
@ -1,8 +0,0 @@
@@ -1,8 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?> |
||||
<project version="4"> |
||||
<component name="ProjectModuleManager"> |
||||
<modules> |
||||
<module fileurl="file://$PROJECT_DIR$/.idea/2-桂云商城案例.iml" filepath="$PROJECT_DIR$/.idea/2-桂云商城案例.iml" /> |
||||
</modules> |
||||
</component> |
||||
</project> |
||||
@ -1,146 +0,0 @@
@@ -1,146 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?> |
||||
<project version="4"> |
||||
<component name="ChangeListManager"> |
||||
<list default="true" id="6753f9b0-a3e1-4fad-939f-92e629d73655" name="Default Changelist" comment="" /> |
||||
<option name="EXCLUDED_CONVERTED_TO_IGNORED" value="true" /> |
||||
<option name="SHOW_DIALOG" value="false" /> |
||||
<option name="HIGHLIGHT_CONFLICTS" value="true" /> |
||||
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" /> |
||||
<option name="LAST_RESOLUTION" value="IGNORE" /> |
||||
</component> |
||||
<component name="FileEditorManager"> |
||||
<leaf> |
||||
<file pinned="false" current-in-tab="true"> |
||||
<entry file="file://$PROJECT_DIR$/桂云商城news.html"> |
||||
<provider selected="true" editor-type-id="text-editor"> |
||||
<state relative-caret-position="-2033" /> |
||||
</provider> |
||||
</entry> |
||||
</file> |
||||
</leaf> |
||||
</component> |
||||
<component name="Git.Settings"> |
||||
<option name="ROOT_SYNC" value="DONT_SYNC" /> |
||||
</component> |
||||
<component name="ProjectFrameBounds" extendedState="1"> |
||||
<option name="x" value="953" /> |
||||
<option name="width" value="974" /> |
||||
<option name="height" value="1047" /> |
||||
</component> |
||||
<component name="ProjectView"> |
||||
<navigator proportions="" version="1"> |
||||
<foldersAlwaysOnTop value="true" /> |
||||
</navigator> |
||||
<panes> |
||||
<pane id="PackagesPane" /> |
||||
<pane id="ProjectPane"> |
||||
<subPane> |
||||
<expand> |
||||
<path> |
||||
<item name="2-桂云商城案例" type="b2602c69:ProjectViewProjectNode" /> |
||||
<item name="2-桂云商城案例" type="462c0819:PsiDirectoryNode" /> |
||||
</path> |
||||
</expand> |
||||
<select /> |
||||
</subPane> |
||||
</pane> |
||||
<pane id="Scope" /> |
||||
</panes> |
||||
</component> |
||||
<component name="PropertiesComponent"> |
||||
<property name="WebServerToolWindowFactoryState" value="false" /> |
||||
<property name="aspect.path.notification.shown" value="true" /> |
||||
<property name="last_opened_file_path" value="$PROJECT_DIR$" /> |
||||
<property name="nodejs_interpreter_path.stuck_in_default_project" value="undefined stuck path" /> |
||||
<property name="nodejs_npm_path_reset_for_default_project" value="true" /> |
||||
<property name="settings.editor.selected.configurable" value="reference.settingsdialog.IDE.editor.colors" /> |
||||
</component> |
||||
<component name="RunDashboard"> |
||||
<option name="ruleStates"> |
||||
<list> |
||||
<RuleState> |
||||
<option name="name" value="ConfigurationTypeDashboardGroupingRule" /> |
||||
</RuleState> |
||||
<RuleState> |
||||
<option name="name" value="StatusDashboardGroupingRule" /> |
||||
</RuleState> |
||||
</list> |
||||
</option> |
||||
</component> |
||||
<component name="SvnConfiguration"> |
||||
<configuration /> |
||||
</component> |
||||
<component name="TaskManager"> |
||||
<task active="true" id="Default" summary="Default task"> |
||||
<changelist id="6753f9b0-a3e1-4fad-939f-92e629d73655" name="Default Changelist" comment="" /> |
||||
<created>1650598461622</created> |
||||
<option name="number" value="Default" /> |
||||
<option name="presentableId" value="Default" /> |
||||
<updated>1650598461622</updated> |
||||
<workItem from="1650598462756" duration="759000" /> |
||||
</task> |
||||
<servers /> |
||||
</component> |
||||
<component name="TimeTrackingManager"> |
||||
<option name="totallyTimeSpent" value="759000" /> |
||||
</component> |
||||
<component name="ToolWindowManager"> |
||||
<frame x="953" y="0" width="974" height="1047" extended-state="1" /> |
||||
<layout> |
||||
<window_info id="Image Layers" /> |
||||
<window_info id="Designer" /> |
||||
<window_info id="UI Designer" /> |
||||
<window_info id="Capture Tool" /> |
||||
<window_info id="Favorites" side_tool="true" /> |
||||
<window_info active="true" content_ui="combo" id="Project" order="0" visible="true" weight="0.18311404" /> |
||||
<window_info id="Structure" order="1" side_tool="true" weight="0.25" /> |
||||
<window_info anchor="bottom" id="Docker" show_stripe_button="false" /> |
||||
<window_info anchor="bottom" id="Database Changes" /> |
||||
<window_info anchor="bottom" id="Version Control" /> |
||||
<window_info anchor="bottom" id="Terminal" /> |
||||
<window_info anchor="bottom" id="Event Log" side_tool="true" /> |
||||
<window_info anchor="bottom" id="Message" order="0" /> |
||||
<window_info anchor="bottom" id="Find" order="1" /> |
||||
<window_info anchor="bottom" id="Run" order="2" /> |
||||
<window_info anchor="bottom" id="Debug" order="3" weight="0.4" /> |
||||
<window_info anchor="bottom" id="Cvs" order="4" weight="0.25" /> |
||||
<window_info anchor="bottom" id="Inspection" order="5" weight="0.4" /> |
||||
<window_info anchor="bottom" id="TODO" order="6" /> |
||||
<window_info anchor="right" id="Palette" /> |
||||
<window_info anchor="right" id="Theme Preview" /> |
||||
<window_info anchor="right" id="Maven" /> |
||||
<window_info anchor="right" id="Capture Analysis" /> |
||||
<window_info anchor="right" id="Palette	" /> |
||||
<window_info anchor="right" id="Database" /> |
||||
<window_info anchor="right" id="Commander" internal_type="SLIDING" order="0" type="SLIDING" weight="0.4" /> |
||||
<window_info anchor="right" id="Ant Build" order="1" weight="0.25" /> |
||||
<window_info anchor="right" content_ui="combo" id="Hierarchy" order="2" weight="0.25" /> |
||||
</layout> |
||||
</component> |
||||
<component name="TypeScriptGeneratedFilesManager"> |
||||
<option name="version" value="1" /> |
||||
</component> |
||||
<component name="editorHistoryManager"> |
||||
<entry file="file://$PROJECT_DIR$/桂云商城news.html"> |
||||
<provider selected="true" editor-type-id="text-editor"> |
||||
<state relative-caret-position="-2033" /> |
||||
</provider> |
||||
</entry> |
||||
</component> |
||||
<component name="masterDetails"> |
||||
<states> |
||||
<state key="ProjectJDKs.UI"> |
||||
<settings> |
||||
<last-edited>1.8</last-edited> |
||||
<splitter-proportions> |
||||
<option name="proportions"> |
||||
<list> |
||||
<option value="0.2" /> |
||||
</list> |
||||
</option> |
||||
</splitter-proportions> |
||||
</settings> |
||||
</state> |
||||
</states> |
||||
</component> |
||||
</project> |
||||
|
Before Width: | Height: | Size: 143 KiB |
|
Before Width: | Height: | Size: 43 KiB |
|
Before Width: | Height: | Size: 46 KiB |
|
Before Width: | Height: | Size: 47 KiB |
|
Before Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 1.8 KiB |
@ -1,35 +0,0 @@
@@ -1,35 +0,0 @@
|
||||
|
||||
首页地方特产新闻资讯风物广西企业专区联系我们 |
||||
今日聚焦 |
||||
云锦、壮锦、蜀锦、宋锦，“四大名锦”各有什么特色？ |
||||
|
||||
|
||||
他，用壮锦创造出民族芭比娃娃 |
||||
2020年5月20日 |
||||
|
||||
|
||||
流动的秀美“壮锦” |
||||
2020年5月18日 |
||||
|
||||
|
||||
南国大地批“绿装”俯瞰田块成壮锦 |
||||
2020年5月18日 |
||||
|
||||
05-20 |
||||
2020年 |
||||
桂云商城助力巴马养生食品销售 |
||||
桂云商城与巴马富露施食品有限公司达成重要合作，桂云商城入股巴马富露施食品有限公司，共同组建电商平台销售团队，负责该公司巴马养生食品的线上、线下的推广及销售。 |
||||
|
||||
05-20 |
||||
2020年 |
||||
桂云商城助力巴马养生食品销售 |
||||
桂云商城与巴马富露施食品有限公司达成重要合作，桂云商城入股巴马富露施食品有限公司，共同组建电商平台销售团队，负责该公司巴马养生食品的线上、线下的推广及销售。 |
||||
|
||||
05-20 |
||||
2020年 |
||||
桂云商城助力巴马养生食品销售 |
||||
桂云商城与巴马富露施食品有限公司达成重要合作，桂云商城入股巴马富露施食品有限公司，共同组建电商平台销售团队，负责该公司巴马养生食品的线上、线下的推广及销售。 |
||||
|
||||
基地地址：中国 广西 南宁 广西机电职业技术学院 |
||||
|
||||
版权所有?2020年 桂云商城 |
||||
Binary file not shown.
|
Before Width: | Height: | Size: 802 KiB |
|
Before Width: | Height: | Size: 1.7 MiB |
|
Before Width: | Height: | Size: 448 KiB |
|
Before Width: | Height: | Size: 467 KiB |
@ -1,207 +0,0 @@
@@ -1,207 +0,0 @@
|
||||
<!DOCTYPE html> |
||||
<html> |
||||
<head> |
||||
<meta charset="utf-8"> |
||||
|
||||
<title>新闻资讯</title> |
||||
<style type="text/css"> |
||||
*{ |
||||
margin: 0; |
||||
padding: 0; |
||||
} |
||||
/* header */ |
||||
.header{ |
||||
top: 10px; |
||||
width: 100vw; |
||||
height: 80px; |
||||
position: relative; |
||||
display: block; |
||||
border-bottom: solid 3px limegreen; |
||||
} |
||||
.logo img{ |
||||
line-height: 80px; |
||||
width: 120px; |
||||
height: auto; |
||||
float: left; |
||||
} |
||||
#toggle{ |
||||
display: none; |
||||
} |
||||
|
||||
/* iphone */ |
||||
@media screen (min-width: 762px) { |
||||
.menu{ |
||||
width: 40px; |
||||
height: 40px; |
||||
display: block; |
||||
position: relative; |
||||
float: right; |
||||
top: 10px; |
||||
text-align: center; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
|
||||
|
||||
/* content */ |
||||
|
||||
div{ |
||||
box-sizing: border-box; |
||||
} |
||||
.focus h1{ |
||||
font-size: 20px; |
||||
margin: 36px; |
||||
background: url(images/news/title-bg.png) no-repeat center; |
||||
text-align: center; |
||||
} |
||||
.focus h2{ |
||||
font-size: 16px; |
||||
text-align: center; |
||||
height: 2.25rem; |
||||
line-height: 2.25rem; |
||||
} |
||||
.focus img{ |
||||
width: 100%; |
||||
} |
||||
.f-main-con{ |
||||
padding: 0.625rem; |
||||
} |
||||
.f-item{ |
||||
width: 100%; |
||||
background-color: #333; |
||||
border-radius: 5px; |
||||
overflow: hidden; |
||||
} |
||||
.f-main-con img{ |
||||
float: right; |
||||
height: 8.75rem; |
||||
width: auto; |
||||
} |
||||
@media (min-width: 768px) { |
||||
.f-main-con{ |
||||
width: 33.333%; |
||||
float: left; |
||||
} |
||||
.f-main-con img{ |
||||
float: none; |
||||
width: 100%; |
||||
height: auto; |
||||
} |
||||
} |
||||
@media (min-width:992px) { |
||||
.focus{ |
||||
width: 992px; |
||||
margin: 0 auto; |
||||
} |
||||
} |
||||
</style> |
||||
</head> |
||||
<body> |
||||
<!-- 头部 --> |
||||
<div class="header"> |
||||
<div class="logo"> |
||||
<img src="images/news/logo.png"> |
||||
</div> |
||||
<div class="nav"> |
||||
<label for="toggle">☰</label> |
||||
<input type="checkbox" id="toggle"> |
||||
<div class="menu"> |
||||
<a href="#">首页</a> |
||||
<a href="#">地方特产</a> |
||||
<a href="#">新闻资讯</a> |
||||
<a href="#">风物广西</a> |
||||
<a href="#">企业专区</a> |
||||
<a href="#">联系我们</a> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- 外层容器 --> |
||||
<div class="container"> |
||||
<!-- 今日聚焦模块 --> |
||||
<div class="focus"> |
||||
<h1>今日聚焦</h1> |
||||
<h2>云锦、壮锦、蜀锦、宋锦，“四大名锦”各有什么特色？</h2> |
||||
<div class="f-banner"> |
||||
<img src="images/news/focusing-1.jpg"> |
||||
</div> |
||||
<div class="f-main"> |
||||
<div class="f-main-con"> |
||||
<div class="f-item"> |
||||
<img src="images/news/focusing-2.jpg" alt=""> |
||||
<div class="f-list-cont"> |
||||
<h4>他，用壮锦创造出民族芭比娃娃</h4> |
||||
<p>2020年5月20日</p> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="f-main-con"> |
||||
<div class="f-item f-item-2"> |
||||
<img src="images/news/focusing-3.jpg" alt=""> |
||||
<div class="f-list-cont"> |
||||
<h4>流动的秀美“壮锦”</h4> |
||||
<p>2020年5月18日</p> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="f-main-con"> |
||||
<div class="f-item f-item-3"> |
||||
<img src="images/news/focusing-4.jpg" alt=""> |
||||
<div class="f-list-cont"> |
||||
<h4>南国大地批“绿装”俯瞰田块成壮锦</h4> |
||||
<p>2020年5月18日</p> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- 信息咨询模块 --> |
||||
<div class="info"> |
||||
<div class="i-item i-item-1"> |
||||
<div class="i-item-date"> |
||||
<h3>05-20</h3> |
||||
<h4>2020年</h4> |
||||
</div> |
||||
<div class="i-item-main"> |
||||
<h5>桂云商城助力巴马养生食品销售</h5> |
||||
<p> |
||||
桂云商城与巴马富露施食品有限公司达成重要合作，桂云商城入股巴马富露施食品有限公司，共同组建电商平台销售团队，负责该公司巴马养生食品的线上、线下的推广及销售。 |
||||
</p> |
||||
</div> |
||||
</div> |
||||
<div class="i-item i-item-2"> |
||||
<div class="i-item-date"> |
||||
<h3>05-20</h3> |
||||
<h4>2020年</h4> |
||||
</div> |
||||
<div class="i-item-main"> |
||||
<h5>桂云商城助力巴马养生食品销售</h5> |
||||
<p> |
||||
桂云商城与巴马富露施食品有限公司达成重要合作，桂云商城入股巴马富露施食品有限公司，共同组建电商平台销售团队，负责该公司巴马养生食品的线上、线下的推广及销售。 |
||||
</p> |
||||
</div> |
||||
</div> |
||||
<div class="i-item i-item-3"> |
||||
<div class="i-item-date"> |
||||
<h3>05-20</h3> |
||||
<h4>2020年</h4> |
||||
</div> |
||||
<div class="i-item-main"> |
||||
<h5>桂云商城助力巴马养生食品销售</h5> |
||||
<p> |
||||
桂云商城与巴马富露施食品有限公司达成重要合作，桂云商城入股巴马富露施食品有限公司，共同组建电商平台销售团队，负责该公司巴马养生食品的线上、线下的推广及销售。 |
||||
</p> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- 页脚 --> |
||||
<div class="footer"> |
||||
<p>基地地址：中国 广西 南宁 广西机电职业技术学院</p> |
||||
<p>版权所有©2020年 桂云商城</p> |
||||
</div> |
||||
</div> |
||||
</body> |
||||
</html> |
||||
|
||||
|
Before Width: | Height: | Size: 148 KiB |
|
Before Width: | Height: | Size: 7.7 KiB |
|
Before Width: | Height: | Size: 8.1 KiB |
|
Before Width: | Height: | Size: 4.8 KiB |
|
Before Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 5.1 KiB |
|
Before Width: | Height: | Size: 175 KiB |
|
Before Width: | Height: | Size: 315 KiB |
|
Before Width: | Height: | Size: 107 KiB |
@ -1,14 +0,0 @@
@@ -1,14 +0,0 @@
|
||||
|
||||
手机、笔记本&平板...解决方案&服务华为商城&华为云 |
||||
|
||||
|
||||
个人用户 |
||||
手机，笔记本和平板等个人及家用产品 |
||||
|
||||
|
||||
企业用户 |
||||
企业商用产品、解决方案及云服务 |
||||
|
||||
|
||||
运营商用户 |
||||
手机，运营商网络解决方案、产品及服务 |
||||
@ -1,37 +0,0 @@
@@ -1,37 +0,0 @@
|
||||
<!DOCTYPE html> |
||||
<html> |
||||
<head> |
||||
<meta charset="utf-8"> |
||||
<title>box-sizing</title> |
||||
<style type="text/css"> |
||||
*{ |
||||
padding: 0; |
||||
margin: 0; |
||||
} |
||||
div{ |
||||
margin: 50px; |
||||
text-align: center; |
||||
color: #fff; |
||||
} |
||||
.box-1{ |
||||
background-color: skyblue; |
||||
border: 20px dashed blue; |
||||
width: 500px; |
||||
height: 100px; |
||||
padding: 50px; |
||||
} |
||||
.box-2{ |
||||
background-color: yellowgreen; |
||||
border: 20px dashed green; |
||||
box-sizing: border-box; |
||||
width: 500px; |
||||
height: 200px; |
||||
padding: 50px; |
||||
} |
||||
</style> |
||||
</head> |
||||
<body> |
||||
<div class="box-1">box-1</div> |
||||
<div class="box-2">box-2</div> |
||||
</body> |
||||
</html> |
||||
Binary file not shown.
|
Before Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 4.1 KiB |
|
Before Width: | Height: | Size: 245 KiB |
|
Before Width: | Height: | Size: 533 KiB |
|
Before Width: | Height: | Size: 262 KiB |
@ -1,24 +0,0 @@
@@ -1,24 +0,0 @@
|
||||
Lighthouse Island Bistro |
||||
the best coffee on the coast |
||||
Home |
||||
Menu |
||||
Directions |
||||
Contact |
||||
Lighthouse Island |
||||
Island Lighthouse, Built in 1870 |
||||
|
||||
Locally Roasted Free-Trade Coffee |
||||
Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold. |
||||
|
||||
Specialty Pastries |
||||
Enjoy a selection of our fresh-baked, organic pastries, including fresh-fruit muffins, scones, croissants, and cinammon rolls. |
||||
|
||||
Lunchtime is Anytime |
||||
Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. |
||||
|
||||
Panoramic View |
||||
Take in some scenery! |
||||
|
||||
The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower. |
||||
|
||||
Copyright ? 2017 |
||||
|
Before Width: | Height: | Size: 59 KiB |
|
Before Width: | Height: | Size: 55 KiB |
@ -1,567 +0,0 @@
@@ -1,567 +0,0 @@
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" |
||||
"http://www.w3.org/TR/html4/loose.dtd"> |
||||
<html> |
||||
<head> |
||||
<title></title> |
||||
<style type="text/css"> |
||||
/************************************************************************************ |
||||
RESET |
||||
*************************************************************************************/ |
||||
html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul, |
||||
dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object, |
||||
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span, |
||||
strong, sub, sup, tt, var, legend, fieldset { |
||||
margin: 0; |
||||
padding: 0; |
||||
} |
||||
|
||||
img, fieldset { |
||||
border: 0; |
||||
} |
||||
|
||||
/* set image max width to 100% */ |
||||
img { |
||||
max-width: 100%; |
||||
height: auto; |
||||
width: auto\9; /* ie8 */ |
||||
} |
||||
|
||||
/* set html5 elements to block */ |
||||
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { |
||||
display: block; |
||||
} |
||||
|
||||
/************************************************************************************ |
||||
GENERAL STYLING |
||||
*************************************************************************************/ |
||||
body { |
||||
background: #0d1424 url(images/body-bg.jpg) no-repeat center top; |
||||
font: .81em/150% Arial, Helvetica, sans-serif; |
||||
color: #666; |
||||
} |
||||
a { |
||||
color: #026acb; |
||||
text-decoration: none; |
||||
outline: none; |
||||
} |
||||
a:hover { |
||||
text-decoration: underline; |
||||
} |
||||
p { |
||||
margin: 0 0 1.2em; |
||||
padding: 0; |
||||
} |
||||
|
||||
/* list */ |
||||
ul, ol { |
||||
margin: 1em 0 1.4em 24px; |
||||
padding: 0; |
||||
line-height: 140%; |
||||
} |
||||
li { |
||||
margin: 0 0 .5em 0; |
||||
padding: 0; |
||||
} |
||||
|
||||
/* headings */ |
||||
h1, h2, h3, h4, h5, h6 { |
||||
line-height: 1.4em; |
||||
margin: 20px 0 .4em; |
||||
color: #000; |
||||
} |
||||
h1 { |
||||
font-size: 2em; |
||||
} |
||||
h2 { |
||||
font-size: 1.6em; |
||||
} |
||||
h3 { |
||||
font-size: 1.4em; |
||||
} |
||||
h4 { |
||||
font-size: 1.2em; |
||||
} |
||||
h5 { |
||||
font-size: 1.1em; |
||||
} |
||||
h6 { |
||||
font-size: 1em; |
||||
} |
||||
|
||||
/* reset webkit search input styles */ |
||||
input[type=search] { |
||||
-webkit-appearance: none; |
||||
outline: none; |
||||
} |
||||
input[type="search"]::-webkit-search-decoration, |
||||
input[type="search"]::-webkit-search-cancel-button { |
||||
display: none; |
||||
} |
||||
|
||||
/************************************************************************************ |
||||
STRUCTURE |
||||
*************************************************************************************/ |
||||
#pagewrap { |
||||
width: 980px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
/************************************************************************************ |
||||
HEADER |
||||
*************************************************************************************/ |
||||
#header { |
||||
position: relative; |
||||
height: 160px; |
||||
} |
||||
|
||||
/* site logo */ |
||||
#site-logo { |
||||
position: absolute; |
||||
top: 10px; |
||||
} |
||||
#site-logo a { |
||||
font: bold 30px/100% Arial, Helvetica, sans-serif; |
||||
color: #fff; |
||||
text-decoration: none; |
||||
} |
||||
|
||||
/* site description */ |
||||
#site-description { |
||||
font: italic 100%/130% "Times New Roman", Times, serif; |
||||
color: #fff; |
||||
position: absolute; |
||||
top: 55px; |
||||
} |
||||
|
||||
/* searchform */ |
||||
#searchform { |
||||
position: absolute; |
||||
right: 10px; |
||||
bottom: 6px; |
||||
z-index: 100; |
||||
width: 160px; |
||||
} |
||||
#searchform #s { |
||||
width: 140px; |
||||
float: right; |
||||
background: #fff; |
||||
border: none; |
||||
padding: 6px 10px; |
||||
/* border radius */ |
||||
-webkit-border-radius: 5px; |
||||
-moz-border-radius: 5px; |
||||
border-radius: 5px; |
||||
/* box shadow */ |
||||
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.2); |
||||
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.2); |
||||
box-shadow: inset 0 1px 2px rgba(0,0,0,.2); |
||||
/* transition */ |
||||
-webkit-transition: width .7s; |
||||
-moz-transition: width .7s; |
||||
transition: width .7s; |
||||
} |
||||
|
||||
/************************************************************************************ |
||||
MAIN NAVIGATION |
||||
*************************************************************************************/ |
||||
#main-nav { |
||||
width: 100%; |
||||
background: #ccc; |
||||
margin: 0; |
||||
padding: 0; |
||||
position: absolute; |
||||
left: 0; |
||||
bottom: 0; |
||||
z-index: 100; |
||||
/* gradient */ |
||||
background: #6a6a6a url(images/nav-bar-bg.png) repeat-x; |
||||
background: -webkit-gradient(linear, left top, left bottom, from(#b9b9b9), to(#6a6a6a)); |
||||
background: -moz-linear-gradient(top, #b9b9b9, #6a6a6a); |
||||
background: linear-gradient(-90deg, #b9b9b9, #6a6a6a); |
||||
/* rounded corner */ |
||||
-webkit-border-radius: 8px; |
||||
-moz-border-radius: 8px; |
||||
border-radius: 8px; |
||||
/* box shadow */ |
||||
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 1px rgba(0,0,0,.4); |
||||
-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 1px rgba(0,0,0,.4); |
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 1px rgba(0,0,0,.4); |
||||
} |
||||
#main-nav li { |
||||
margin: 0; |
||||
padding: 0; |
||||
list-style: none; |
||||
float: left; |
||||
position: relative; |
||||
} |
||||
#main-nav li:first-child { |
||||
margin-left: 10px; |
||||
} |
||||
#main-nav a { |
||||
line-height: 100%; |
||||
font-weight: bold; |
||||
color: #fff; |
||||
display: block; |
||||
padding: 14px 15px; |
||||
text-decoration: none; |
||||
text-shadow: 0 -1px 0 rgba(0,0,0,.5); |
||||
} |
||||
#main-nav a:hover { |
||||
color: #fff; |
||||
background: #474747; |
||||
/* gradient */ |
||||
background: -webkit-gradient(linear, left top, left bottom, from(#282828), to(#4f4f4f)); |
||||
background: -moz-linear-gradient(top, #282828, #4f4f4f); |
||||
background: linear-gradient(-90deg, #282828, #4f4f4f); |
||||
} |
||||
|
||||
/************************************************************************************ |
||||
CONTENT |
||||
*************************************************************************************/ |
||||
#content { |
||||
background: #fff; |
||||
margin: 30px 0 30px; |
||||
padding: 20px 35px; |
||||
width: 600px; |
||||
float: left; |
||||
/* rounded corner */ |
||||
-webkit-border-radius: 8px; |
||||
-moz-border-radius: 8px; |
||||
border-radius: 8px; |
||||
/* box shadow */ |
||||
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.4); |
||||
-moz-box-shadow: 0 1px 3px rgba(0,0,0,.4); |
||||
box-shadow: 0 1px 3px rgba(0,0,0,.4); |
||||
} |
||||
|
||||
/* post */ |
||||
.post { |
||||
margin-bottom: 40px; |
||||
} |
||||
.post-title { |
||||
margin: 0 0 5px; |
||||
padding: 0; |
||||
font: bold 26px/120% Arial, Helvetica, sans-serif; |
||||
} |
||||
.post-title a { |
||||
text-decoration: none; |
||||
color: #000; |
||||
} |
||||
.post-meta { |
||||
margin: 0 0 10px; |
||||
font-size: 90%; |
||||
} |
||||
|
||||
/* post image */ |
||||
.post-image { |
||||
margin: 0 0 15px; |
||||
} |
||||
|
||||
/************************************************************************************ |
||||
SIDEBAR |
||||
*************************************************************************************/ |
||||
#sidebar { |
||||
width: 280px; |
||||
float: right; |
||||
margin: 30px 0 30px; |
||||
} |
||||
.widget { |
||||
background: #fff; |
||||
margin: 0 0 30px; |
||||
padding: 10px 20px; |
||||
/* rounded corner */ |
||||
-webkit-border-radius: 8px; |
||||
-moz-border-radius: 8px; |
||||
border-radius: 8px; |
||||
/* box shadow */ |
||||
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.4); |
||||
-moz-box-shadow: 0 1px 3px rgba(0,0,0,.4); |
||||
box-shadow: 0 1px 3px rgba(0,0,0,.4); |
||||
} |
||||
.widgettitle { |
||||
margin: 0 0 5px; |
||||
padding: 0; |
||||
} |
||||
.widget ul { |
||||
margin: 0; |
||||
padding: 0; |
||||
} |
||||
.widget li { |
||||
margin: 0; |
||||
padding: 6px 0; |
||||
list-style: none; |
||||
clear: both; |
||||
border-top: solid 1px #eee; |
||||
} |
||||
|
||||
/* flickr widget */ |
||||
.widget .flickr_badge_image { |
||||
margin-top: 10px; |
||||
} |
||||
.widget .flickr_badge_image img { |
||||
width: 48px; |
||||
height: 48px; |
||||
margin-right: 12px; |
||||
margin-bottom: 12px; |
||||
float: left; |
||||
} |
||||
|
||||
/************************************************************************************ |
||||
FOOTER |
||||
*************************************************************************************/ |
||||
#footer { |
||||
clear: both; |
||||
color: #ccc; |
||||
font-size: 85%; |
||||
} |
||||
#footer a { |
||||
color: #fff; |
||||
} |
||||
|
||||
/************************************************************************************ |
||||
CLEARFIX |
||||
*************************************************************************************/ |
||||
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } |
||||
.clearfix { display: inline-block; } |
||||
.clearfix { display: block; zoom: 1; } |
||||
|
||||
|
||||
/************************************************************************************ |
||||
smaller than 980 |
||||
*************************************************************************************/ |
||||
@media screen and (max-width: 980px) { |
||||
|
||||
/* pagewrap */ |
||||
#pagewrap { |
||||
width: 95%; |
||||
} |
||||
|
||||
/* content */ |
||||
#content { |
||||
width: 60%; |
||||
padding: 3% 4%; |
||||
} |
||||
|
||||
/* sidebar */ |
||||
#sidebar { |
||||
width: 30%; |
||||
} |
||||
#sidebar .widget { |
||||
padding: 8% 7%; |
||||
margin-bottom: 10px; |
||||
} |
||||
|
||||
/* embedded videos */ |
||||
.video embed, |
||||
.video object, |
||||
.video iframe { |
||||
width: 100%; |
||||
height: auto; |
||||
min-height: 300px; |
||||
} |
||||
|
||||
} |
||||
|
||||
/************************************************************************************ |
||||
smaller than 650 |
||||
*************************************************************************************/ |
||||
@media screen and (max-width: 650px) { |
||||
|
||||
/* header */ |
||||
#header { |
||||
height: auto; |
||||
} |
||||
|
||||
/* search form */ |
||||
#searchform { |
||||
position: absolute; |
||||
top: 5px; |
||||
right: 0; |
||||
z-index: 100; |
||||
height: 40px; |
||||
} |
||||
#searchform #s { |
||||
width: 70px; |
||||
} |
||||
#searchform #s:focus { |
||||
width: 150px; |
||||
} |
||||
|
||||
/* main nav */ |
||||
#main-nav { |
||||
position: static; |
||||
} |
||||
|
||||
/* site logo */ |
||||
#site-logo { |
||||
margin: 15px 100px 5px 0; |
||||
position: static; |
||||
} |
||||
|
||||
/* site description */ |
||||
#site-description { |
||||
margin: 0 0 15px; |
||||
position: static; |
||||
} |
||||
|
||||
/* content */ |
||||
#content { |
||||
width: auto; |
||||
float: none; |
||||
margin: 20px 0; |
||||
} |
||||
|
||||
/* sidebar */ |
||||
#sidebar { |
||||
width: 100%; |
||||
margin: 0; |
||||
float: none; |
||||
} |
||||
#sidebar .widget { |
||||
padding: 3% 4%; |
||||
margin: 0 0 10px; |
||||
} |
||||
|
||||
/* embedded videos */ |
||||
.video embed, |
||||
.video object, |
||||
.video iframe { |
||||
min-height: 250px; |
||||
} |
||||
|
||||
} |
||||
|
||||
/************************************************************************************ |
||||
smaller than 560 |
||||
*************************************************************************************/ |
||||
@media screen and (max-width: 480px) { |
||||
|
||||
/* disable webkit text size adjust (for iPhone) */ |
||||
html { |
||||
-webkit-text-size-adjust: none; |
||||
} |
||||
|
||||
/* main nav */ |
||||
#main-nav a { |
||||
font-size: 90%; |
||||
padding: 10px 8px; |
||||
} |
||||
|
||||
} |
||||
|
||||
</style> |
||||
</head> |
||||
<body> |
||||
<body> |
||||
|
||||
<div id="pagewrap"> |
||||
|
||||
<header id="header"> |
||||
|
||||
<hgroup> |
||||
<h1 id="site-logo"><a href="#">Demo</a></h1> |
||||
|
||||
<h2 id="site-description">Site Description</h2> |
||||
</hgroup> |
||||
|
||||
<nav> |
||||
<ul id="main-nav" class="clearfix"> |
||||
<li><a href="#">Home</a></li> |
||||
<li><a href="#">Themify</a></li> |
||||
<li><a href="#">IconDock</a></li> |
||||
<li><a href="#">N.Design</a></li> |
||||
</ul> |
||||
<!-- /#main-nav --> |
||||
</nav> |
||||
|
||||
<form id="searchform"> |
||||
<input type="search" id="s" placeholder="Search"> |
||||
</form> |
||||
|
||||
</header> |
||||
<!-- /#header --> |
||||
|
||||
<div id="content"> |
||||
|
||||
<article class="post clearfix"> |
||||
|
||||
<header> |
||||
<h1 class="post-title"><a href="#">Just a Post Title</a></h1> |
||||
|
||||
<p class="post-meta"> |
||||
<time class="post-date" datetime="2011-05-08" pubdate>May 8, 2011</time> |
||||
<em>in</em> <a href="#">Category</a></p> |
||||
</header> |
||||
<figure class="post-image"> |
||||
<img src="images/sample-image.jpg"/> |
||||
</figure> |
||||
<p>Fusce ut sem est. In eu sagittis felis. In gravida arcu ut neque ornare vitae rutrum turpis vehicula. |
||||
Nunc ultrices sem mollis metus rutrum non malesuada metus fermentum. Vestibulum ante ipsum primis in |
||||
faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque interdum rutrum quam, a pharetra |
||||
est pulvinar ac. Vestibulum congue nisl magna. Ut vulputate odio id dui convallis in adipiscing libero |
||||
condimentum. Nunc et pharetra enim. Praesent pharetra, neque et luctus tempor, leo sapien faucibus leo, |
||||
a dignissim turpis ipsum sed libero. Sed sed luctus purus. Aliquam faucibus turpis at libero consectetur |
||||
euismod. Nam nunc lectus, congue non egestas quis, condimentum ut arcu. Nulla placerat, tortor non |
||||
egestas rutrum, mi turpis adipiscing dui, et mollis turpis tortor vel orci. Cras a fringilla nunc. |
||||
Suspendisse volutpat, eros congue scelerisque iaculis, magna odio sodales dui, vitae vulputate elit |
||||
metus ac arcu. Mauris consequat rhoncus dolor id sagittis. Cras tortor elit, aliquet quis tincidunt |
||||
eget, dignissim non tortor.</p> |
||||
|
||||
<h3>Vimeo Video</h3> |
||||
|
||||
<figure class="post-image"> |
||||
<img src="images/sample-image.jpg"/> |
||||
</figure> |
||||
<p>Fusce ut sem est. In eu sagittis felis. In gravida arcu ut neque ornare vitae rutrum turpis vehicula. |
||||
Nunc ultrices sem mollis metus rutrum non malesuada metus fermentum. Vestibulum ante ipsum primis in |
||||
faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque interdum rutrum quam, a pharetra |
||||
est pulvinar ac. Vestibulum congue nisl magna. Ut vulputate odio id dui convallis in adipiscing libero |
||||
condimentum. Nunc et pharetra enim. Praesent pharetra, neque et luctus tempor, leo sapien faucibus leo, |
||||
a dignissim turpis ipsum sed libero. Sed sed luctus purus. Aliquam faucibus turpis at libero consectetur |
||||
euismod. Nam nunc lectus, congue non egestas quis, condimentum ut arcu. Nulla placerat, tortor non |
||||
egestas rutrum, mi turpis adipiscing dui, et mollis turpis tortor vel orci. Cras a fringilla nunc. |
||||
Suspendisse volutpat, eros congue scelerisque iaculis, magna odio sodales dui, vitae vulputate elit |
||||
metus ac arcu. Mauris consequat rhoncus dolor id sagittis. Cras tortor elit, aliquet quis tincidunt |
||||
eget, dignissim non tortor.</p> |
||||
|
||||
|
||||
</article> |
||||
<!-- /.post --> |
||||
|
||||
</div> |
||||
<!-- /#content --> |
||||
|
||||
|
||||
<aside id="sidebar"> |
||||
|
||||
<section class="widget"> |
||||
<h4 class="widgettitle">Sidebar</h4> |
||||
<ul> |
||||
<li><a href="#">WordPress</a> (3)</li> |
||||
<li><a href="#">Design</a> (23)</li> |
||||
<li><a href="#">Design </a>(18)</li> |
||||
</ul> |
||||
</section> |
||||
<!-- /.widget --> |
||||
|
||||
<section class="widget clearfix"> |
||||
<h4 class="widgettitle">Flickr</h4> |
||||
<script type="text/javascript" |
||||
src="http://www.flickr.com/badge_code_v2.gne?count=8.&display=latest&size=s&layout=x&source=user&user=52839779@N02"></script> |
||||
</section> |
||||
<!-- /.widget --> |
||||
|
||||
</aside> |
||||
<!-- /#sidebar --> |
||||
|
||||
<footer id="footer"> |
||||
|
||||
<p>Tutorial by <a href="http://webdesignerwall.com">Web Designer Wall</a></p> |
||||
|
||||
</footer> |
||||
<!-- /#footer --> |
||||
|
||||
</div> |
||||
<!-- /#pagewrap --> |
||||
</body> |
||||
</html> |
||||
Loading…
Reference in new issue