Ciamar a sgrìobhas teacsa timcheall air dealbh

Coimhead air duilleag-lìn sam bith agus chì thu measgachadh de shusbaint is ìomhaighean teacsa. Tha an dà phàirt sin riatanach ann an soirbheachas làrach-lìn. Is e susbaint teacsa a bhios luchd-tadhail làrach a 'leughadh agus dè na h-innealan rannsachaidh a bhios iad a' cleachdadh mar phàirt de na h-algorithms rangachadh aca. Bidh ìomhaighean a 'cur ùidh lèirsinneach air an làrach agus bidh iad a' cur cuideam air susbaint an teacsa.

Tha e furasta a bhith a 'cur teacsa agus ìomhaighean gu làraich-lìn. Tha teacsa air a chur ri tagaichean HTML àbhaisteach mar paragrafan, cinnidhean, agus liostaichean, fhad 'sa tha dealbhan air an cur air duilleag leis an eileamaid . Aon uair 's gu bheil thu air ìomhaigh a chur ris an duilleag-lìn agad, ge-tà, is dòcha gum bi thu airson an teacsa a shìneadh ri taobh an ìomhaigh, an àite a bhith air a shònrachadh gu h-ìosal (is e seo an dòigh àbhaisteach a bheir ìomhaigh a chaidh a chur ri còd HTML a-steach sa bhrobhsair). Gu teicnigeach, tha dà dhòigh ann air an urrainn dhut an sealladh seo a choileanadh, le bhith a 'cleachdadh CSS (moladh) no le bhith a' cur ris an stiùireadh lèirsinneach gu dìreach a-steach don HTML (chan eil e air a mholadh, seach gu bheil thu airson sgaradh stoidhle is structair a chumail airson do làrach-lìn).

A 'cleachdadh CSS

