跳到主文
部落格全站分類:圖文創作
要如何在文章標題前面加個圖呢?方法其實很簡單......
之前一直設法要在文章標題的前面加個圖試了好多方法就是不行,後來在ArtSkill那看到他的文章標題正是我想要的,趕緊請教他方法其實還滿簡單的,只要將一些語法放在CSS裡就行了 範例:.title { font-family: verdana, arial, helvetica, sans-serif;/*字型*/ font-weight: bold; /*字為粗體*/ font-size: 15px;/*字體大小*/ color: #333333; /*字體顏色*/ margin: 10px 0px; /*整個標題區塊與上下區塊間的距離*/background-image:url(http://p5.p.pixnet.net/albums/userpics/5/9/468159/1210519944.gif);/*背景圖示*/ background-repeat: no-repeat;/*背景圖示不重覆*/ padding:5px 0px 10px 35px;/*利用內距的屬性,讓文字排列在圖示之後出現*/ }先將你要放在標題前的圖示存到網路空間我是直接存在新浪的圖片管理裡就可以了! 在CSS裡找到 .title然後將...background-image:url(圖示網址); background-repeat: no-repeat;padding:5px 0px 10px 35px;這三句貼進去,其中padding的屬性為5px 0px 10px 35px; 依序代表上、右、下、左,我讓左邊與文字間的設定拉大,如此文字就會在圖示之後,至於距離可自行調整若是有使用文章邊框,圖示覺得會與邊框太貼近可以將圖示在往右移一點,這樣就不會貼著邊框了請在將MARGIN-LEFT:10px; 加進去就可以了!若覺得不需要,這句就可省略掉! 有看到我文章標題前,那隻搖著尾巴的嗎? 就是這樣來的! 無名的使用方法也一樣唷!
情意的足跡
cm788847 發表在 痞客邦 留言(21) 人氣()
留言列表