A Look at Different Sass Architectures — SitePoint
As the size and complexity of a project grows, you require some sort of logic to structure your Sass files. It helps to follow some agreed upon guidelines for creating files and folders when working in large teams and projects. Below is a review of some of the techniques in use today. Bootstrap-sass Bootstrap’s intention is to be a UI library for web developers to quickly get off the ground. It is
AngularJS+Bootstrapを使ってもPageSpeed Insightsの成績をとにかく上げたい - albatrosary's blog
AngularJSとかBootstrapを使うとサイズも大きく初期ロードがちょっともっさりするという印象があります。「PageSpeed Insights」で測定するとAngularJSとかbootstrapなんて使うなってくらい点数が悪い。指摘事項は大体次の通り： スクロールせずに見えるコンテンツのレンダリングをブロックしている JavaScript/CSS を排除する JavaScript を縮小する HTML を縮小する 画像を最適化する CSS を縮小する 縮小に関してはgruntで行えるので問題ないのだが、レンダリングブロックするJavaScript/CSSを排除するというのは難しい。どこまで点数が良くなるか実験してみた。実際に云々とか細かい話は今回は考えず、とにかく「PageSpeed Insights」の点数を上げることだけを考えてみました。 PageSpeed Insigh
CSS · Bootstrap
Global CSS settings, fundamental HTML elements styled and enhanced with extensible classes, and an advanced grid system. Overview Get the lowdown on the key pieces of Bootstrap's infrastructure, including our approach to better, faster, stronger web development. HTML5 doctype Bootstrap makes use of certain HTML elements and CSS properties that require the use of the HTML5 doctype. Include it at th
BootStrapに標準装備されてるのについつい再実装しがちな機能とかまとめ。 - NOT SO BAD
(photo credit: Nathan O’Nions via photopin cc) 最近あらためてBootstrapにはまってます。 Bootstrapでサイト作ってる時に標準の機能を知らんくて わざわざ同じ機能を自分でcss書いたりしてることが多かったので、 よく再実装しがちな機能をまとめメモ。 3.0でフラットデザインになって、いわゆるbootstrap臭もだいぶ薄れた気がするけどどうなんやろ。。 3.0つかったサイトが増えたらまた臭ってきそうな気もするけど。 ドキュメント 知らずに再実装しちゃう系の便利機能はCSSのHelper Classesとかに多い。 ので最初にひととおりドキュメント見とくのはいいですね。 当たり前やろって話やけど。。 Bootstrap「Helper Classes」 text-align 単純に中央揃えとか左揃えとかだけを指定するために
Bootstrap 2.1「Affixプラグイン」がわかりにくかったので少し紐解いてみました | hijiriworld Web
仕組みは以下 Affixプラグインの仕組みを図解 まず、Affix要素はスクロール量とoffset引数によって、「.affix-top → .affix → .affix-bottom」と、クラスが自動的に変化していく。 offset引数（offset:top, offset:bottom）は以下の高さを指定する。 そうすると、状態変化と共にクラスが変化していく。 という仕組みがわかれば、さきほどの動作サンプル3でいいように見える。 でもこれは不完全。 正確には、”BootstrapのCSSを読みこんでいる場合”は不完全。 Bootstrapのサイトで実装されているAffixへの疑問 BootstrapのCSSを読み込んでいる場合、これだけではうまくいかないはず。 Affixが発動すると親要素の高さがゼロになるはず 追従を開始する（.affix）と、通常フローから逸脱する、つまり「posi
Bootstrap3のAffixとScrollspyを試してみた
就職してもうすぐ３年になりますが、初めて病欠しました。１７日の木曜日から熱と下痢でダウンしており、丸々二日パソコンさえ触らないという状況でした。 それはともかく、Bootstrapの公式サイトにもあるサイドバーのメニュー。 スクロールして一番上まで来たら追従するようになり、さらにヘッダーまでくるとその位置でストップするような動きになっています。そして、そのメニューはメインの内容に対応して現在の位置がどこか示してくれます。前者はAffix、後者はScrollSpyという方法を使うと実装できるようです。 というわけで作ってみたのそのメモ。 HTML <div class="container"> <header>HEADER</header> <div class="row"> <div class="col-sm-3"> <nav class="affix-nav"> <ul class="
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Pingendo
Bootplus
新着記事
Redirecting to login...
ngScrollSpy by mg
Bootstrap Affix Navbar - JSFiddle - Code Playground