
html+css
-
2021/01/06 / html+css
youtube画像埋め込みのレスポンシブ
youtube 画像の埋め込みレスポンシブ HTML iframeはyoutubeの 共有→埋め込み のタグ <div class="youtubefr"> <ifram ●●●●●●●></iframe> <...
続きを読む
-
2020/05/26 / html+css
webフォントを使う
「webfonts」ディレクトリ(名前は任意)に使いたいfontを入れる。 KozGoPro-Bold.otf など、この例では6件 cssファイルに下記を記載。urlパスは自分が設置したところを呼び出す。 @font-face {...
続きを読む
-
2020/03/02 / html+css
1枚にcssもjsも書くhtmlの基本
css、js枠を含むhtml 動作テストに使用 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8" /> <met...
続きを読む
-
2019/12/25 / html+css
Pリンクボタン中央寄せ
HTML <div class="pafelinkbk"><p><a href="/official/price/">お問い合わせ</a></p><p><a href="/official/...
続きを読む
-
2019/12/12 / html+css
HTMLの複数行を左揃え中央寄せする
HTML <div> <p> テキストテキストテキスト<br/> テキスト<br/> テキストテキストテキスト </p> </div...
続きを読む
-
2019/11/22 / html+css
::before ::after【css】
CSS3から::before の表記法(二重コロン)が導入されました。 h2::before {content:"» ";} h2::before {content:"『";} h2::after {content:"』";} ...
続きを読む
-
2019/11/21 / html+css
dl,dt,dd・シンプルにコピペ
dlはdt要素(用語)・dd要素(その用語に対する説明)をともなう記述型リスト <dl> <dt>用語</dt> <dd>説明</dd> <dt>用語</dt> <dd>説明</...
続きを読む
-
2019/11/19 / html+css
テーブルhtml・シンプルにコピペ
上に th が並ぶシンプルテーブルHTML <table> <tbody> <tr> <th></th> <th></th> </tr> <tr> <td></td>...
続きを読む
-
2019/11/09 / html+css
HTML付き都道府県リスト・ヘボン式ローマ字リスト
<ul id=""> <li><a href="/area/hokkaido/">北海道</a></li> <li><a href="/area/aomori/">青森県</...
続きを読む
-
2019/01/19 / html+css
マウスオーバーで画像を大きくする
HTML <span><img src="" alt="" /></span> CSS span { display:block; overflow: hidden; } span img { ...
続きを読む
-
2019/01/18 / html+css
divやpタグを文字幅に合わせて縮める
あいうえお div { display: inline-block; } あいうえお 2行目以降インデント p { padding-left:1em; text-indent:-1em; }...
続きを読む
HOME > html+css
html+css
- 【css】テキストを左に揃えて全体を中央よせ
- 【CSS】テキスト2行目以降を字下げ(インデント)
- レスポンシブで画像を正方形に維持する
- before・afterをcssで画像にする
- ハンバーガーメニュー・左から出て右へ消える
- WEBサイトが開いたときにムービーが動いている
- headerを固定した時のページ内リンク。Chrome、Firefox、Safari対応
- 都道府県一覧
- 画像の縦横比を固定してレスポンシブHTML+CSS
- css flexで内側要素を文字数に応じて比例した幅にする
- table内の文字の折り返しが効かない時white-space: normal
- flex基本
- cssでdiv等の要素を正方形に固定(レスポンシブ)
- head内のレスポンシブ分岐(metaタグなど)
- iframe縦横比固定・div正方形維持(レスポンシブ)/画像正方形固定
- スクロールすると上から降りてくる
- フッターを下に固定|コンテンツが少ない時
- favicon
- css gridの中のdivの中のdivの高さを合わせる
- 文字列の下半分にマーカーを引く
- webフォントを使う
- 1枚にcssもjsも書くhtmlの基本
- Pリンクボタン中央寄せ
- HTMLの複数行を左揃え中央寄せする
- ::before ::after【css】
- dl,dt,dd・シンプルにコピペ
- テーブルhtml・シンプルにコピペ
- HTML付き都道府県リスト・ヘボン式ローマ字リスト
- マウスオーバーで画像を大きくする
- divやpタグを文字幅に合わせて縮める