Yadda zaka gina Taswirar Hoto tare da CSS

zažužžukan

Ina son wani abu 'geeky' don haka na yanke shawara a kan 'aljihu' mai ɗaukar hoto wanda ke riƙe da duk hanyoyin biyan kuɗi don bulogina.

A zamanin Gidan yanar gizo na 1.0, tarin hanyoyin haɗin yanar gizo kamar wannan za'a iya gina su ta hanyar haɓaka hoton ku sama da hanyoyin haɗi akan kowane hoto, sa'annan kuna ƙoƙarin ɗinke su duka tare da tebur. Hakanan za'a iya cika shi ta amfani da taswirar hoto amma wannan yawanci yana buƙatar kayan aiki don gina tsarin haɗin kai. Amfani da Takaddun Shafukan Cascading yana sa wannan ya zama mai sauƙin… babu hotunan hotuna kuma babu ƙoƙarin neman kayan aiki don gina tsarin haɗin ku!

  1. Gina hoton da kake son amfani da shi. Kuna iya amfani da wannan hoto a ƙasa (danna-dama da adana don saukewa):
    Zabuka
  2. Loda hotonku zuwa kundin adireshi wanda yake da dangantaka da CSS ɗinku. A cikin WordPress, ana iya yin wannan mafi sauƙi ta hanyar sanya shi a cikin babban fayil ɗin hoto a cikin kundin taken taken.
  3. Sanya HTML dinka. Yana da kyau kuma mai sauki… div tare da hanyoyi guda uku a ciki:
    > div id = "biyan kuɗi">> a id = "rss" href = "[hanyar ciyarwar ku]" "title =" Biyan kuɗi tare da RSS ">> span class =" hide "> RSS> / span >> / a>> a id = "email" href = "[adireshin imel ɗin ku na biyan kuɗi]" title = "Biyan kuɗi tare da Imel" >> span class = "ɓoye"> Email> / span >> / a>> a id = "mobile" href = "[hanyar sadarwarka ta hannu]" title = "Duba Sigogin Waya" >> span class = "hide"> Waya> / span >> / a>> / div>
    
  4. Shirya Takaddun Shafin Cascading. Zaku kara salo daban daban guda 6. Salo 1 don jimlar duka, 1 don alama don haka baya nuna kowane ado na rubutu, salo 1 don ɓoye rubutu (wanda aka yi amfani da shi don samun dama) da ƙayyadaddun salo na 1 ga kowane mahaɗin:
    # yi rajista {/ * hoton hoton bango * / nuni: toshe; nisa: 215px; tsawo: 60px; bango: url (hotuna / zaɓuɓɓuka.png) ba-maimaitawa; gefe-saman: 0px; } # sanya kuɗi a {rubutu-ado: babu; }. ɓoye {ganuwa: ɓoye; } #rss {/ * RSS Link * / shawagi: hagu; matsayi: cikakke; nisa: 50px; tsawo: 50px; gefe-hagu: 20px; gefe-saman: 5px; } # email {/ * Adireshin Imel * / yawo: hagu; matsayi: cikakke; nisa: 50px; tsawo: 50px; gefe-hagu: 70px; gefe-saman: 5px; } #mobile {/ * Hanyar Hanyar Waya * / shawagi: hagu; matsayi: cikakke; nisa: 50px; tsawo: 50px; gefe-hagu: 130px; gefe-saman: 5px; }

Matsayi mai kyau ne kuma mai sauki… kara tsayi da fadi sannan kuma saita gefen hagu daga gefen hagu na hoton, da kuma saman gefe daga saman hoton!

Wannan "Yadda Ake" post ɗin shine don shiga cikin Geeks shine Sexy matuƙar Gasar “Yadda Ake”! Noteaya daga cikin bayanin, gaskiya ne cewa taswirar hoto na iya samun polygons masu rikitarwa, amma ban taɓa ganin wurare da yawa ba inda dole ne a sami hakan. Ban lura ba cewa babban hoton 'RSS akan RSS shine Geeks na gefe… wancan shine kyakkyawan wuri don haɗi. 😉

An sabunta 10/3/2007 don ingantacciyar hanya tare da shawarar Phil!

tallafa: Idan kun kasance sabon shiga zuwa ƙirar gidan yanar gizo, to Gina Gidan Yanar Gizon Ku Hanyar Dama ta Amfani da HTML & CSS, Buga na 2 abu ne mai dole. A cikin wannan jagorar mai sauƙin bi zaku koya yadda ake gina gidan yanar gizo mafi kyawun hanya - ta hanyar yin hakan da kanku!

