自己紹介

Information

回答方法

質問一覧

Q.質問内容
Q.質問内容

Q.質問内容
Q.質問内容

Q.質問内容
Q.質問内容

回答一覧

以下、コピペ用

↓HEAD編集にコピペしてね↓
<style type="text/css"> @import url('https://fonts.googleapis.com/css2?family=Quicksand&family=Sawarabi+Gothic&display=swap'); @font-face { font-family:"ロゴたいぷゴシック-コンデンスド" ; src: url('https://cdn.leafscape.be/LogoTypeGothicCondense/07LogoTypeGothic-Condense_web.woff2') format("woff2"); } *,::after,::before{box-sizing:border-box} *{margin: 0; padding: 0;} ol,ul{list-style:none} img{max-width:100%} table{border-collapse:collapse} textarea{white-space:revert} :root{ --main-color: #d3d3d3; /* アクセントカラー：天宮 */ } body{ font-family: 'Quicksand','Sawarabi Gothic', sans-serif; font-size:0.85em; line-height:2em; margin: 0; padding: 0; background: radial-gradient(circle, transparent 20%, var(--main-color) 20%, var(--main-color) 80%, transparent 80%, transparent), radial-gradient(circle, transparent 20%, var(--main-color) 20%, var(--main-color) 80%, transparent 80%, transparent) 50px 50px, linear-gradient(rgba(255, 255, 255, 0.5)8px, transparent 8px) 0 -4px, linear-gradient(90deg, rgba(255, 255, 255, 0.5) 8px, transparent 8px) -4px 0; background-color: var(--main-color); background-size:100px 100px, 100px 100px, 50px 50px, 50px 50px; background-repeat: repeat; } a{ text-decoration:none; color: #999; } .wrp{ background: #fff; width: 90%; max-width: 600px; margin: -100px auto 10px; padding: 50px 10px 10px; } header{ background: #fff; font-size:1.2em; text-align: center ; margin: 50px auto 0; width: 200px; height: 200px; border-radius: 50%; } .top{ margin-top: 50px;} hr { height: 8px; border: none; border-top: dashed 2px #000; margin:30px auto; } h1{ font-family:"ロゴたいぷゴシック-コンデンスド" ; font-size:1.5em; color: #000; text-shadow: 1px 1px 0px #fff, -1px 1px 0px #fff, 1px -1px 0px #fff, -1px -1px 0px #fff, 4px 4px 0px var(--main-color); } header a { background: var(--main-color); color: #000; box-shadow: 0px 0px 0px 3px var(--main-color); border: dashed 1px #fff; margin: 10px; padding: 0.2em 0.5em; width: 100px; } h3{ font-family:"ロゴたいぷゴシック-コンデンスド" ; font-size:1.2em; border-bottom: dotted 3px var(--main-color); font-weight: 400; } .icon{ width: 100px; } .waku{ width:90%; margin: 20px auto 30px; } .text{ margin: 0 15px 20px; padding-right: 0.5em; padding-left: 0.5em; line-height: 2em; background-color: #fff; background-image: linear-gradient(90deg, rgba(237, 119, 128, 0) 0%, rgba(237, 119, 128, 0) 50%, #fff 0%, #fff 100%), linear-gradient(180deg, rgba(100, 100, 100, 0) 0%, rgba(100, 100, 100, 0) 97.5%, #646464 100%); background-size: 8px 100%,100% 2em; } p{ margin: 0 15px 20px; } .right{ text-align: right; font-size: 0.7em; } footer{ text-align: center ; margin: 50px auto 20px; } textarea{ font-family: 'Quicksand','Sawarabi Gothic', sans-serif; width: 90%; border: solid 2px var(--main-color); } </style>

↓ページ編集にコピペしてね↓
<header> <div class="top"> <h1>自己紹介</h1> <img src="＃レースの画像＃" class="icon"> </div> </header> <div class="wrp"> <h3>Information</h3> <div class="text">いつもはなまる荘を盛り上げてくださりありがとうございます。<br> この度、お互いのことを知るための「自己紹介イベント」を常時開催とすることにしました。<br> これも交流のきっかけとしてもらえたら嬉しいです。</div> <h3>回答方法</h3> <div class="text">下記質問ページから回答したい質問をコピーし、回答とともにDMを送ってください。</div> <h3>質問一覧</h3> <p>Q.質問内容<br> <textarea rows="2" onfocus="this.select();">Q.質問内容</textarea></p> <p>Q.質問内容<br> <textarea rows="2" onfocus="this.select();">Q.質問内容</textarea></p> <p>Q.質問内容<br> <textarea rows="2" onfocus="this.select();">Q.質問内容</textarea></p> <h3>回答一覧</h3> <div class="waku"> <a href="あどれす">天宮夏生</a><br> <a href="あどれす">吾妻晴臣</a><br> <a href="あどれす">みょうじなまえ</a><br> <a href="あどれす">みょうじなまえ</a><br> </div>