Hatena Blog Tags
はてなブログ トップ
ＣＳＳ
このタグでブログを書く
言葉の解説
ネットで話題
関連ブログ

ＣＳＳ

このタグの解説についてこの解説文は、すでに終了したサービス「はてなキーワード」内で有志のユーザーが作成・編集した内容に基づいています。その正確性や網羅性をはてなが保証するものではありません。問題のある記述を発見した場合には、お問い合わせフォームよりご連絡ください。
数学、無料のオンライン学習塾•2年前

nth-childについてわかりやすく説明してみた　HTML,CSS復習20

この記事でわかること nth-childを使って行数によって設定を変える方法が絶対わかる みなさん、こんにちは。 今回は難しい言葉を使わずにnth-childを説明していきます。 行数によって色々設定を変えるには nth-child(); を使います。 簡単に言うと nth-child(1)で一番目 nth-child(2)で二番目 nth-child(3)で三番目ということです。 それだけのことです。 例えば p.nth-child(1);{text-align:center;} ならpタグの一番目が中央寄せになります。 また奇数、偶数行でわけることもできます。 奇数行の場合はnth-chi…

#HTMLタグ#ＣＳＳ#スタイルシート

ネットで話題

もっと見る
3621ブックマークWeb制作をこれから始める人の為のスキル・HTML・CSS・ブラウザ・写真素材入手の基礎情報*ホームページを作る人のネタ帳e0166.blog.fc2.com
2879ブックマークCSSでレイアウトするなら絶対覚えておきたい配置のルール：フロートや絶対配置、z-index とかいろいろ最近改めて CSS の基本、要素の配置、レイアウトについて学習しました。過去に CSS でのレイアウトなどの記事を書いた事があるんですけど、改めて勉強してみたら、いろいろ間違えて解釈していたなー ... っていうか、基本が分かってなかったんだなーと反省 ...。今回は CSS の基本中の基本、視覚整形モデルについてまと...webdesignrecipes.com
2872ブックマークJavaScriptで読み込むCSSファイルをまるっと[7korobi8oki.com]roundup-inc.co.jp
2830ブックマークCSSセレクタ20個のおさらいweboook.blog22.fc2.com
2317ブックマークもう、class名やid名で悩まないんだからっ！！｜CSS HappyLifecss-happylife.com
2277ブックマークCSSの知識をもっと深める30+2の小技テクニック集｜Webparkweboook.blog22.fc2.com
2171ブックマークHTML5+CSS3 入門yoppa.org
2106ブックマーク死ぬまでに見ておくべきCSSデザインサイト集まとめ - GIGAZINEgigazine.net
2103ブックマークCSSは分かるけど jQuery は苦手 … という人が jQuery に親しんでくれるといいなーと思って書きましたWebデザインをしていると、HTML と CSS だけではできない表現ってありますよね。そんな時によく使うのが jQuery。今回は jQuery っていまいちよく分からない ... っていう人が、jQuery に少しでも親しんでもらえたらいいなーと思って、知ってる事をまとめてみました。なので jQuery 初心者さん向けの記事です。 とっても...webdesignrecipes.com

関連ブログ

げんこつやま/頑固なグルメやオタク記事など、雑多な内容をオリキャラ茶番で好き勝手語るブログ•3年前

文字をＣＳＳで回転させまくってみる

どーもです。ホオズキとビワでお届け致します。 ＣＳＳのコードを使えば、ブログにも無限の表現の可能性と言うものを感じました ・ＣＳＳのコード ・閲覧環境について ・回転コード ・実践編 ・結び ＣＳＳのコードを使えば、ブログにも無限の表現の可能性と言うものを感じました ・ＣＳＳのコード キッカケは、我ながらあまりにもしょうもない思いつきやった・・・。ちょっとここだけは諸事情によりスクショを使わせて頂く。 は？なんだこりゃ？昨日の記事かこれは。これがどうかしたか？ アホか！己は分からんのか！これに込められた「工夫」がッ！！！ 工夫？ 「～」の文字が、縦書きなのが分からんのかァ！！！ そ、そう言えば…

#ＣＳＳ#文字回転
tn198403s 高校時代blog•3年前

tn48．ちょっとぼかしたいん駄文