41 Comments

  1. 1

    Doug, wannan alama alama ce mai kyau, amma ba a iya samunsa ba.

    Yi la'akari da makaho mai amfani tare da mai karatun allo, mai amfani da rubutu kawai mai bincike ko duk wanda ya ziyarci shafin ba tare da CSS ko Hotunan da aka kunna ba (kamar, watakila mai amfani da hannu yana neman hanyar haɗi zuwa rukunin yanar gizonku na sada zumunci). Babu ɗayansu da zai sani game da waɗannan hanyoyin haɗin guda uku saboda ba su da rubutu. Idan hotunan suna kashe mai amfani bazai ma ga alt rubutu don bayyana abin da zai kasance ba saboda hoto ne na bango.

    Zai fi kyau a yanki hotunan, a haɗa su, a saka su a cikin jeri kuma a shawagi kusa da juna. Ko ma yi amfani da rubutu don hanyoyin haɗi kuma maye gurbin rubutun ta amfani da ingantacciyar hanyar sauya hoto. Wannan yana da kyau, amma yana sa abubuwa da wuya / ba zai yiwu ba ga waɗanda basa amfani da madaidaicin mai binciken zane.

    • 2
      • 3

        Daga,

        JAWS baya karanta taken mahada ta tsohuwa, amma kuna da gaskiya, zai iya yi. Me yasa zaku nemi taken haɗin gwiwa idan baku san akwai shi ba duk da haka, kuma koda kuwa kun kasance, tabbas wannan ya faɗi ne ga batun amfani wanda ke ma'ana kuna bawa masu ƙarancin ƙarfi ikon amfani da shafin ku na biyu.

        Ga masu bincike na rubutu, labarin da kuka nuna min zuwa wancan Lynx shima yana baku damar kawo jerin sunayen taken mahaɗa, amma maganata itace idan baku san akwai hanyar haɗi a wurin ba, tunda babu rubutu a farko , me yasa zaku nemi rubutun take?

        Aƙarshe, halayen haɗin taken har yanzu bazai bayyana ba ga duk wanda ke yin bincike ba tare da an kunna hotunan ba ko kuma ba tare da kunna CSS ba.

        Don haka ee, haɗin kai tare da taken suna da kyau fiye da waɗanda ba tare da su ba, amma a wannan yanayin yana da iyaka ne kawai.

        Wannan shine dalilin da ya sa amfani da hoto, don a iya karanta alt rubutu, ko sauya hoto, don haka rubutun yana wurin, zaɓi ne mafi aminci, mafi sauƙi da amfani.

        • 4

          Kyakkyawan Bayani, Phil. Zan yi ƙoƙari don haɓaka wannan ta hanyar rubutu amma kawai ɓoye rubutun - ta wannan hanyar samfurin da za a iya samu kamar JAWS zai karanta rubutun haɗin kuma rubutu zai bayyana idan CSS ko Hotuna sun kasance naƙasassu.

          Ban yarda ba cewa hanyar mafita kawai ita ce sanya hoto tare da hanyar haɗi, kodayake.

  2. 5
  3. 8

    Na sata Can, na ce da shi.

    Doug, zane-zanen suna da kyau kuma lambar tana da sauki sosai yana bani tsoro (ina wasa da CSS kuma a yanzu na sami “shi”).

    Tweaking lambar don biyan bukatata, gano inda zan sauke HTML kadan a ciki, kuma a gaskiya yana da kyau kuma ya tsabtace wancan saman sidebar dina wanda ke tursasani MAHADI.

    Ina kawai iya saya muku wannan kofi tukuna!

  4. 10

    Daga,

    Zan kasance mai rarrabuwar murya, ina amfani da gogewa a matsayin misali. Ina tuna imel dinmu lokacin da imel na gida ya canza kuma kun lura dole ne in shiga sabuwa kawai. Dole ne in yarda cewa ina da ɗan lokaci na "gano" sabon fasalin akan rukunin yanar gizon ku don sake shiga. Wani ɓangare na wannan saboda asalin haɗin yanar gizo ya kasance mafi gargajiya kuma na tuna da wancan. Wasayan kuma saboda rabin ambulaf ɗin kawai bai yi kama da ambulaf a wurina ba da farko. Bayan kamar minti 5 ko sama da haka na fara jujjuya linzamin kwamfuta na a kan kowane hoto kuma idan taken "Biyan kuɗi tare da Imel" ya nuna, to na san ina cikin kasuwanci. Kwakwalwata kuma ta gano menene hoton mahaɗin.

    Amma, aƙalla a wurina, ambulaf ɗin gefe kawai ba shi da masaniya a gare ni a matsayin wurin biyan kuɗi don sanarwar imel. Kuma (saboda an ce min in ƙare da abu mai kyau koyaushe) Na yarda da Phil a sama; hanyar tana da sauki sosai kuma duk abun yana aiki babba. Na ɗauke shi kayan aikin ƙirar ku sun taimaka don ba ku madaidaitan girma ga sassan 3; shin hakan daidai ne? Dole ne in ɗauka haka, tunda idan na kasance, faɗi, hoto mai faɗi pixel 400 zan buƙaci sanin saitunan da suka dace, da dai sauransu.

  5. 12
    • 13

      William,

      Da alama kuna iya samun rikici tsakanin sunayen ajin tsokaci da sunayen ajin a cikin labarun gefe. Kuna iya sanya musu suna daban don share rikicin. Bari in sani idan kuna buƙatar hannu!

      Doug

  6. 14
  7. 15
  8. 16
  9. 17
  10. 18

    Kyakkyawan tsari, amma ina buƙatar wani abu don taswirar yanayin ƙasa, don haka ba zan iya amfani da yankuna murabba'i ɗaya ba… Ina ganin dole ne in yi amfani da hoton hoto na tsohuwar hoto tare da haɗin kai, amma mai yiwuwa zan zurfafa zurfin abu…

  11. 19

    Godiya ga wannan bayanin, Doug. Na kasance a nan kafin in yi mamakin yadda kuka yi shi. Muna son ƙirƙirar taswira kamar wannan don sakawa bayan bayananmu, kuma yanzu muna da hanyoyin, zamu iya yin hakan. Bravo!

  12. 20
  13. 21

    Sannu Doug,
    Na bar tsokaci na baya amma na fahimci cewa da wuya na gabatar da duk wani bayani game da matsalar na. Mun kasance muna daidaita batun taken kalma don taimaka mana ƙaddamar da sitcom ɗin kan layi anan:

    http://www.phaylen.com/blog/

    Yanzu, zaku ga muna da tutar kewayawa ko'ina saman, hoton da muke niyyar zana kamar yadda muke da sau da dama a baya. / dabinon. Babu ɗayanmu da gaske bai fahimci CSS ba, amma muna tuntuɓe sosai kuma har ya zuwa yanzu mun yi daidai har zuwa wannan lokaci. Labarin ku a cikin KADAI DAYA daga cikin mutane da yawa waɗanda aka bayar sune ainihin haske kan yadda ake amfani da ɗaukar hoto a cikin CSS a sauƙaƙe. Na yi amfani da tsarin salo bisa ga kwatancen ku, amma ban san inda zan sanya HTML ba. Duk abin da kuka ce shine "Addara html… Yana da kyau kuma mai sauƙi" sannan na firgita saboda ina tsammanin .. “ba mai sauƙin isa gareni ba! Ban san zan iya saka html a cikin kowane ɗayan waɗannan shafukan php ɗin a cikin editan taken ba. Shin ina sanya html a cikin rubutun kai? Babban Shafin Fihirisa? Ayyukan? Ina tsammanin duk masu amfani da kalmomin suna da zaɓi na gyara taken su a cikin editan dashboard, wanda yake da alama kyakkyawa ce ta duniya cikin aiki. Idan za ku iya ba da shawarar inda za ku sanya html, Ina so in daidaita lambar oru don sandar kewayawa ta.

    Godiya ga raba ilimin ku ga al'umma. Ina farin cikin kawo muku kofi.

    • 22

      Barka dai Phay!

      Duk fayilolin jigon shafinku suna nan ta hanyar Admin panel don gyarawa. Idan ka latsa Gabatarwa sannan Editan Jigo, ya kamata ka sami damar ganin jerin fayilolinka a dama da edita a gefen hagu.

      Idan kuna son wannan ya kasance a cikin labarun gefe, tabbas kuna da shafin Yankin gefe. Danna don gyara shi sannan sanya HTML ɗin da aka bayar cikin shafin inda kuke so.

      Noteaya daga cikin bayanin: Shirye-shiryen tsarin salo yana da alaƙa da shafinku, don haka kuna buƙatar loda hoton a cikin kundin hotunan taken idan kuna yin nuni ne da shi kamar yadda kuke yi da sauran hotuna a cikin takenku.

      Fata cewa taimakawa!

    • 23

      Ba,
      Na ci karo da wannan rukunin yanar gizon a yau kuma na sami matsala kamar ku. Na kuma so in kara taswirar hoto zuwa hoton hoton. Bayan wasa tare da shi na ɗan lokaci, na samu daidai. Saka div HTML a cikin filen header.php. Na sanya shi tsakanin da. Ba tabbata ba idan samfurinku yana da ainihin lambar, amma kunna shi tare da shi a cikin fayil ɗin header.php kuma zaku iya gano shi.
      -
      Paul

  14. 24

    Godiya ga amsa mai sauri!

    A'a, ban so ya kasance a cikin labarun gefe na teh ba, yana saman shafin ne (zaka iya gani a mahaɗin da na bayar- sandar kewayawa mai ruwan hoda da ke faɗi game, game da wasan kwaikwayon ect ..)

    Ina aiki a cikin dashboard duk safiya, rashin alheri, ban tabbata ba a cikin wane fayil ɗin da na sanya html, kamar yadda aka bayyana a sama, ina da dama, header.php, babban index.php, ayyuka.php, footer.php. Ban tabbata ba inda zan saka lambar HTML. (bangaren farko da kuka bayar, na riga na saka ragowar a cikin kundin tsarina) Ina da hoto na a can akan gidan yanar gizo, komai ya shirya tsaf, kawai dai ina bukatar sanin inda zan kara bangaren html na lambar domin daidaitawa.

    Na gode sosai don lokacinku da tambayoyin tambayoyin daga mai farawa.

    Fayi

  15. 25

    Ko kuma wataƙila wani zai iya yin rubutu a cikin tsokaci game da wane fayil ɗin da muka sanya ɓangaren html na lambar a ciki. Wani maigida ɗan saƙonni sama ya ce ya gano hakan. Ban yi sa'a ba.

    Phaylen

  16. 26
  17. 27

    Ina cikin jahannama lokaci zuwa lokaci don gano hanyar shigar da taswirar hoto mai sauƙaƙe a cikin kalma ta wordpress saboda ta cire alamun taswirar html. Hanyar ku zata yi aiki amma taswirar Amurka a bayyane yake hanya ce ta rikitarwa ta dunƙule ta wannan hanyar. Na bata.

    Taimako.

    Kamar dai filashi ne kawai zaɓi na?

    • 28

      Dave,

      Idan ka sanya hoton a cikin samfurinka, zaka zama lafiya. Idan ka sanya taswirar hoto a cikin ainihin abin da ke ciki, za ka iya shiga cikin matsalolin tacewa. Hanyar da na yi aiki a kusa da wannan mummunan abu ne, amma a wasu lokuta na kan yi amfani da iframe.

      Doug

  18. 29

    Hi,

    da alama taswirar hoto da hanyoyin haɗin abubuwa abubuwa biyu ne daban-daban, basa aiki tare kamar yadda taswirar hoto a cikin html take

    lokacin da na hada matsayi na baya (hagu na tsakiya) don taswirar hoto, sanya hanyoyin ba zai biyo baya ba.

    wata hanyar da za a bi wannan? ina son mai son gaske. na gode.

  19. 31

    Shin za ayi amfani da irin wannan hanyar don taswirar hoto mai girma da rikitarwa kamar yadda nake ƙoƙarin amfani da su?

    Idan ka duba shafina, danna maballin hagu kuma zaka ga hoton da nake kokarin amfani dashi azaman taswirar hoto (a karkashin Harafin Rubutu).

    Ainihin, ƙoƙarin amfani da Hoton don zuwa kowane ɓangaren wannan jerin ta wasiƙa.

    Tabbas, na share mintuna 20 ina gina taswira tare da GIMP, sannan WP ya cire alamun taswira, don haka ne yadda na sami rukunin yanar gizonku.

    Kodayake, na iya yin tunani ta amfani da Flash

    Thanks.

  20. 33

    a halin yanzu ina amfani da shimfidar samfuri da gyara tare da kayana. Ina so in kara taswirar hoto, amma ban tabbata inda zan sanya shi a cikin css ba. hoton da nake son yin taswirar shi yana cikin ɓangaren taken.

  21. 34

    sannu, na gina gidan yanar gizina akan joomla… ina son inyi amfani da wannan hanyar dan sanya tambarin shafina ya zama hanyar hadewa zuwa gida, an gaya min cewa ba zaka iya yin hakan da joomla ba amma wannan labarin yana bani fata! Taimako ta hanyar imel za a yaba sosai… .na gode

  22. 35

    Barka dai Doug - Ina gina katafaren taswirar hoto ta css wacce kuma tana da nade-nade masu nisa (a wannan yanayin, ana nuna rubutu a wani wuri a shafin lokacin da kake shawagi daya daga cikin wuraren da hoton yake). Ko ta wace hanya, na ci karo da misalinku a nan yayin binciken hakan I kuma ina tsammanin zan raba abubuwan da ke shigowa:

    1. Don samun dama, bai kamata kuyi amfani da ganuwa ba: babu (ko nunawa: babu wanda idan kukayi la'akari da hakan) don ɓoye rubutun a nan, azaman kayan aikin da aka zana da ganuwa: masu karatun allo ba zasu karanta ɓoyayye ba (waɗanda ke bin tabo) .

    Madadin haka, yi amfani da mafi ƙarancin fasahar sauya hoto. Ina ba da shawarar ko dai hanyar Phark ko Gilder / Levin - waɗannan su ne mafi kyawun sunayen da aka rubuta a google don nemo hanyoyin yau da kullun. Na fi son G / L tunda shima yana aiki tare da CSS amma an kashe hotuna.

    2. Duk da yake ban ga yana karyewa ba (ta amfani da FF3), aiwatar da sanyawa kuma yana da haɗarin haɗari. Matsayi mai cikakken matsayi yana matsayi dangane da mafi kusantar iyayensa. Ainihin, kuna so a bayyane saita yanayin matsakaici ta amfani da 'matsayi: dangi' zuwa # rubutaccen tsari. Sannan yara (hanyoyin haɗin yanar gizo) za'a iya sanya su a cikin wannan iyayen. Wannan hanyar na taimakawa tabbatar da ingantaccen sakamako a duk faɗin masu bincike.

    Hakanan, yakamata ku yi amfani da shelan sakawa na “saman: x” da “hagu: x” (inda x yake darajar fargaba, faɗi a px) maimakon iyakoki don ɗaukar wannan matsayin. Bugu da ƙari, ba lallai ba ne in ga ya keta hanyar da kuke da shi, amma sama da hagu ana nufin wannan don haka me zai hana ku yi amfani da su? Ari da kuna da abubuwan hawa da raƙuman ruwa da aka saita akan abu ɗaya, wanda a ƙayyadadden yanayi ke haifar da ɓarnar “tazara biyu” a cikin IE6 (shin kun gwada wannan a wurin?) - yayin da akwai gyara, kuna guje wa wannan batun gaba ɗaya ta amfani da saman kuma an bar shi a gefe saboda lada don matsayi a wannan yanayin.

    3. A ƙarshe, me zai hana kayi amfani da jerin kalmomin da basu dace ba don waɗannan hanyoyin maimakon ma'anar ma'ana?

    Yi haƙuri don droning on… Ina son in raba, b / c Na sani daga gogewa yadda akwai hanyoyi daban-daban da ake amfani da CSS don samun sakamakon da ake so, amma tabbas wasu hanyoyi suna aiki da kyau (mafi amintacce, mai binciken giciye) fiye da wasu . HTH.

  23. 36
  24. 37
  25. 38

    Na gode sosai!! Umarninku ya cece ni Awanni na aiki… Ni sabo ne ga ci gaban yanar gizo, kuma kawai na sha wahala ne a farkon babban aikina. Na sanya shi… abokin ciniki yana da farin ciki, hakika nishaɗi ne, kuma haka ni ma!

  26. 39

    Barka dai, na gode sosai don sanya wannan! Shekaru daga baya kuma har yanzu yana taimakawa… da kyau! Ina gwagwarmaya don samun taswirar hoto don haɗi a wuri mai kyau. Ina da tuta kuma ina son gumakan zamantakewar da ke saman dama na tutar su danganta ta da lambar da kuka kawota. Yana aiki sosai, sai dai kawai ina yin wani abu ba daidai ba saboda hanyoyin haɗin yanar gizo na suna nunawa a saman gefen hagu na allon, ba kan alamun gumaka ba, amma akan tambari. Na tabbata abu ne mai sauki, amma ba zan iya gano shi ba. Tunani zan raba shi anan idan kuna da wata fahimta. Na sake yin godiya don saka wannan!

Me kuke tunani?

Wannan shafin yana amfani da Akismet don rage spam. Koyi yadda aka sarrafa bayanan bayaninka.