Time of Update: 2016-08-18
CSS定位:相對定位、絕對位置和固定定位(relative absolute
Time of Update: 2016-08-18
常用的 css 命名規則,css命名規則頭:header內容:content/container尾:footer導航:nav側欄:sidebar欄目:column頁面外圍控制整體布局寬度:wrapper左右中:left right
Time of Update: 2016-08-18
laydate時間組件在Firefox瀏覽器下有多時間輸入框時只能給第一個輸入框賦值的問題,laydate多時間遇到的問題: laydate時間組件在Firefox瀏覽器下有多時間輸入框時只能給第一個輸入框賦值的問題(safari下也有同樣問題);解決辦法: 給laydate綁定id; 解決前代碼:1 <input id="startTime" placeholder="請輸入開始時間" class="laydate-icon"2
Time of Update: 2016-08-18
CSS3---2D變換,css3變換transform transition-origin:設定對象中變換所參照的原點 none:無變換 translate(<length>[,<length>]):指定對象的2D
Time of Update: 2016-08-18
bootstrap的下拉框在firefox介面不友好的處理,bootstrapfirefoxhttp://output.jsbin.com/titaki以上這個連結在firefix瀏覽器開啟就會發現裡面有個小容器,而且下拉按鈕樣式跟不友好上Google查了一下1.小容器可以利用select:padding:02.下拉表徵圖可以利用background-image;-moz-appearance:none把下拉框的樣式去掉,然後 @-moz-document url-prefix() {
Time of Update: 2016-08-18
給li設定float浮動屬性之後,無法撐開外層ul的問題。,floatul最近在項目中有好幾次遇到這個問題,感覺是浮動引起的,雖然用<div>它就脫離當前正常的文檔流,所以沒辦法撐開外層ul的高度。以下面代碼為例,其實有好幾種解決方案,我用的這種並不是最簡單的。<!DOCTYPE html ><html ><head><meta
Time of Update: 2016-08-18
css特效之openbox,cssopenbox話不多說,先上效果,當吧滑鼠移動上去就會產生開啟盒子的動畫 代碼如下:<!DOCTYPE html><html><head><title>open_box</title><style>#zong{margin:100px
Time of Update: 2016-08-18
學習筆記——關於HTML(含HTML5)的區塊層級元素和行級(內聯)元素總結,學習筆記html51.首先我們要知道什麼是區塊層級元素和行級(內聯)元素? 塊級(block)元素的特點:①總是在新行上開始;②高度,行高以及外邊距和內邊距都可控制;③寬度預設是它的容器的100%,除非設定一個寬度;④它可以容納內嵌元素和其他塊元素。
Time of Update: 2016-08-18
CSS重要屬性之float學習心得,cssfloat學習心得1 float:none;2 float:left;3 float:right;4 float:inherit;比較常用的兩個屬性值是左浮動和右浮動。在接下來的分享中,只會拿左浮動作為例子。其他浮動屬性值與左浮動原理相同。2.1:float之文字環繞效果浮動的初衷就是為了文字環繞效果。看如下代碼和demo。1 <div class="container">2 <div
Time of Update: 2016-08-18
Sublime Text3快速鍵實用總結,sublimetext3今天想給大家分享一個我自己最喜歡用的一個編輯器——Sublime Text3的常用快速鍵相信大家每天和代碼打交道,接觸時間最長的莫過於編輯器了吧,而我就特別喜歡用Sublime
Time of Update: 2016-08-15
CSS(四):背景+變形,css背景變形background-origin設定元素背景圖片的原始起始位置。必須保證背景是background-repeat為no-repeat此屬性才會生效。可取值有 border-box | padding-box | content-boxborder-box:設定背景圖片原點在邊框的最左上方1 .img{2 background-image:url(1.jpg);3 background-repeat:no-repeat;4
Time of Update: 2016-08-18
為什麼不能用速度與時間的關係去實現動畫,不能用速度實現動畫由於最近做了一些頁面的動畫效果,之前經驗不多,這次做的過程中碰到些問題,加之很早前就閱讀過一篇很好介紹動畫的部落格《關於動畫,你需要知道的》,來自十年蹤跡,所以就思考了一些關於動畫的基本原理的問題,比如本文這個。這個問題要簡單也可以非常簡單,比如前面提到那篇部落格裡就有一個比較好的解釋,本文提供的是另外一種更詳細地方式,希望對有需要的人有所價值。
Time of Update: 2016-08-18
移動端 軟鍵盤 彈出時 影響布局,鍵盤配置移動端 軟鍵盤 彈出時 會影響布局1)前段時間作的移動端頁面,因為高度只有1頁所以用了height:100%;width:100%;ios下點擊輸入框彈出軟鍵盤時,布局沒有大影響。當輸入框可能被軟鍵盤壓到時,在一部分安卓下卻出了問題,華為內建瀏覽器和UC會有布局上的問題。原因可能是因為,軟鍵盤彈出時,改變了height,使height:100%,不能達到原來的高度。解決辦法: $(document).ready(function () {
Time of Update: 2016-08-18
Web前端開發工具總結,Web開發工具總結前端開發工具:web前端開發乃及其它的相關開發,推薦sublime text, webstorm(jetbrains公司系列產品)這兩個的原因在於,有個技術叫emmet, http://docs.emmet.io,而這兩個對他的支援是:sublime text
Time of Update: 2016-08-15
html的常用標籤,html常用標籤寫在前面本人才是開始學習前端的菜鳥有很多不懂的忘大神指點html全名Hyper TextMarkup Language 下面說說常用的到的html的元素標籤 h1 h2 h3 h4 h5 h6 6級的標題標籤ul 無序列表標籤 子項目用 liol 有序列表標籤 子項目用 li a 超連結標籤 href 中間加串連地址p 大段文字用標籤pre 根據在代碼對應顯示用的標籤span 跨越多個字元用的標籤 突出某些字元img
Time of Update: 2016-08-15
CSS知識總結(七),css知識總結CSS常用樣式 5.背景樣式 1)背景顏色 background-color : transparent | color 常用值:①英文單詞,②十六進位,③RGB或RGBA 另外,還有一種是 漸層色彩 漸層色彩(gradient)分為線性漸層(linear)和放射狀漸層(radial) 線性漸層:background: linear-gradient(direction, color1, color2
Time of Update: 2016-08-15
CSS製作三角形和按鈕,CSS製作三角形按鈕CSS製作三角形和按鈕用上一篇博文中關於邊框樣式的知識點,能製作出三角形和按鈕。 我先說如何製作三角形吧,相信大家在平時逛網站的時候都會看到一些導覽列中的三角形吧,比如說: 網易首頁的頭部功能表列中,也會有這樣的三角形當滑鼠經過時,三角形會垂直翻轉,如下現在我分享製作三角形的做法,主要是利用邊框做成的首先,四個三角形合并在一起的正方形,也就是正方形的四條邊框形成的四個三角形原始碼:<!DOCTYPE
Time of Update: 2016-08-18
a標籤加入單擊事件 屏蔽href跳轉頁面,href跳轉我們常用的在a標籤中有點擊事件:1. a href="javascript:js_method();"這是我們平台上常用的方法,但是這種方法在傳遞this等參數的時候很容易出問題,而且javascript:協議作為a的href屬性的時候不僅會導致不必要的觸發window.onbeforeunload事件,在IE裡面更會使gif動畫圖片停止播放。W3C標準不推薦在href裡面執行javascript語句2. a
Time of Update: 2016-08-15
CSS知識總結(六),css知識總結CSS常用樣式 4.段落樣式 1)行高 控制段落內每行高度 line-height : normal | length 例子 原始碼:/* CSS代碼 */.normal{ line-height:normal;}.length{ line-height:30px;}<!-- HTML代碼 --><body> <p
Time of Update: 2016-08-15
CSS常用樣式(三),css樣式一、2D變換 1、transform 設定或檢索對象的轉換 取值: none::以一個含六值的(a,b,c,d,e,f)變換矩陣的形式指定一個2D變換,相當於直接應用一個[a,b,c,d,e,f]變換矩陣 translate(<length>[, <length>])。第一個參數對應X軸,第二個參數對應Y軸。如果第二個參數未提供,則預設值為0。