私も読者になっているＬＳＳさんが、またまた面白そうなＣＳＳを紹介してくれました。これです。 little-strange.hatenablog.com あえてぼかしておきますが、知りたい人はボカシ部分にマウスカーソルをあわせてみてください。 字のぼやけたところにカーソルを持っていけば、字が鮮明になるというものです。これをぼやけた字の正体を推測し、答え合わせのつもりでカーソルを動かすという感じにすれば、ちょっとしたパズルとして遊べそうだと思い、作ってみました。 題して「ちょっとぼかしたいん駄文」。 ちょっとぼかしたいん駄文 問題１．ぼかし字文。 問題２．虫食い算 問題３．間違い探し あとがき 問…

#ぼかしたいん駄文#ＣＳＳ#パズル
隣の花の育てかた•4年前

カテゴリー別記事一覧のデザインをＴＯＰページのようにカスタマイズ【はてなブログPRO】

ＴＯＰページをカード型にしたからカテゴリー別記事一覧も同じようにさせたい！ だけどずっとＣＳＳのコードがわからず諦めかけていましたが、やっとコードを見つけました！！ なので備忘録として記事にしてみました カテゴリー別記事一覧をＴＯＰページのようにしたい方の参考になれば幸いです 他テーマで検証していないのでバックアップしてから追記してくださいね

#はてなブログ#カテゴリー別記事一覧#カスタマイズ#ナチュリ#ＣＳＳ
𝕂𝕌𝕄𝕆ℝ𝕀-𝔹𝕃𝕆𝔾'𝕊•4年前

もしもアフィリエイト簡単リンクにボカシで可愛くしました【備忘録】

お馴染みもしもアフィリエイトの簡単リンクをカスタマイズについての備忘録です。 コピペ専門の初心者なので、コピペさせて頂いております～( °∇^)］ ところで、はてなテーマは気がついたら増えているという感じですよね。 ちょこちょこテーマを変えて不具合などあり、悶えることが多いのですけど･･･ プロフィールに画像を入れると大きく反映されるものと小さく反映されるものがあったりとムムム･･･という感じです。 はてなテーマは、全体のカラーについてもCSSコピペでこちらのカラーにも！というように本当に助かります。 テーマを変えちゃったときに困るのが膨大なCSSですよね。 囲み枠ひとつでも結構な量です。 そ…

#簡単リンク#ＣＳＳ#カスタマイズ
隣の花の育てかた•5年前

【はてなブログPro】トップページをＰＣは「カード型」にスマホは「並列」にカスタマイズ！～ナチュリ～【コピペＯＫ！】

はてなPROになるとトップの記事一覧が全文形式ではなく一覧形式に変更することができます そこで！ PC表示…カード型 スマホ表示…アイキャッチと記事タイトルを並列 このようにカスタマイズしました 今回はトップページのカスタマイズ編！ 自分がどのコードを使っているのか把握するための備忘録でもあります 色やデザインの参考になれば幸いです 必ず事前にバックアップをしてから追加しましょう！

#はてなブログ#カスタマイズ#トップページのカスタマイズ#ＣＳＳ#はてなブログＰｒｏ
ENGINEERING BLOG ドコモ開発者ブログ•4時間前

Google Analytics 4をStreamlitに導入してグロースできる環境を実現してみた

自己紹介 NTTドコモ データプラットフォーム部（以下DP部）藤平です。 システムやアプリケーションはリリースしたら終わりではなく、利用者の声や利用状況に合わせたUIの改善など日々成長させていく必要があります。 DP部が提供するデータアプリケーションプラットフォームではStreamlitで約100アプリを提供していますが、各々のアプリを成長させるために利用状況を分析できる環境が必要でした。 そこで、ドコモで10年以上Google Analytics/Google Tag Managerに携わっていただいている、協力会社の大畑さんに実装をお願いしました。 以下、大畑さんに本取り組みの内容をご紹介…

WEBサイト制作の勉強•4時間前

11月28日の作業データ

index.html <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Felica Bread&Salad</title> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" cross…

エキサイト TechBlog.•5時間前

Tailwind CSSで兄弟要素の状態を評価する方法

