成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

入門display:inline-block運(yùn)用

lookSomeone / 3001人閱讀

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

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

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


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

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


                    

                        賬戶登錄
                        賬戶注冊
                    

                  

                 
               
              

             
               

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

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

               

                      
               
              

              

                
相關(guān)文章

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

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


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


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

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

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


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

              

              
               

                  
                  
發(fā)表評論

                   
               

              

                

                  
0條評論
閱讀需要支付1元查看
<