• 解決済 gambling777

    (@gambling777)


    プロフィール画像

    HTMLをコピペして枠で文字を囲いたいですが、このようなはてなマークが表示されてしまいます。

    ータイトルーという形に線で囲みたい時にはどうしたら良いでしょうか?

15件の返信を表示中 - 16 - 30件目 (全40件中)
  • トピック投稿者 gambling777

    (@gambling777)

    •「次に、WordPressの管理画面から「外観」->「カスタマイズ」->「追加CSS」の順にクリックして、カスタマイズ部分のCSSコードを追加CSSに貼り付けます。」

    こちら実践しましたが、変わりませんでした。

    Youtubeで勉強をしているのですが、“wordpress ,css” と検索すると割と出てきます。

    貼り付けた、HTMLとCSSのコードをここに貼り付けて共有していただけますか?
    できるだけ切り取らずにそのまま貼ってください。

    トピック投稿者 gambling777

    (@gambling777)

    かしこまりました。不足ございましたら、教えていただけますと助かります。

    よろしくお願いいたします。

    HTML:https://imgur.com/FyLhgNM

    CSS:https://imgur.com/2NgW6ma

    すみません。もしかして….
    HTMLのコードを埋め込まれた投稿ページ(or 固定ページ)を開いていますか?
    開いた状態で確認して、それでも変化がないということですか?

    トピック投稿者 gambling777

    (@gambling777)

    HTMLのコードの場合には投稿ページで開いています。HTMLは行を追加するプラスマークを押して埋め込みました。

    追加CSSは外観のカスタマイズから設定しました。

    開いて確認しても変化なしです。

    キャッシュかな….

    該当ページのURLを共有してもらえますか?
    そうすればもっとアドバイスできることがあるかもしれません。

    トピック投稿者 gambling777

    (@gambling777)

    かしこまりました。

    https://otona-home.com/wp-admin/post.php?post=326&action=edit

    URLこちらです。よろしくお願いいたします。

    @yukinobu さん、横から失礼します。

    こちらの画像を拝見した感じでは・・・
    https://imgur.com/FyLhgNM

    HTMLを途中までしか入力されていないのではないかと思うのですが、違いますかね???

    @gambling777 さん、浅川さんが共有してくださった以下のコードを「HTMLブロック」にすべて挿入されていますか?

    (グレーの囲みの下に表示されている「展開」という文字を押していただくと HTML がすべて見えます)

    .box1 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #95ccff;
    border-radius: 8px;
    }
    .box1 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #95ccff;
    font-weight: bold;
    }
    .box1 p {
    margin: 0;
    padding: 0;
    }
    トピック投稿者 gambling777

    (@gambling777)

    @setouchikotori 様が仰られているのは追加CSSのことでしょうか?

    よく読んでください!

    浅川さんが共有してくださった以下のコードを「HTMLブロック」にすべて挿入されていますか?

    とお尋ねしています。

    以下の画像を拝見した感じでは、途中までしか入力されていないように見えるのです。

    https://imgur.com/FyLhgNM

    たいへん失礼いたしました!
    コード間違えてますね・・・<(_ _)>

    「HTMLブロック」に以下のコードです。

    <div class="box1">
    <span class="box-title">ここにタイトル</span>
    <p>ここに文章</p>
    </div>

     

    ご共有いただいた画像では、以下の2行しか入っていないように見えるのです。

    <div class="box1">
    <span class="box-title">ここにタイトル</span>

    下記のように入力できていれば・・・

     

    私の環境では▼このように (意図されたとおりに) 表示されますよ!

    @gambling777 さん

    貼っていただいたページのURLですが、編集中のページURLを共有してもらっても、私たち第3者は確認できません。どうしてもうまくいかないのであれば、ページを公開し、その後にURLを共有してください。もしくはページタイトルでも良いです。

    で、@setouchikotori さんがアドバイスしてくださったように、コードの一部が不足している可能性があります。

    サンプルコードを私から共有しましたが、まずは素直にそのコードを貼り付けてみて正しく表示されるかをご確認ください。その方が早いです。

    その上で、カスタマイズしてオリジナリティーや個性を表現するのは、それからでも遅くないと思いますよ。

    トピック投稿者 gambling777

    (@gambling777)

    お二方、ありがとうございます!一度、公開してみました。

    改変は一切加えておりませんが、皆様の画像のようにはなりません。。。

    • この返信は4ヶ月、 4週前にgambling777が編集しました。
15件の返信を表示中 - 16 - 30件目 (全40件中)
  • このトピックに返信するにはログインが必要です。