こんにちは。エキサイトでデザイナーをしている齋藤です。 エキサイトホールディングス Advent Calendar 2024 シリーズ2の5日目を担当します。 qiita.com 今回は、Tailwind CSSで兄弟要素の状態を評価してスタイリングする方法をご紹介します。 兄弟要素の状態を評価したい場面 Tailwind CSSで兄弟要素の状態を評価する方法 完成形 さいごに 兄弟要素の状態を評価したい場面 冒頭、兄弟要素の状態を評価したい場面の例をお示しします。 よくある例として、ホバーすると出現するTooltip（ツールチップ）が挙げられます。 以下はマークアップの一例です。 <div>…

みかづきブログ・カスタム•5時間前

dnd-kitを使ってドラッグ&ドロップで並び替え可能なリストを実装する ✊

docs.dndkit.comNext.jsとdnd-kitを組み合わせてドラッグ＆ドロップで並び替え可能なリストを実装しました。 DEMO https://develop.kimizuka.org/dnd-kit-sortable/ ソースコード package.json { "name": "dnd-kit-sortable", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev --turbopack", "build": "next build", "start": "next start" }, "de…

インフラジスティックス・ジャパン株式会社Blog•12時間前

Ignite UI for Angular 18.2 リリースノート

インフラジスティックス・ジャパン株式会社、ローカライゼーションのルミです。Ignite UI for Angular 18.2 リリースいたしました。本リリースでは、様々な新機能と重大な変更が含まれておりますので是非ご期待ください。詳細は以下をご覧ください。 Typedoc と Sass の API サイトで表示するバージョンを選択いただけますが、製品リリースから同バージョンの API ご提供までには通常数日いただいております。また前バージョンリリース以降に API の追加/変更がない場合、最新バージョンはドロップダウンに追加されない場合があることにご注意ください。

himanago•13時間前

GitHub の機能だけで LINE ミニアプリを作ってみる！

はじめに 本記事は LINEDC Advent Calendar 2024 の 4 日目の記事です。 ここだけあいてたので、急遽書きました…！ LINE ミニアプリとは LINE アプリ内で動作させることのできるミニアプリで、実体は LIFF（LINE Front-end Framework）を使って作られる Web アプリケーションです。 これまで審査・認証を経なければ公開できなかったのですが、機能制限はあるものの未認証で公開できるようになり、気軽に試したり個人開発して個人的に使ったりということがしやすくなりました。 GitHub の機能だけで作ってみよう ということで、できるだけ気軽に開発…

PLEX Product Team Blog•16時間前

【Next.js】Next/Imageの画像プレビューにて発生したメモリリークを追う

この記事は、 PLEX Advent Calendar 2024の4日目の記事です。 こんにちは 株式会社プレックスでWebアプリケーションの開発をしているtetty0217 です。 はじめに 画像データを取り扱うフォームにおいて、入力した画像をプレビューで表示する機能が付属していることは珍しくないでしょう。 今日はそんなプレビュー機能の画像描画をnext/imageで無秩序に実装すると発生するクラッシュについて、Safariブラウザを題材として「なぜメモリリークが原因だったのか」「ブラウザでは何が起きていたのか？」という点をブラウザのレイヤー（Safari Web Inspector）とネイ…

mikotohodo-三言ほど-•16時間前

Blogへの情熱はシンプルに向かう

すごく久しぶりに記事を書くを実行している訳ですが、HatenaBlogって面白いなと実感。前に使っていた時も面白かったけど、今回はまた別の意味。 何故久しぶりなのかと言うと、WordPressで運営しているBlogがあるから。 数年ぶりに設定の中身を覗き、今回はシンプルに運営をしていこうとCSSを全削除。と言うか、本当に全削除。 以前活動していた時に、コミュニケーションをとってくれた方には大変感謝しています。感謝しつつの全削除。 テーマも再設定。後はアナリティクスあたりのコードを入れ替えるくらい。 ここで早々と冒頭、HatenaBlogって面白いなに戻る。どうしてそう思ったかは「画像も消してな…

ベリーのメモ帳•18時間前

読者を惹きつける！ブログデザインと画像選びのポイント