An dòigh cheart airson atharrachadh a dhèanamh air mar a tha suidheachadh teacsa agus ìomhaighean duilleag agus mar a tha na stoidhlichean lèirsinneach aca a 'nochdadh sa bhrobhsair le CSS . Dìreach cuimhnich, bhon a tha sinn a 'bruidhinn mu atharrachadh lèirsinneach air an duilleag (a' dèanamh teacsa timcheall ìomhaigh), tha seo a 'ciallachadh gur e raon de Stoidhlichean Cascading Style a th' ann.

  1. An toiseach, cuir do dhealbhan ris an duilleag-lìn agad. Cuimhnich gun cleachdar feartan lèirsinneach sam bith (leithid luachan leud agus àirde) bhon HTML sin. Tha seo cudromach, gu h-àraidh airson làrach-lìn fhreagarrach far am bi meud an ìomhaigh ag atharrachadh a rèir a 'bhrabhsair. Cuiridh bathar-bog sònraichte, mar Adobe Dreamweaver, fiosrachadh leud agus àirde gu ìomhaighean a chuirear a-steach leis an inneal sin, mar sin dèan cinnteach gun cuir thu às an fhiosrachadh seo bhon chòd HTML! Dèan cinnteach, ge-tà, teacs alt iomchaidh a thoirt a-steach. Seo eisimpleir de mar a dh'fhaodas do chòd HTML coimhead:
  2. Airson adhbharan stoidhle, faodaidh tu cuideachd clas a chur ri ìomhaigh. Is e an luach clas seo na bhios sinn a 'cleachdadh san fhaidhle CSS againn. Thoir an aire gu bheil an luach a tha sinn a 'cleachdadh an seo gu tur, ged a tha sinn buailteach a bhith a' cleachdadh luachan "clì" no "ceart" airson an stoidhle shònraichte seo, a rèir dè an dòigh anns a bheil sinn ag iarraidh ar ìomhaigh co-thaobhadh. Tha sinn a 'faighinn co-fhreagairt sìmplidh gu bhith ag obair gu math agus a bhith furasta do dhaoine eile a dh' fheumas air làrach a riaghladh san àm ri teachd airson tuigsinn, ach dh'fhaodadh tu seo a thoirt seachad air luach sam bith sa chlas a tha thu ag iarraidh.
    1. Le fhèin, cha dèan an luach clas seo càil. Cha toir an dealbh gu fèin-ghluasadach gu taobh clì an teacsa. Airson seo, feumaidh sinn a-nis tionndadh chun faidhle CSS againn.
  1. Anns an stoidhle agad, faodaidh tu a-nis an stoidhle a leanas a chur ris:
    1. .clì {
    2. flùraichean: clì;
    3. gleadachadh: 0 20px 20px 0;
    4. }
    5. Tha na tha thu a 'dèanamh an seo a' cleachdadh an seilbh "flùraichean" CSS , a tharraing an dealbh bho shruth àbhaisteach a 'phàipeir (mar a bhiodh an dealbh mar as trice a' nochdadh, leis an teacsa air a chuairteachadh fodha) agus cuiridh e an taobh ri taobh clì a 'ghobair aige S an Iar- An teacsa a thig às a dhèidh ann an comharra HTML leis a-nis a 'dol timcheall air. Chuir sinn cuideachd cuid de luachan coileanaidh gus nach biodh an teacsa seo dìreach dìreach an aghaidh an ìomhaigh. An àite sin, bidh beagan sparradh math ann a bhios tarraingeach gu lèir ann an dealbhadh na duilleige. Anns a 'gheàrr-sgrìobhadh CSS airson padding, chuir sinn 0 luachan ris a' mhullach agus taobh clì den ìomhaigh, agus 20 piogsail ris an taobh chlì agus aig a 'bhonn. Cuimhnich, feumaidh tu iomadachadh a chur ris an taobh deas de dh 'ìomhaigh co-cheangailte ris an làimh chlì. Bidh ìomhaigh co-cheangailte ris an làimh dheis (a bhios sinn a 'coimhead ann an diog) a' cur plocadh ris an taobh chlì.
  2. Ma sheallas tu do dhuilleag-lìn ann am brabhsair, bu chòir dhut a-nis faicinn gu bheil an ìomhaigh agad co-chòrdail ri taobh clì na duilleige agus gu bheil an teacsa a 'dol timcheall air. Is e dòigh eile air seo a ràdh gu bheil an ìomhaigh "air a ghluasad gu clì".
  1. Ma bha thu airson an ìomhaigh atharrachadh gu bhith air a chuairteachadh ris an làimh dheis (mar eisimpleir san eisimpleir dheilbh a tha a 'dol leis an artaigil seo), bhiodh e sìmplidh. An toiseach, feumaidh tu dèanamh cinnteach, a bharrachd air an stoidhle a chuir sinn ris an CSS againn airson luach clas "clì", tha aon againn cuideachd airson co-thaobhadh ceart. Bhiodh e coltach mar seo:
    1. .deas {
    2. flùraichean: deas;
    3. gleabadh: 0 0 20px 20px;
    4. }
    5. Chì thu gu bheil seo faisg air an aon rud ris a 'chiad CSS a sgrìobh sinn. Is e an aon eadar-dhealachadh an luach a chleachdas sinn airson an "seilbh" a tha sinn a 'cleachdadh agus na luachan padding a chleachdas sinn (cuiridh sinn cuid gu taobh clì an ìomhaigh againn an àite na làimh dheis).
  2. Mu dheireadh, dh'atharraicheas tu luach clas an ìomhaigh bho "chlì" gu "deas" anns an HTML agad:
  3. Coimhead air do dhuilleag anns a 'bhrabhsair a-nis agus bu chòir do dh' ìomhaigh a bhith co-thaobhadh ris an làimh dheis le teacsa a 'cuairteachadh timcheall air. Tha sinn buailteach an dà stoidhle sin, "clì" agus "ceart" a chur ris na stoidhlichean stoidhle againn gus an urrainn dhuinn na stoidhlichean lèirsinneach sin a chleachdadh nuair a tha sinn a 'cruthachadh duilleagan lìn. Bidh na dà stoidhlichean seo nan rudan snog, a ghabhas ath-chleachdadh a dh'fhaodas sinn tionndadh a-steach nuair a dh'fheumas sinn stoidhle a dhealbhadh le teacsa a 'dol timcheall orra.

A 'cleachdadh HTML an àite CSS (agus carson nach bu chòir dhut seo a dhèanamh)

Ged a tha e comasach clò-bhualadh timcheall ìomhaigh le HTML, bidh ìrean lìn ag ràdh gur e CSS (agus na ceumannan a tha air an taisbeanadh gu h-àrd) an dòigh air adhart gus am faod sinn sgaradh eadar structar (HTML) agus stoidhle (CSS) a chumail suas. Tha seo gu h-àraidh cudromach nuair a smaoinicheas tu sin, airson cuid de dh'innealan agus dhealbhaidhean, nach fheum an teacsa sin gluasad timcheall an ìomhaigh. Airson sgàilean nas lugha, dh'fhaodadh gum bi làrach-lìn fhreagarrach ag iarraidh gum bi an teacsa a 'dol gu h-ìosal gu h-ìosal fon ìomhaigh agus gu bheil an ìomhaigh a' sìneadh farsaingeachd làn an sgrion. Tha seo furasta a dhèanamh le ceistean meadhanan ma tha do stoidhlichean fa leth bho do chomharra HTML. Ann an saoghal ioma-inneal an latha an-diugh, far am bi ìomhaighean agus teacsa a 'nochdadh ann an dòigh eadar-dhealaichte airson luchd-tadhail eadar-dhealaichte agus air diofar sgrionaichean, tha an sgaradh seo deatamach airson soirbheachas agus riaghladh fad-ùine air duilleag-lìn.