成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

入門display:inline-block運用

lookSomeone / 2963人閱讀

摘要：這是我第一篇博客，是我新的開始，我要用博客記錄我的學習之旅，在這里我要感謝我的哥哥，他帶我開闊了眼界，糾正了我的格局，給我?guī)砹苏芰俊?/p>

這是我第一篇博客，是我新的開始，我要用博客記錄我的學習之旅，在這里我要感謝我的哥哥，他帶我開闊了眼界，糾正了我的格局，給我?guī)砹苏芰俊Ｎ沂且粋€小白，學習的路還很長很長，學習了10天HTML與css，應了一句話，所有浪費的日子都是要還的!
言歸正傳下面總結(jié)下這段時間學習出現(xiàn)的問題和學習感想

第一個問題我要在上面添加一個logo和一個搜索框,搜索框里有個搜索的小圖標


#logo{                  
    margin-top: -10px;
    margin-left: 60px;   
}

我發(fā)現(xiàn)，logo和搜索框不能對齊，當時我用float margin等命令調(diào)試，都不出效果，經(jīng)過幾經(jīng)周折，最后用到了display:inline-block;和vertical-align:middle;實習。還有那搜索框外的小圖標就是不進入里面，我就在想怎樣移動，可是怎么都移動不了，后來哥哥告訴我把搜索框的border去掉在外面套一個邊框，才實現(xiàn)了這個問題。

#logo > * {
    display: inline-block;
    vertical-align: middle;
} 
#logo > p > * {
    display: inline-block;
    vertical-align: middle;
    border: none;
}
#logo p {              
    border: 1px solid rgb(219, 92, 19);
    margin-left: 50px;
}
#logo  p a{
    text-decoration: none; 
}

第二個問題
我就是想讓邊框和下面的搜索框?qū)R第一想到的是讓下面的邊框變短，后來發(fā)現(xiàn)這樣是不成立的，接下來想到的是讓怎么個DIV框變小，可是我想到了讓他變小我后面的是不是就變大了不能成立我就沒試，最后我改變了他的大小，用margin-left命令調(diào)成想要的效果。
這是原來的代碼,


                    

                        賬戶登錄
                        賬戶注冊
                    

                  
showImg("https://segmentfault.com/img/bV0Rpw?w=372&h=350");


改變了#zhdl中width：45%,margin-left:26px;得到了想要的效果,不過后面的賬戶注冊
width也是需要修改的.


還有個特別低級的錯誤在這里我必須強調(diào)下自己，在其他登錄的后面，那些圖片用到的是backgroud-position命令，插入后面背景圖圖片的時候，路徑寫錯了，并且沒有想到是這個問題?。。。。?br>我要反思的是我的解題的思路，很重要，出現(xiàn)了一個問題我應該怎樣去解決，而不是沒有頭緒，以后學習中還會有很多問題，不可能別人都會告訴你，我一點要鍛煉自己的解決問題的能力與思路，以后的路還很長，學的問題很多，我這可以說才是開始，或者說開始都不算，不過也有點進步，給自己加油！
Winner takes all
           
               
                                           
                       
                 

            
                     
             
               

                   
 文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

                 
                   
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/51628.html

               

                      
               
              

              

                
相關文章

                
    
                             
                                                                                                    
  • 
                                                
    
                          
    入門display:inline-block運用
    
                                                     
    摘要：這是我第一篇博客，是我新的開始，我要用博客記錄我的學習之旅，在這里我要感謝我的哥哥，他帶我開闊了眼界，糾正了我的格局，給我?guī)砹苏芰俊?

這是我第一篇博客，是我新的開始，我要用博客記錄我的學習之旅，在這里我要感謝我的哥哥，他帶我開闊了眼界，糾正了我的格局，給我?guī)砹苏芰?。我是一個小白，學習的路還很長很長，學習了10天HTML與css，應了一句話，所有浪費的日子都是要還的!言歸正傳下面...
    
                                                   
                          
    
                                
    
                                    edagarli
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    2016百度前端技術(shù)學院Task02
    
                                                     
    摘要：的演示整個項目的地址的地址起初只是想簡單開始重新做一遍百度前端技術(shù)學院的任務，但是在做的過程中萌生了要記錄下自己在過程中遇到的一系列問題的想法?，F(xiàn)在我把自己完成的小項目的源碼在上分享出來，希望可以幫到廣大前端初學者們。


Task02的演示DEMO：https://amnova.github.io/New-...
整個項目的GitHub地址：https://github.com/amn...
    
                                                   
                          
    
                                
    
                                    venmos
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    2016百度前端技術(shù)學院Task02
    
                                                     
    摘要：的演示整個項目的地址的地址起初只是想簡單開始重新做一遍百度前端技術(shù)學院的任務，但是在做的過程中萌生了要記錄下自己在過程中遇到的一系列問題的想法。現(xiàn)在我把自己完成的小項目的源碼在上分享出來，希望可以幫到廣大前端初學者們。


Task02的演示DEMO：https://amnova.github.io/New-...
整個項目的GitHub地址：https://github.com/amn...
    
                                                   
                          
    
                                
    
                                    lolomaco
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    沒有flexbox彈性盒子，但我們還有table
    
                                                     
    摘要：結(jié)構(gòu)左基線向左移動右基線向右移動一定要使用屬性自己不熟悉的自行主要是為了好設置寬度都是相對于父元素的即將父元素平均分成了等份。

由于項目要兼容到IE9，因此將之前flex布局全部給換掉。今天leader讓我看了kitecss這個css框架(里面的一些布局方式能比較好的兼容IE8+，里面有一些比較好的柵格布局，垂直居中等方案)。然后具體的學習了里面的一些css技巧和方法，總結(jié)如下：
gi...
    
                                                   
                          
    
                                
    
                                    KunMinX
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    水平垂直居中
    
                                                     
    摘要：它為什么備受關注并不是因為它難實現(xiàn)，而是因為實現(xiàn)的策略太多了，讓人無可下手，無可選擇。多行塊級元素實現(xiàn)原理同水平居中的水平垂直居中綜合運用水平垂直居中即可。

它為什么備受關注？
并不是因為它難實現(xiàn)，而是因為實現(xiàn)的策略太多了，讓人無可下手，無可選擇。
將各個問題分類，給出常用解
水平居中
行內(nèi)元素：
text-align:center
html:


   text-align:cent...
    
                                                   
                          
    
                                
    
                                    MingjunYang
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                           
                

              

              
               

                  
                  
發(fā)表評論

                   
               

              

                

                  
0條評論
最新活動
閱讀需要支付1元查看
<