読者にとって魅力的なブログを作るには、デザインと画像選びが重要なポイントです。ブログの見た目が洗練されていれば、訪問者は記事に対して興味を持ちやすくなり、滞在時間も自然と長くなります。また、適切な画像は記事内容の理解を助け、ブログ全体の印象を向上させる役割を果たします。 この記事では、読者を惹きつけるブログデザインと画像選びのコツを詳しく解説します。初心者でも実践しやすい具体例を交えながら、成功するブログ作りの秘訣を学びましょう。 rakuten_design="slide";rakuten_affiliateId="10bf2366.070baf34.10bf2367.f915499a";r…

二児ママのリスタート日記•1日前

EX_01_学習時間をどこで確保するか

こんにちは！今回は、模写コーディングやスキルアップに必要な「学習時間」をどうやって確保するかについて書いていきます。小さい子供がいると、まとまった時間を取るのが難しいのが現実。私も日々工夫をしながら取り組んでいますが、特に夜は英語学習の時間にあてているので、コーディングはそれ以外の隙間時間を活用しています。 1日のスケジュールを整理してみる まずは、私の1日のおおまかなスケジュールを円グラフで可視化してみました： 何も予定のない平日のスケジュール 6:30〜9:00 朝の時間起床後、朝食準備、子供たちの着替え、洗濯をします。特に朝食には時間がかかり、子供がなかなか着替えないため、この時間帯は忙…

kubell Creator's Note•1日前

フロントエンドのビルドをRspackで気軽に高速化した話

フロントエンド開発部の須田です。 この記事は kubell Advent Calendar 2024 (シリーズ1) 12月4日の記事です。 前日はこちらの2本でした。 creators-note.chatwork.com creators-note.chatwork.com AWS Amplify を使った爆速開発も楽しそうですし、ゴリゴリとパーサーコンビネーターを書くのも楽しそうですね！年末年始は寝てられません。 さて、僕が所属する kubell のフロントエンド開発部では、他のチームが Chatwork のフロントエンドを開発する際に予期される障害や無駄を取り除く、いわばフロントエンド限…

はてなニュース•1日前

新規プロダクト開発では新しい技術をどう採用するのか？ カオナビでの運用経験をリスクヘッジに生かし挑戦を成功に導く！〔ヨジツティクス開発者インタビュー〕

株式会社カオナビでは、社員の個性や才能を発掘するタレントマネジメントシステム「カオナビ」を主力プロダクトとして、HR領域の機能開発に2012年から注力しています。 そして2024年4月、隣接する経営管理領域のSaaS「ヨジツティクス」を独自に開発してリリースしたことで、マルチプロダクト戦略にかじを切りました。 現在の開発組織で新規プロダクトの経験がない中、どのようなことに気を使いながら開発を進めたのでしょう。プロダクトオーナーを務める福田健（ふくだ・けん）さんと、フロントエンドでの技術選定などをリードした別城慎治（べっき・しんじ）さんに話を伺いました。 ※この記事は株式会社カオナビによるタイア…

コハム•1日前

【使うのが待ち遠しい！】attr()関数で style を自在に操る超絶テクニック

A more powerful CSS attr() function 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 attr()関数は、HTML属性の値を読み取り、それをCSSで使用できるようにする関数です。マークアップで定義された値をスタイルシート内で使用できます。attr()関数は最も一般的にdata-属性と共に使用されますが、任意のHTML属性にアクセスできます。現在、attr()関数の使用はcontentプロパティに限定されており、::before、::after、::markerで使用でき、文字列値のみに制限されています。 <u…

エス・エム・エス エンジニア テックブログ•1日前

保育士人材バンクの技術基盤改善 2024

この記事は株式会社エス・エム・エス Advent Calendar 2024の12月4日の記事です。 qiita.com 保育士人材バンク のサービスを担当しておりますエンジニアの田実と申します。 保育士人材バンクは保育業界で働く方と事業所のための就職・転職マッチングサービスです。 本記事では2024年の保育人材バンクの技術基盤改善の取り組みを振り返っていきます！ コンテナ化 今年一番大きかった基盤改善は何と言ってもコンテナ化です！コンテナ化前はEC2上にアプリケーションがホスティングされており、デプロイはrsync、ログはSSHでサーバーに入って直接ログファイルを確認、といった運用を行ってい…