style-cssの一覧

作成日: 2021/08/31 更新日: 2023/03/25 サイトの紹介と使い方

初めに

①CSSは今のところ分類していません。
②もっと数が増えたら分類を考えます。

CSSの項目

0101:パン屑リスト
0102:Menuで使うカテゴリのリスト
0103:Menuで使うカテゴリの大分類
0104:親と子カテゴリの記事一覧
0105:コード ブロック
0106:画像 ブロック
0107:サイト内検索

全てのコード

@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}

/*<--- 0101 */
my-bread-crumb{
  padding:		0rem;
  margin:		0rem;
}

.my-bread-crumb li{
  display:              inline;
  list-style:           none;
  font-size:            1.5rem;
  font-weight:          bold;
}

.my-bread-crumb li:after{
  content:              ">";
  padding:     		0.3rem;
}

.my-bread-crumb li:     last-child:after{
  content:              "";
}

.my-bread-crumb li a {
  text-decoration: none;
  color:                #52b5ee;
}

.my-bread-crumb li a:hover {
  text-decoration:      underline;
}
/* 0101 --->*/

/*<--- 0102 */
.my-menu-list li{
  display:              inline;
  list-style:           square-button;
  border-style:		solid;
  border-radius:	1rem;
  font-size:            1.5rem;
  font-weight:          bold;
  padding:		0.3rem;
}

.my-menu-list li a {
  text-decoration:      none;
}

.my-menu-list li a:hover {
  text-decoration:      underline;
}
/* 0102 --->*/

/*<--- 0103 */

.my-menu-list-top [h-title]::before {
  content:		attr(h-title);
  font-size:            1.5rem;
}

.my-menu-list-top li{
  display:              inline;
  list-style:           square-button;
  border-style:		solid;
  border-radius:	1rem;
  font-size:            1.5rem;
  font-weight:          bold;
  padding:		0.3rem;
}

.my-menu-list-top li a {
  text-decoration: none;
}

.my-menu-list-top li a:hover {
  text-decoration: underline;
}
/* 0103 --->*/

/*<--- 0104 */
my-link-list{
  padding:              0rem;
  margin:               0rem;
}

.my-link-list li{
  display:              block;
  list-style:           none;
  font-size:            1.5rem;
  font-weight:          bold;
  padding:		0.3rem;
}

.my-link-list li a {
  text-decoration: none;
}

.my-link-list li a:hover {
  text-decoration: underline;
}
/* 0104--->*/

/*<--- 0105 */
.my_code_block{
  border:		3px solid #006400;
  padding:		1rem;
}
/* 0105 --->*/

/*<--- 0106 */
.my_img_block{
  border:		2px solid #000000;
  padding:		1rem;
}
/* 0106 --->*/

/*<--- 0107 */
.my-search-box{
  position:		absolute;
  top:			0rem;
  left:			4.4rem;
  height:		2rem;
}
input[type="text"]{
  width: 20em;
}
.my-search-btn{
  position:		absolute;
  top:			0rem;
  left:			0rem;
  height:		2rem;
  width:		4rem;
  font-size:		1rem;
  line-height:		2rem;
  color:			#fff;
  background-color:	black;
  border-radius:	0.2rem;
}
/* 0107 --->*/

お問合せ・御要望

お問合せ
Verified by MonsterInsights
タイトルとURLをコピーしました