CSS asettelu - kelluva ja poistuminen
- Edellinen sivu CSS ylivuoto
- Seuraava sivu CSS pyyhkäisy poissa
CSS asettelu - kelluva ja poistuminen
CSS float Atribuutti määrittää, miten elementti liikkuu.
CSS clear Atribuutti määrittää, mitkä elementit voivat liikkua poissaolevan elementin vieressä ja millä puolella.
float-ominaisuus
float Atribuutti käytetään sijainnin ja muodon määrittämiseen, esimerkiksi sallimaan kuvan liikkua vasemmalle konttorin tekstin puolelle.
float Atribuutti voi asettaa seuraavista arvoista yhden:
- left - Elementti liikkuisi konttorinsa vasemmalle puolelle
- right - Elementti liikkuisi konttorinsa oikealle puolelle
- none - Elementti ei liikkuisi (näkyisi tekstin juuri ilmestyessä siihen). Oletusarvo.
- inherit - Elementti periisi isänsä float-arvon
Yksinkertaisin käyttö on:float Atribuutti mahdollistaa (lehdissä) tekstin ympäröimän kuvan vaikutuksen.
Esimerkki - float: right;
Esimerkissä määritellään, että kuva tulisi olla tekstin sisällä oikealle liikkuvana:
johtava Web-tekniikkakoulutus - Kaikki ilmaiseksi. CodeW3C.comilla voit löytää kaiken tarvitsemasi verkkosivuston rakentamisen opetusmateriaalit. Alusta perus HTML:ään CSS:ään, aina edistyneisiin XML, SQL, JS, PHP:ään.
Ammattimainen verkkotekniikkaopetus - Kaikki ilmaiseksi. CodeW3C.comilla voit löytää tarvitsemasi kaikki verkkosivuston rakentamisen opetusmateriaalit. Alusta perus HTML:ään CSS:ään, aina edistyneisiin XML, SQL, JS, PHP:ään.
CodeW3C.comilla tarjoamme tuhansia esimerkkejä. Voit muokata näitä esimerkkejä verkkosivustollamme ja kokeilla koodia.
Esimerkki
img {
float: right;
}
Esimerkki - float: left;
Esimerkissä määritellään, että kuva tulisi olla tekstin sisälläVasemmalleLiikkuvuus:
johtava Web-tekniikkakoulutus - Kaikki ilmaiseksi. CodeW3C.comilla voit löytää kaiken tarvitsemasi verkkosivuston rakentamisen opetusmateriaalit. Alusta perus HTML:ään CSS:ään, aina edistyneisiin XML, SQL, JS, PHP:ään.
Ammattimainen verkkotekniikkaopetus - Kaikki ilmaiseksi. CodeW3C.comilla voit löytää tarvitsemasi kaikki verkkosivuston rakentamisen opetusmateriaalit. Alusta perus HTML:ään CSS:ään, aina edistyneisiin XML, SQL, JS, PHP:ään.
CodeW3C.comilla tarjoamme tuhansia esimerkkejä. Voit muokata näitä esimerkkejä verkkosivustollamme ja kokeilla koodia.
Esimerkki
img {
float: left;
}
Esimerkki - Ei float
Esimerkissä kuva näkyy tekstin juuri ilmestyessä siihen (float: none;):
johtava Web-tekniikkakoulutus - Kaikki ilmaiseksi. CodeW3C.comilla voit löytää kaiken tarvitsemasi verkkosivuston rakentamisen opetusmateriaalit. Alusta perus HTML:ään CSS:ään, aina edistyneisiin XML, SQL, JS, PHP:ään.
Ammattimainen verkkotekniikkaopetus - Kaikki ilmaiseksi. CodeW3C.comilla voit löytää tarvitsemasi kaikki verkkosivuston rakentamisen opetusmateriaalit. Alusta perus HTML:ään CSS:ään, aina edistyneisiin XML, SQL, JS, PHP:ään.
CodeW3C.comilla tarjoamme tuhansia esimerkkejä. Voit muokata näitä esimerkkejä verkkosivustollamme ja kokeilla koodia.
Esimerkki
img {
float: none;
}
Laajennettu lukeminen
课外书：CSS liukuvuus
- Edellinen sivu CSS ylivuoto
- Seuraava sivu CSS pyyhkäisy poissa
