CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

RSS

  • 解決済

    回答
    2

    progate html での横並びの位置不具合

    前提・実現したいこと progateの実践問題で正解にならないので質問です。 html下部のコース一覧のところで .course-itemのクラス3つをinline-blockで横並びにしているのですが、 cssの #course-item-list で 'width:100%;' のセミコロンを外した状態で正しい位置に来ているようです。 ただ 'width

    • 0評価
    • 367PV
    yoshinavi yoshinavi 1時間前に ベストアンサー
  • 解決済

    回答
    2

    <HTML・CSS>ボタンの押下可能範囲について

    input type="submit" の要素に対して、backgroundimageを指定したボタンを作成しています。 さらに、ページがレスポンシブなので、 参考リンク ←の通りにボタンを実装しました。 すると、押下した時点で このようになってしまいます。 もちろん、ボタンの下の、「ボタン外かつ枠内」の領域も押下可能です。 background-

    • 0評価
    • 56PV
    x_x x_x 9時間前に ベストアンサー
  • 受付中

    回答
    0

    iOS Safari で Position:sticky(-webkit-sticky) をぶれない...

    上下左右にスクロールできるサイトを作成しています。 コードサンプル 上記のコードサンプルをiPhoneのSafariでテストすると、左右にスクロールした際に左の時間表示部分がぶれてしまいます。 ググっていろいろと試してみたものの、スクロールできなくなったり、期待する動作にならなかったり、解決には至りませんでした。 これをぶれないようにさせるにはどのように

    • 0評価
    • 310PV
    teratailが1日前に アップデート
  • 解決済

    回答
    2

    CSSでのプロパティ指定方法について。

    実現したいこと 下記 html で記述された部分をCSSで操作したい。 <span style class>1</span> <span style class>2</span> <span style class>3</span> たとえば <div id="hoge">1</div> <div class="fuga">1</div>

    • 0評価
    • 60PV
    EzrealTrueshot EzrealTrueshot 1日前に ベストアンサー
  • 解決済

    回答
    3

    CSSやJSで画像の四隅に三角を付ける方法

    お世話になっております。 添付ように画像の左上に三角マークをつけたいく、下記のソースコードのようにしたんですが、 三角の色を指定しないほうで可能でしょうか? 現在は赤になっておりますが、 実際は本当にトリミングされたように背景色に合わせたいです。 ※添付イメージ ※ソースコード <style> body { pa

    • 0評価
    • 94PV
    JJ878 JJ878 2日前に 回答
  • 解決済

    回答
    3

    マーカーみたいな線をcssで書きたいです

    前提・実現したいこと cssで書いたマーカーのような線を自由に動かいしたいです。 現状は下の図のようになっているのですが 実際には、下の図のように先を少し下に下げたいです。 <h4>精度が高いシュミレーションが可能な理由</h4> h4 { width: 520px; margin-left: 41px; padding-to

    • 0評価
    • 369PV
    ryuji000 ryuji000 2日前に ベストアンサー
  • 解決済

    回答
    2

    レスポンシブな段組みで右端のアイコンだけ固定したい

    とあるテーブルをいくつかのブロックに分けて、横幅にゆとりがある場合段組みになるようにしたいのですが、テーブルの右横に設置したアイコンが段組みが変わってもついてくるようにしたいです。 …と文字で書いてもわかりにくいですね。 このようにTableAとTableBはレスポンシブに段組みをかえつつ、iconはTableAとTableBを一塊とした右肩に

    • 0評価
    • 349PV
    Marbow Marbow 2日前に ベストアンサー
  • 解決済

    回答
    1

    velocity.jsの使い方 -easing機能を使うには-

    前提・実現したいこと velocity.jsを使用して、アニメーションの設定を行っております。 clickと同時にイベントが発動する仕組みを作りました。 下記にソースを記述します。 <script src="//code.jquery.com/jquery-1.11.2.min.js"></script> <script src="//cdn.jsdel

    • 0評価
    • 309PV
    ho_ri ho_ri 2日前に 回答を編集
  • 解決済

    回答
    3

    css グリッドレイアウト(display: grid;)をIE10/IE11でも対応させるためには...

    前提・実現したいこと cssグリッドレイアウト構造を利用して下記画像のデザインを作成したいです。 ●対応したいブラウザ chorome,firefox,safari,Edge,IE11 cssグリッドレイアウトを下記の記事を参考に設置してみました。 CSS Grid Layout を極める!(場面別編) can I useの情報によればchorom

    • 0評価
    • 407PV
    ho_ri ho_ri 3日前に ベストアンサー
  • 解決済

    回答
    1

    slideToggleのeasingをswing以外に設定したい(velocity.jsを使って)

    前提・実現したいこと jQueryのslideToggle機能を使用して、スマホのメニューを作成しました。 ごくごく一般的なスマホのメニュー設定のソースを下記に記します。 <div id="menu"> <a class="menu-trigger" href="#"> <span></span> <span></

    • 0評価
    • 42PV
    ho_ri ho_ri 3日前に ベストアンサー
  • 解決済

    回答
    2

    main,aside,header,articleタグの使い方について

    最近、マトモなWebページを作る必要が出てきて、それにともなって知識程度のHTMLをもう少しマトモに使えるようにしようと思い、勉強中なのですが、main、aside、articleタグについて少々疑問に思うことがあります。 mainタグやasideタグ、articleタグについてググるとそれぞれ、記事内のメインコンテンツを括る、サイドバーを括る、記事本文

    • 0評価
    • 82PV
    elda elda 3日前に コメント
  • 解決済

    回答
    3

    特定の位置だけhoverがかりません

    前提・実現したいこと 全ての画像にhoverをかけて、テキストと画像を表示したいのですが、<div class="mainitem--3>と<div class="mainitem--4>の部分が適応されません <div class="main"> <img src="img/main_content.png" class="main__

    • 0評価
    • 359PV
    shiroikoma shiroikoma 4日前に コメント
  • 解決済

    回答
    4

    画像にマウスが乗ったとき表示を変えたいです

    前提・実現したいこと 現状はこのマウスが乗る前はこのようになり マウスが乗ると画像の様に背景が真っ白になってしまいます。 マウスが乗ったときどのようにしたいかというとこの下の画像のようにしたいです。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <met

    • 0評価
    • 420PV
    ryuji000 ryuji000 4日前に コメント
  • 受付中

    回答
    0

    flagcssにおけるプロパティ及びjQueryの不安定な挙動(スライドメニューが収納されない)に関して

    前提・実現したいこと ①商品詳細ページおいて、header部分にコンテンツが重なる症状を改善したいです。 ②pc以外の各デバイス(iphone6s / 6 / 5等)において、トップページの背景画像を縦横比を保ち、画像全体 がぴったり収まるレイアウトにしたいです。 ③jQueryによるスライドメニューがレスポンシブデザインでは不安定な挙動を見せるため

    • 0評価
    • 87PV
    teratailが5日前に アップデート
  • 解決済

    回答
    2

    z-indexをposition:relativeに指定しても効かない

    解決したいこと 画像にフレーム画像を重ねて表示したいのですが、z-index指定しても指定通りにいきません。 コードの記述順のまま表示されます。 position:relativeやabsoluteを指定してみたのですが、それでもうまくいきませんでした。 どうしたら画像フレームを画像に重ねて表示することができるでしょう。 階層構造はこのままで重なりを指定した

    • 0評価
    • 344PV
    kotori_00 kotori_00 6日前に コメント
  • 解決済

    回答
    2

    正方形のdivの中に9つのdivを作る

    ご覧いただきありがとうございます。 下のサンプルのよう、正方形のdivの中に9つのdivを作りたいのですが、なかなか揃えません。 ・欲しいデザイン ・要件 サンプルイメージの1,3,7,9は5emで、5は15emのサイズにしたいと思います。 内部のdivの文字の位置は以下の揃えたいです。 .inner-div1 -> vertical-align:

    • 0評価
    • 56PV
    super super 6日前に コメント
  • 解決済

    回答
    1

    divが排他されて下方に。

    ◇ローカル開発環境XAMPP ◇WordPress 4.8.1 ◇テーマ:「WordPressデザインブック3.x対応」添付CD のsampleテーマ。下記◆はいずれもsampleディレクトリ下。 div#content // width: 850px; └ div.post // width; 550px; margin-bottom: 30

    • 0評価
    • 341PV
    vitabrevisarsl1 vitabrevisarsl1 1週間前に ベストアンサー
  • 解決済

    回答
    2

    position指定で画面幅が変わっても位置が変わらないようにしたいです

    前提・実現したいこと positionの指定で画面幅が変わっても指定の位置で動かないようにしたいです 普通のマックの画面で見るとこんな感じなのですが 大きめの画面で見るとこんな感じでずれてしまうのですが常に1枚めみたいに配置したいです <div class="mainVisual"> <div class="concept">

    • 0評価
    • 343PV
    ryuji000 ryuji000 1週間前に コメント
  • 受付中

    回答
    1

    画像をうまく配置できません

    前提・実現したいこと 縦横比をそのままで画像を画面いっぱいに表示したいです] 現状こんな感じなのですが! 実際には下のように配置したいです containで指定するとこのように画像が小さくなってしまいます。 <header> <div class="header__wrap flex"> <a href="">

    • 0評価
    • 341PV
    ryuji000 ryuji000 1週間前に コメント
  • 解決済

    回答
    1

    position rerativeで画像を下に下げることができません

    前提・実現したいこと positionの指定で子要素の画像を自由に動かしたい 該当のソースコード <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-

    • 0評価
    • 348PV
    ryuji000 ryuji000 1週間前に コメント
1

タグ情報

  • あなたの順位

    -

  • タグ登録者数

    5009

  • 総質問数

    1254

  • 今週の質問数

    14

関連するタグ

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る