Welcome to Our Website

Miten luetelmakohta tai välilehti tekstiä minun web-sivulla tai HTML?

– Päivitetty: 02/01/2021 Tietokoneella Toivoa

On olemassa erilaisia menetelmiä sisentämällä tekstiä. Kuitenkin, yhteensopivuuden useiden selainten ja saavutettavuuden, keskustelemme suosituimmista menetelmistä sisentämällä tekstiä Web-sivulla.

Suositeltu menetelmä CSS & HTML

Esimerkiksi sisentämällä teksti tai kappale, yleisimmin käytetty ja suositeltava tapa olisi käyttää CSS. Alla on erilaisia esimerkkejä siitä, miten CSS voi luetelmakohta tekstiä., Jokainen näistä esimerkeistä olisi sijoitettu välillä <pään></head> HTML-tageja.

seuraava esimerkki loisi tyyliluokan nimeltä ”tab”, joka sisentää tekstin ja kappaleen 40 pikseliä vasemmalta.

<style type="text/css"><!-- .tab { margin-left: 40px; }--></style>

Kun yllä oleva koodi on <pään> osiossa voit käyttää sitä lisäämällä se teidän kohdassa (<p>) luokka kuten kuvassa.,

<p class="tab">Example of a tab</p>

mukaan Lukien CSS, HTML-asiakirjan, kuten edellä on osoitettu, on nimitystä ”in-line” CSS. Se on hyödyllinen nopeasti tehdä muutoksia, mutta pitkällä aikavälillä, se on vaikea muuttaa myöhemmin.

sen sijaan voit ottaa kaikki CSS-koodisi ja sijoittaa sen erilliseen tiedostoon, jossa on laajennus .css. Sitten, voit linkittää tämän yhden tiedoston mistä tahansa HTML-asiakirjasta, ja että asiakirja voi käyttää näitä CSS-ominaisuuksia. Ulkoisen CSS-tiedoston käyttäminen helpottaa CSS: n muuttamista myöhemmin, koska kaikki CSS on määritelty yhdessä paikassa.

<link rel="stylesheet" Type="text/css" href="http://www.example.com/basic.css">

kerran tämän .,css-tiedosto on luotu, muokkaa tiedostoa ja lisää samalla CSS, ilman <tyyli> ja kommentti tunnisteet, kuten näkyy.

.tab { margin-left: 40px; }

Lopulta, kun edellä mainitut vaiheet on suoritettu, voit välilehti tahansa tekstiä käyttäen samaa <p class=”tab”> esimerkiksi olemme osoittaneet edellä.

on myös muita sisennyksen muotoja. Esimerkiksi, jos haluat vain luetelmakohta ensimmäinen rivi kappaleen, sen sijaan, että käytät edellä CSS linja, voit käyttää seuraavaa linjaa.,

.tab { text-indent:40px }
Vihje

Voit myös luetelmakohta painoprosentteina. Esimerkiksi, sen sijaan, sisennys, jonka 40px (pikseliä), voit korvata luetelmakohta 5% sisentää tekstiä 5% nykyinen näkymä. Sisennyksen leveyttä määriteltäessä voi käyttää myös em-tilaa.

Bonuskärki

voit myös vaihtaa vasemmasta luetelmakohdasta oikeaan luetelmakohtaan muuttamalla marginaali-vasen marginaali-oikea.

Suositeltava tapa käyttää HTML

on mahdollista saavuttaa samat tulokset edellä inline tyyli sisällä HTML., Kun käytät edellä CSS-esimerkki voi helpottaa ylläpitämään kautta useita web-sivuja, jos haluat käyttää tyyliä, vain kerran voit käyttää seuraavaa esimerkkiä.

<p style="margin-left: 40px">This text is indented.</p>

tässä ensimmäinen esimerkki, kaikki tekstin kohta tag on sisennetty 40 pikseliä vasemmalta. Muita kappaletunnisteita ei ole sisennetty.

<p style="text-indent: 40px">This text is indented.</p>

tässä toinen esimerkki, vain ensimmäinen rivi tekstiä kappale on sisennetty 40 pikseliä vasemmalta. Kyseisen kohdan muita tekstirivejä ei ole sisennetty.,

Tip

voit myös luetelmakohdaksi prosenttimäärällä. Esimerkiksi, sen sijaan, sisennys, jonka 40px (pikseliä), voit korvata luetelmakohta 5% sisentää tekstiä 5% nykyinen näkymä. Sisennyksen leveyttä määriteltäessä voi käyttää myös em-tilaa.

Tip

Voit myös vaihtaa vasemmasta luetelmakohdasta oikeaan luetelmakohtaan muuttamalla marginaali-vasen marginaali-oikea.

Vaihtoehtoinen menetelmä

Toinen yleinen (mutta virheellisestä) menetelmä sisentämällä teksti on <blockquote> tunnisteet, kuten seuraavassa esimerkissä., Vaikka tämä on helpompi ratkaisu, se tuo esteettömyyteen liittyviä kysymyksiä. Tämä merkintä on tekstin lainaamista varten eikä sisäistämistä varten.

<blockquote>This text would be indented</blockquote>

lisätietoja

  • tarvitsetko luetelmakohta, kun kirjoitat HTML-koodia?
  • miten luodaan ylimääräistä tilaa HTML: ssä tai web-sivulla.
  • katso aiheeseen liittyvien tietojen ja linkkien luetelmakohta.
  • HTML ja web design help and support.

Vastaa

Sähköpostiosoitettasi ei julkaista. Pakolliset kentät on merkitty *