Kad jūs iegultat elementu savā HTML, jums ir divas iespējas tam pievienot CSS stilus:
- Jūs varat stilu
IFRAME
pati. - Jūs varat veidot lapu iekšpusē
IFRAME
(ar noteiktiem nosacījumiem).
CSS izmantošana IFRAME elementa veidošanai
Pirmā lieta, kas jums jāņem vērā, veidojot jūsu iframes, ir.
IFRAME
- pati. Lai gan lielākajā daļā pārlūkprogrammu ir iekļauti iframe bez daudz papildu stilu, tomēr ieteicams pievienot dažus stilus, lai tie būtu konsekventi. Šeit ir daži CSS stili, kurus mēs vienmēr iekļaujam iframes:
starpība: 0;
polsterējums: 0;
apmale: nav;
platums: vērtība;
augstums: vērtība;
Ar.
platums
un.
augstums
iestatiet izmēru, kas atbilst manam dokumentam. Šeit ir piemēri rāmim, kurā nav stilu, un rāmim, kurā tiek veidoti tikai pamati. Kā redzat, šie stili pārsvarā tikai noņem robežu ap iframe, taču tie arī nodrošina, ka visās pārlūkprogrammās šis iframe tiek attēlots ar vienādām malām, pildījumu un izmēriem.HTML5 iesaka izmantot.
pārplūst
rekvizītu, lai noņemtu ritināšanas joslas a
ritināšanas lodziņš, bet tas nav uzticams. Tātad, ja vēlaties noņemt vai mainīt ritjoslas, jums vajadzētu izmantot.ritinot
atribūtu arī uz jūsu iframe. Lai izmantotu.
ritinot
atribūtu, pievienojiet to tāpat kā jebkuru citu atribūtu un pēc tam izvēlieties vienu no trim vērtībām:
Jā
,
Nē
vai.
auto
.
Jā
liek pārlūkprogrammai vienmēr iekļaut ritjoslas, pat ja tās nav vajadzīgas.
Nē
saka noņemt visas ritjoslas pēc nepieciešamības.
auto
ir noklusējums un ietver ritināšanas joslas, kad tās ir nepieciešamas, un noņem, kad tās nav. Lūk, kā izslēgt ritināšanu ar.
ritinot
atribūts: scrolling = "nē">
Tas ir iframe.
Lai izslēgtu ritināšanu HTML5, jums jāizmanto.
pārplūst
īpašums. Bet, kā redzat šajos piemēros, tas vēl nedarbojas droši visās pārlūkprogrammās. Lūk, kā jūs ieslēgtu visu laiku ritināšanu ar.
pārplūst
rekvizīts: style = "overflow: scroll;">
Tas ir iframe.
Tur ir nevar būt lai pilnībā izslēgtu ritināšanu ar.
pārplūst
īpašums. Daudzi dizaineri vēlas, lai viņu iframes sajauktos ar tās lapas fonu, kurā viņi atrodas, lai lasītāji nezinātu, ka iframe ir pat tur. Bet jūs varat arī pievienot stilus, lai tie izceļas. Pielāgot apmales tā, lai iframe būtu redzamāka, ir viegli. Vienkārši izmantojiet.
robežas
stila īpašums (vai tas ir saistīts.
robežas augšdaļa
,
robeža-labā
,
robeža-pa kreisi
, un.
apmale-dibens
īpašības), lai veidotu robežas: iframe {
apmales augšdaļa: # c00 1px dotted;
apmale labajā pusē: # c00 2px dotted;
apmale pa kreisi: # c00 2px dotted;
apmales apakšdaļa: # c00 4px dotted;
}
Bet jums nevajadzētu apstāties ar ritināšanu un stilu robežas. Savam iframe var izmantot daudz citu CSS stilu. Šajā piemērā tiek izmantoti CSS3 stili, lai piešķirtu iframe ēnu, noapaļotus stūrus un pagrieztu to par 20 grādiem.
iframe {
margin-top: 20 pikseļi;
margin-bottom: 30 pikseļi;
-moz-pierobežas rādiuss: 12px;
-webkit-border-rādiuss: 12px;
apmales rādiuss: 12 pikseļi;
-moz-box-shadow: 4px 4px 14px # 000;
-webkit-box-shadow: 4px 4px 14px # 000;
box-shadow: 4px 4px 14px # 000;
-moz-pārveidot: pagriezt (20deg);
-webkit-transformēt: pagriezt (20deg);
-o-pārveidot: pagriezt (20deg);
-ms-pārveidot: pagriezt (20deg);
filtrs: progid: DXImageTransform. Microsoft. BasicImage (rotācija = .2);
}
Iframe satura veidošana
Iframe satura veidošana ir tāpat kā jebkuras citas tīmekļa lapas veidošana. Bet tu jābūt piekļuvei lapas rediģēšanai. Ja nevarat rediģēt lapu (piemēram, tā atrodas citā vietnē).
Ja jūs varat rediģēt lapu, tad dokumentā varat pievienot ārēju stila lapu vai stilus tieši tāpat, kā jūs veidotu jebkuru citu vietnes lapu savā vietnē.