您的位置：首页 > 职场人生

IMWEB小白DAY3-制作个人名片

2017-04-22 01:03 155 查看 
通过名片制作，了解盒子DIV模型，float属性；图片背景搭配，LOGO配置、DIV框架、字体排版等知识。效果图如下：
<html><head><title>小白DAY03名片卡</title></head><body align="center"><!--名片卡制作--><div id="mingpian"><div id="logo"><div id="logo_img"><span>LOGO</span></div><p>成松科技有限公司</p></div><div class="clearDiv"></div><div id="image_div"><img src="证件照.jpg" height="100%" width="100%"/></div><div id="jieshao"><h1>李成松</h1><h3>职务:技术总监</h3><hr /></div><div class="clearDiv"></div><div id="zhuyingfanwei"><p>主营范围：JAVA项目、ASP项目、微信开发、IOS开发、大数据分析、安卓APP开发、前端设计、PPT</p></div></div><style>#mingpian{width:350px;height:200px;border:2px ridge #3366cc;margin-left:400px;margin-top:200px;background-image:url("背景.jpg");}#image_div{width:80px;height:100px;border:1px dotted  #8e8e8e;margin-left:20px;margin-top:20px;float:left;}#jieshao{float:right;padding-right:50px;padding-top:20px;}#jieshao h1,h3{font-family:"微软雅黑";color:#3366cc;margin:0;padding:0;}#jieshao h3{color:#313131;}#jieshao hr{color:#3366cc;width:111px;}#zhuyingfanwei{height:30px;margin-left:20px;margin-top:5px;font-family:"楷体";font-size:14px;color:#616161;}#logo_img{width:20px;height:20px;background-color:3366cc;margin-left:20px;margin-top:2px;float:left;font-size:10px;line-height:20px;color:white;}#logo p{float:right;margin-right:170px;line-height:20px;}.clearDiv{clear:both;}</style></body></html>

                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                程序员
                                                图片
                                                字体
                                                DIV学习
                                                HTML
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航