我發現了為什么我不會開發,或者不願意,我感覺是因為我不會前端,自認為寫出來完美的后台顯示不好也沒人用,為了解決這一問題,筆者新增html欄目,和大家一起交流分享。
一.img必須有src和alt屬性
src屬性規定了顯示圖像的URL,瀏覽器會對該URL發起Http Get請求。
alt屬性則規定了圖像的替代文本,在圖像無法顯示或者用戶禁用圖像顯示時,代替圖像顯示在瀏覽器中的內容。
但是我發現,其實你不加上alt屬性也不會報錯,不過筆者認為加上的話這樣即使圖像無法顯示,用戶還是可以看到的一些相關信息,從而大大提高了頁面的用戶友好性。
二.我發現用兩個img的話圖片是上下存在的,沒有在左右方向,如何解決呢



我先把兩個地址用逗號隔開放在一個src,發現完全無法顯示;后來我發現是因為顯示問題,兩個img寫在一起,默認就是左右並排;
width值太大 導致你的頁面只能承載那么多屬性多余的屬性會在你下一行顯示,要有精確的布局才能做出自己的效果。
2.1我得解決方案
第一個寬度為50%,第二個占用剩余寬度,我記得是“*%”,后來發現不是;兩個都設置為50%,發現還是上下顯示,第二個索性不填了,顯示第二章圖的效果。於是我果斷把第一個img標簽前面加了一些空格" ",現在是第三幅效果,就是我博文右側邊欄了。
2.2遺留問題
控件占用剩余寬度,怎么表示?
三.<img>標簽在HTML和XHTML中有什么區別?
前者不需要結束標志,在后這里面必須被正確關閉。
四.為什么要指定height和width?
您在瀏覽網頁的時候,可能會遇到這種情況:隨着頁面中的圖像加載並成功顯示,頁面上的內容會隨之發生不規律的移動,影響您的閱讀。這種情況就是因為頁面上的圖像沒有定義height和width屬性而導致的。
如果沒有定義圖片的height和width屬性,那么瀏覽器為了能夠顯示每一個加載的圖像,它需要先下載圖像,然后解析出圖像的高度和寬度,並在顯示窗口留出相應的屏幕空間,這樣就會導致瀏覽器不斷地重新計算/調整頁面的布局,這可能會延遲文檔的顯示,並導致頁面重繪。
因此,筆者建議使用<img>的 height 和 width 屬性來指定圖像的尺寸。這樣的話,瀏覽器在下載圖像之前就為其預留出了空間,從而可以加速文檔的顯示,還可以避免文檔內容的移動而引起頁面重繪。
五.<img>標簽的onload/onerror/onabort事件,在什么情況下會被觸發?
onload: 事件會在圖像加載完成后立即發生。
onerror: 事件會在文檔或圖像加載過程中發生錯誤時被觸發。
onabort: 事件會在圖像加載被中斷時發生。例如用戶單擊了瀏覽器的Stop按鈕,或者在圖像下載的過程中。
六.如何獲知用戶是否禁止瀏覽圖片呢?
用戶是可以設置瀏覽器不顯示圖片的,尤其是在移動設備上,用戶為了節省流量,往往會禁止圖片顯示。那么,如何獲知用戶是否禁止瀏覽圖片呢?
在stackoverflow里說是設置src的complete屬性,我現在用不到,不管了;我突然感覺,這是瀏覽器的事情,不顯示就不顯示吧,會出現alt,用戶自己也知道,所以我認為這個問題沒必要管。
七.收獲
7.1 收獲1
笨方法就是最好的方法,其實不是該方法笨,而是自己根本想不到,說到底就是自己浮躁,不踏實。
7.2收獲2
不想學習,我就果斷回去睡覺,打游戲。
八.參考文獻
http://www.cnblogs.com/hencehong/archive/2012/10/06/something_interesting_about_image.html
