2017年2月23日木曜日

Webデザインの気付きメモ

会社のHPを色々といじっていく中で当たった問題点などを解決策ともに掲載。

使用ツールはGoogle Chrome デベロッパーツール(クローム開いてF12)
Web開発でよく使う、特に使えるChromeデベロッパー・ツールの機能 - Build Insider
・「Ctrl+F」で要素の検索 
Chrome デベロッパーツールの使い方: プロのように華麗に使いこなすための20のテクニック | コリス

CSS

・floatは要素を右や左に寄せる時に使う。(だけど、↓ display: inline-blockが楽)

floatしたら、floatさせる要素の直の親要素にclearfixを付けて、必ず解除する!
基本widthを指定して崩れないようにする!
positionでstatic以外の値が指定されている要素にはfloatは効かない!

参考にしたサイト

・display: inline-blockは横並びにしたいときに使える。

ブロックみたいに横に積んだり、縦に積んだりできる。
ボタンやリンクなどの要素を指定する時に便利。
Floatはclearfixが必要だが、こちらはいらない。Floatをdisplay: inline-blockに置き換えるだけ。

参考にしたサイト
・CSS - inline-block
・CSSの display: inline、display: block、display: inline-block をマスターしよう! | たねっぱ!


・Pタグのボックス要素の中のテキストを垂直方向中央揃えにする

CSSでline-heightを使う。
PXより、数値で指定するとやりやすいかも。

参考にしたサイト
・テキストの縦方向の中央揃えについて - Qiita
・行間を調整したい!CSSのline-heightの使い方 | TechAcademyマガジン

・CSSが一部分だけ読み込まれない。

F12画面で再読込ボタンを長押しし、ハード読み込みボタンを押すと、サーバーから直接読み込むので、キャシュ経由のCSS読み込みがされないのを解消してくれる。

参考にしたサイト
・CSS変更が反映されない時に試してほしい方法。ブラウザのキャッシュを削除したくない時におすすめ! | ルカルカアフィリエイト

・画像やテキストを中央揃えする


参考にしたサイト
・【CSS】様々な要素を中央揃えにする方法 | クリエイタークリップ




フォント

フォントサイズは16PX、18PXくらいで
pxとemの違いについてのまとめ | ちゃんとしたブログ

・リンクの文字を指定して大きくする

リンクだけが小さくなるなどの場合、
 <p class="nousya"> 納車方法は<a class="nousya_a" href="sugunori.html">スグ乗りお届けサービス</a>です。</p>という形でクラス属性を指定して、CSSでフォントサイズを変更することが可能。
もちろんPの方のクラス属性もフォントサイズなどを変更できる。

                 

2017年2月16日木曜日

G-simpleでの操作やエラーの気づき

G-simpleを使っていて、気づいた操作や、エラーを書き留めておく。

・Feed rate Fxy out of range.

引用元によると、
あなたのツールライブラリを見てください。Fxyは水平送り速度です。プランジ送り速度をFzとします。ライブラリには、工具ごとに2種類のデータが格納されています。
A.ジオメトリデータ(直径、脚部、フルート数など)
B.フライス加工データ(速度、送りなど)
フライス加工データは材質によって異なります。材料は、「ライブラリはすべてのツールとすべての材料グループのための製粉パラメータのセットを格納することができる。材料区分」。で一緒にグループ化され
たメッセージ「範囲外FXYは'は製粉パラメータセットが存在しないことを示しているで発見されましたライブラリ。
ツールライブラリに移動し、それを追加し、それを修正すると解決する。

とあるので、ツールの設定がうまく行ってない証拠。
デフォルトのツールを使用ツールでしていれば、とりあえずはGコードを吐き出してくれる。
ツール設定の仕方が悪い?

引用元:http://www.gsimple.eu/faq.html


・Please check pocket for producability or select a smaller tool.

ワークの素材を変えるかツールを変えると、とりあえずはGコードを吐き出してくれる。