Reference (Wiki³)

ページ名：102-Create web site


Information

■

Web tools

CodePrettyprintSYNCER
GeneratorHeaderFont-Generator.com
Font familyPlainStyle

■

HeaderCSS
+ Sample-
div#site_header h1 a {
  width: 100%;
  height: 100%;
  background-image: url(https://■);
  background-size: cover;
  padding-top: ■%;
  display: block;
  color: transparent;
  overflow: hidden;
}

div#site_header h1 a:hover {
  color: transparent;
}
Fluid layoutCSS
+ Sample-
/* fluid width */

body>div.uk-container.uk-container-center {
  width: auto;
}

body>div.uk-container.uk-container-center>div.uk-grid>div[class*=uk-width-].sidebar.left_side {
  width: 210px;
}

body>div.uk-container.uk-container-center>div.uk-grid>div[class*=uk-width-].sidebar.left_side+.main_content {
  width: calc(100% - 450px);
}

body>div.uk-container.uk-container-center>div.uk-grid>div[class*=uk-width-].sidebar.right_side {
  width: 210px;
}
Font familyCSS
+ Sample-
body, html {
  font-family: "Constantia", "Yu Mincho";
}
Font sizeCSS
+ Sample-
@media screen and (min-width: 721px) {
  html {
    font-size: 75%;
  }
}

@media screen and (max-width: 720px) {
  html {
    font-size: 62.5%;
  }
}


/*font-size : 12px と同等*/

body {
  font-size: 1.2rem;
}


/* font-size: 20px と同等 */

h1 {
  font-size: 2.0rem;
  font-family: "Constantia", "Yu Mincho";
}


/* font-size: 18px と同等 */

h2 {
  font-size: 1.8rem;
  font-family: "Constantia", "Yu Mincho";
}


/* font-size: 16px と同等 */

h3 {
  font-size: 1.6rem;
  font-family: "Constantia", "Yu Mincho";
}
FrameNew
+ Sample-
&image(100-No_image_available.gif,width=100%)
[[Service top>■]]
 
**Information
,BGCOLOR(#000000):■&br()■
 
**■
***■
,==,,
,~,,
 
**Information retrieval
[[■>■]]
IndexPlug-in
+ Sample-
#list_by_tagsearch(■,layer_nn,search_type=and,sort=id)
Media playerCSS
+ Sample-
.youtube-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}

.youtube-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
Featured image
+ Sample-
<div class="youtube-container">
&u2b(https://www.youtube.com/watch?v=■?autoplay=1)
</div>
■
[Epic film / Promotion Video / Commercial film / How-to / ■] ■
&image(■,width=1)
csv
+ Sample-
"&u2b(https://www.youtube.com/watch?v=■){200,112}"
ImageFeatured image
+ Sample-
&image(ppp-Featured_image.png / jpg,width=100%)
csv
+ Sample-
"&lightbox(ppp-src_nn.png / jpg,link=image,width=200 / 150 / 84 / 63)"
Google MapsFeatured image
csv
Toggle - slideMenu
+ Sample-
#region(■)
*[[■>ppp-■]]
[[■>ppp-■]]
#endregion
csv
+ Sample-
"&region(Sample)■"
LinkText
+ Sample-
[[■>ppp-■]]

[[Official website / Data website / Guide>https://■]]
[[Sample / Capture>https://■]]
[[Windows OS / 10>https://■]]
[[Web tools / Download>https://■]]
[[Twitter>https://■]]
Anchor
ref
+ Sample-
#ref(inline,ppp-■.png / jpg,https://■)

Information retrieval

■

シェアボタン： このページをSNSに投稿するのに便利です。

最近更新されたページ

Form

Information■■店舗名仮払金Suspense paymentsタンス預金Cash stashATMJapan PostMUFG BankThe Bank of NagoyaSeven Ban...

2024-07-12 16:29:25

Shade

Information用土 赤玉土 小粒 : 6腐葉土 : 3ピートモス : 1ListVitis labrusca 'Delaware'▶ Data websiteOsmanthus heterop...

2024-01-02 09:31:28

Tetrapoda

Information■Felis silvestris catus 'Michelangelo'2012.05.13Title：はあまじはあ2012.12.29Title：遅めのXmas prese...

2024-01-02 09:02:15

Water

Information用土 Red ball soil 小粒 : 7Leaf mold : 3用土 Red ball soil 小粒 : 6Leaf mold : 3Peat moss : 1List...

2023-09-15 20:06:52

Jane Doe

TANITA BF-047-WHInformationDay ･ Human body weight ･ Body fat percentage ･ Body mass index202y.mm.dd...

2023-08-01 12:07:36

John Doe

TANITA BC-753-WHInformationDay ･ Human body weight ･ Body fat percentage ･ Body mass index202y.mm.dd...

2023-08-01 12:00:45

Eyeglasses

MEGANE ICHIBA[Commercial film] ZEROGRA篇Information-繊細を纏う-CustomizeSilicone modernNo.0756-27Nishimura...

2022-12-15 07:25:43

Container

Information用土 Red ball soil 小粒 : 6Leaf mold : 4ListActinotus helianthi 'Fairy White'Kalanchoe behare...

2022-08-24 18:47:51