HTML/CSS のどんな質問にも優しく答えるスレ 34
■ このスレッドは過去ログ倉庫に格納されています
ここは初心者からベテランまで、全ての人を対象に優しく答えるスレです
類似質問、重複質問、丸投げ大いに結構。HTML / CSS 関係の事なら何でもOK
分からない人は何回聞いても結構。質問するときはIDを出すためにメール欄を
age にすることをおすすめします。
回答してくれる方は優しい人のみ！ 質問者に対して暴言を吐く人はこのスレを見るな！！
終わった話を蒸し返すやつは このスレにくるな！！！
自分で調べろという回答も禁止！！回答するかさもなくば何も書き込むな！！
質問側も節度あるレスで！質問前にスレ内を検索しましょう
■次スレについて
基本的にレスナンバー>>980を取った人（立てられない場合は次の宣言者）が立てて下さい
重複を避けるため、独断でスレ立てはせず必ず意思表示をしてから立てて下さい（>>980を取った場合も）
立てられない事が予め分かっている場合は、>>980付近の書き込みは自重しましょう
■前スレ
HTML/CSS のどんな質問にも優しく答えるスレ 33
http://mevius.5ch.net/test/read.cgi/hp/1531279252/
■関連スレ
Webサイト制作初心者用質問スレ part249
http://mevius.5ch.net/test/read.cgi/hp/1529144063/
■HTML
HTML Living Standard 日本語訳
https://momdo.github.io/html/index.html
■CSS
Selectors Level 4 日本語訳
https://triple-underscore.github.io/selectors4-ja.html >>134
そうだよ
あとwordpressのテーマ作ったりプラグイン作ったり
wordpress使ったことなかったけど独学で一ヶ月半でテーマとプラグイン作った
そもそも俺は36歳から独学でコーディング勉強したおっさん
今は普通に他の開発者と連携して大規模アプリ作ったり、一人で開発したりしてる >>135
あなたすごいね。
何から勉強すればいいか教えて >>135
案件はどこから得てる？
立ち上げ当初と現在では経路は変わった？
立ち上げ時は今と比べて苦労してた？そうでもない？
今後に不安はある？ない？そう考える理由は？ >>135
すっごいなあ
フリーランスなりたいけどどうすりゃいいのか探している最中だわ >>138
コネなしで始めるのはハードル高い、どころか棒なし棒高跳だよなあ
この商売に限った話じゃないけど
未経験ならなおさら
おっちゃんが始めた頃はまだ未開の地だったので
やりたい放題だったなあ >>136
好きなところからでいいと思う
どうせ必要に応じてなんでもやらないといけなくなるし
>>137
知人が勝手に案件持ってくる
その知人は営業が得意でIT関連のコンサルやったりしてるから
あとは自分で作ったアプリをサイトで売ったりしてると、そのアプリのこういう機能つけたの作ってくれみたいな話がくる
>>138
フリーランスになるなら自分で営業ができるかが大事だね
俺は営業まったくできないから上の営業マンと組んでる >>139
だよなぁ・・・
クラウドソーシングサイトなんか見ても仕事取れる気せんわ。
とういか取れない すいません、ワードプレスのSTINGER8使ってるのですが、
レイアウトのズレみたいなのが気になります・・
質問てここで大丈夫でしょうか？ フリーエンジニアは、Ruby on Rails だろ
YouTube の動画にあったけど、
エージェントに、10% とか払えばよいって containerクラスのついて質問なんですが
・containerクラスの中にheader, main, footer要素を入れているサイト
・header, main, footer要素にそれぞれcontainerクラスを入れているサイト
の2つを見かけますが違いとか正解とかはあるんでしょうか？ クラス名は特に意味ないんで
好きにしたらいいんだぜ どっちでもいいんですね、
こだわりもっている人多いのかなと思って聞いてしまいました ライブドアブログのスマホ版での広告の余白がどうにかなりませんか？
https://imgur.com/a/igybrDW
このように右側に大きな余白ができてしまいます
レイアウトで2つ並べても同じ形が2つ縦に並びます。
どうしたらびしっと埋まるような広告を作ることができますか？ ＜table＞
＜tr＞
＜td class="col1"＞＜／td＞
＜td class="col2"＞＜／td＞
＜td class="col3"＞＜／td＞
＜／tr＞
＜／table＞
table{
width:100%;
}
td.col1{
width:50px!important;
}
td.col2{
width:40%;
}
td.col3{
width:40%;
}
こんな風にすると、ブラウザの幅を変更した場合に、
col1は出来る限り50pxになると思ったのですが、
実際は、勝手に変化してしまいます。
たぶん、100-(40+40)=20% の幅になっているようです。
そう言うもんですか？
やりたいのはcol1を50pxくらいに固定して、
col2,col3は同じ幅にしたいのですが。 col2とcol3をcalc(50%-25px)にしたら？ 私たち日本人の、日本国憲法を改正しましょう。
総ム省の、『憲法改正國民投票法』、でググって
みてください。拡散も含め、お願い致します。 >>156
さっそく試してみました。
その結果col1は50pxに固定出来たのですが、
col2,col3が同じ幅になりません。
col3のほうが広くなります。原因わかりません。
>155
flexでやると言うのはtableを使わないと
言う事ですか？もしそうなら、どんな要素を使えば良いですか？ >>158
156に加えて、tableにtable-layout: fixed;をつけてみたらどう？ >>159
さっそく試してみたら、
col1,col2,col3が同じ幅になりました。
もうわけ分かりません。 >>154
col2とcol3の指定がいらないので外す。
<style>
table{
width:100%;
}
td.col1{
width:50px;
}
</style>
色付けて可視化
<style>
table{
width:100%;
}
td.col1{
width:50px;
background-color: #ddd;
}
td.col2{
background-color: #f5f5f5;
}
td.col3{
background-color: #eee;
}
</style> そういえばクロームは大丈夫なんだけど、
FirefoxとIEだとテーブルが崩れてtable-layout: fixedで直ったな
display:tableで子供全員に幅書いてたんだけど >>161
col2,col3のwidthを指定しないと、
それらのwidthは中のテキストの長さに応じて
勝手に決まりますよね。
ご提示いただきましたコードを試しましたが、
col2=col3にはならなかったです。 table-cellの幅の決まり方って独特だからポイントで使いたくなることはある >>164
ごめん。文字数考えてなかった
バグというかダメぽいな
もうdiv+tabelでやるしかないんじゃね >>164
tdの親、つまりtrに対してflexを使うか
tdに対してinline-blockだな
table{
width:100%;
}
tr{
display: flex;
}
td.col1{
width:50px;
}
td.col2{
width: calc( 50% - 25px );
}
td.col3{
width: calc( 50% - 25px );
} >>164
ごめん、flexならcalcは要らないか
んでIE11とかも考慮するなら下記みたいな感じIE9とかは知らない
col2とcol3は設定いらない
table{
width:100%;
}
tr{
display: flex;
}
td{
display: block;
flex: 1;
}
td.col1{
flex: 0 0 50px;
} header,footer,mainなどのタグでセクショニングすると、マシンリーダビリティが向上するのって、構成が分かりやすくなるから？それとも、タグで囲む事自体が重要なの？
タグで囲む事自体が重要なら、めちゃくちゃシンプルなコードでもセクショニングはした方がいいってこと？
例えば、php使った簡単な問い合わせフォームのコードをセクショニングすると、main要素だけになっちゃう場合とか。 構造がわかりやすくなるからだろ
header footerなど共通部分は重複コンテンツとみなさないように重要度下げるのに対し
main部分を重要視したり
でもアクセス数やアクセス内容の重要度に比べたらほんと大した差は無いと思うがね。 tableにdisplay:blockでレスポンシブにしたらいい >>175
このサンプルを無理やりマークアップするならこんな感じになる。
<hrader><h1>掲示板</h1></header><main>投稿部分</main>
サンプルだからというのもあるけど、知らない人を集めようとするならもっと親切にサイトについて書かないといけない。
何の掲示板で、どういうルールがあって、どういうメニューがあって、問い合わせ先はどこで、とか。
それらが全て自然とマークアープに繋がるから本来は自然とnavもfooterも必要が出てくる。
必要ないというならそもそも人を集める必要がないページなんだよ => つまりSEOは不要 生cssでいつのまに変数が使えるようになってたか・・・
:root {
--main-gutter: 12px;
--main-position: center;
--main-lh: 1.5;
}
と思ったらIEだけ・・死ね ↑androidも含めてIE以外は主要ブラウザは全部対応OKなんだが使ってる？ >>171
table{width:100%;}
tr{display:flex;}
td{display:block;flex:1 1 1px;word-break:break-all;}
td.col1{flex:0 0 50px;}
tdのflex:1 1 1pxとword-break:break-allを追加しました。
ie11とfirefoxで確認。 >>170>>171>>181
どの方法でも上手く行きました。
ありがとうございました。 formって不便じゃない？
ネストできなしいサブミットにアドレスつけられないし
フォーム共通にして別のアクションにポストしたいときどうしたらいいの ネストできるしサブミットにアドレスつけられるが
そんな事しなくても普通に、フォームに複数のアクションボタンをつければいいだけ
サーバー側で同じアドレスへのポストをパラメータ見て振り分けるだけ >>183
アクション先を変えればいいだけじゃん
もしくはアクション先を同一にしてポストするsubmitボタンの判定で別けるとか
どうにでもできる どういうこと？
<form method="post">
<form method="get">
<input>
<input>
<submit>
</form>
<submit>
</form>
とか
<form>
<input>
<input>
<submit action="get">
<submit method="post">
</form>
ってできるの？ ＞サブミットにアドレスつけられるが
＞アクション先を変えればいいだけじゃん
これ具体的にどうかいて何をかえれるの？
name属性で同じCGI内でボタン識別できるのは知ってるけど
URLやGET,POSTメソッドかえることってできるの？ まあそうなんだけどだからJSの力をかりないとできないの不便だなーと スライダー沢山あるけど、使い分けるんじゃなく、どれか1つでカスタマイズ次第でなんでも可能なものですか
https://creive.me/archives/10461/#jQuery >>192
なんでも可能かはドキュメント見るしかないけどまぁ試して見るのが手っ取り早い。
可能なことが多いと設定が多岐にわたり簡単なスライダー実装する時めんどくさかったりもするけど。 俺はいつもswiperだな
前はslick、その前はbx使ってたけどもう使うことはないな 俺もswiperだな
bxsliderはautoの扱いが癖強くてなあ 私もSWIPERです。最初に覚えたのがそれだったので。Slickとかのほうがメジャーとは知らず。
先日画像サムネイルとキャプションをつけたくてFotorama使ったけど、Swiperでもできたのかも。 自分はbx
1つのページ内に複数のスライダーがあって全部違うの使ってるのに出会ったことがある
悩んだんだろうな スライドとかのアニメーションcssでも出来るけど無駄かね？
アニメーションであんまりjs使いたくない病なんだが… >>200
組んでるとパズルみたいで面白くはあるけど枚数変わるたび直さなくちゃいけないじゃん だいたい更新頻度高いじゃんスライダー入れるとこって 画像のサイズ同じならファイル名同じにして上書きすればいいだけだから
そんな面倒じゃなくね？ >>204
んで蔵がキャッシュ消さずに見て
更新されてないんですが!!
までテンプレ >>204
いや、CSSだけで作るやつの話
枚数増えると破綻するから そもそもcssだけだとフリックも吸着もできないなー スライダーに最低限必要なもの
・自動スライド
・スライドからのリンク
・フリック(左右)
・ナビゲーション(前次のやつ)(左右)
・ページネーション(ドット/サムネイル)
jsなしでできるのって最初の2つだけじゃね？ >>208
ナビゲーションとページネーションはcssでも出来る
フリックはやったことないな ページネーションをcssってまたチェックボックスだろｗ
そういうのさわりたくない すまん。教えてくれ。
<div class=外側>
<div class=内側>
<p>ああああ</p>
</div>
</div>
これで、全画面固定して、内側の上下にボーダー引こうとしても引けない…。
内側で線を引こうとしてるのは、全画面の半分の幅だけに引きたいからなんだけど。
別の方法探るしかないかね <label></label>
の内側ってブロックでも何でもいれてもいいの？ Form 作り方わからんぞ これHTMLとCSSで済む問題じゃないよな。
作り方サイト見てもことごとくそこにしか触れてない。 >>215
HTMLとCSSで
なんとかなってない人の方が少ないと思うけどなあ >>215
PHPかvus.jsかAWSのサービス使え htmlとcssができない人に
php、vue、awsを勧めるのかｗ ひょっとしてサーバーサイドがないと
form意味ないだろって言ってるのか form受け取る側で無料サービスでできるのってPHPぐらい？
他のフレームワーク無料で使えるとこってあるの？ htmlとcssって頑張ればどのくらいである程度できるようになります？
システム管理やってるものですが、急にHP担当がやめることになって勉強しないといけないです。
アドバイスもあれば教えて下さい >>212
線を付けるだけならcssで内側のdivにborder付ければいいだけ
内側div幅が画面いっぱい100%のまま線の横幅だけ50%にしたいって言うなら
内側divに疑似要素:beforeと:afterを使ってそれぞれにborderを付けて幅50%とかすればいい
>>214
HTMLのバージョンと仕様による ある程度って書いてるだろ
正直、3日もいらん
1日で十分 フォームはGoogle Formを埋め込むのが利用者目線ではベストじゃないかね。 >>223
人にもよるけど
だいたい3日から30年ってところ どっちにしても誰でもすぐに習得できる
できないなら人間やめろ システム管理やってるって書いてんだからプログラマだろ
JavaやC++を完璧にマスターしてるかもしれんから
HTMLくらい余裕だろ。 JavaやC++完璧にマスターしてる人はシス管なんてやんないよ ■ このスレッドは過去ログ倉庫に格納されています
