Jump to content

SUBIECTE NOI
« 1 / 5 »
RSS
Info Coronavirus/Vaccinare vs Fake News

La multi ani @TheSignMetro64!

Exista firme DDD dezinsectie Bucu...

Masina noua - plata finala
 Laptop 17" - baterie buna

Uree 239 analize catel

Programare Sala Tulcea

Tensiune mica Smart Forfour 2017
 Reglaj a

Desparțire de sotie

Problema combina frigorifica

Persoanele care nu se scalda (in ...
 Redmi K50 in Reteaua Digi

Revolut x Vodafone - Obține ...

Cade internetul la platformele St...

Rulouri de aluminiu DIY
 

Cum pot integra în paginile html 2 stiluri CSS diferite pentru 2 imagini diferite, ambele fiind separate vertical printr-un spațiu?

- - - - -
  • Please log in to reply
9 replies to this topic

#1
me_suzy

me_suzy

    Member

  • Grup: Members
  • Posts: 592
  • Înscris: 29.04.2007
salut prieteni. Cum pot integra într-o pagina html 2 stiluri CSS diferite pentru 2 imagini diferite, ambele fiind separate printr-un spațiu vertical (una sub alta) ?

Uitati-va la tablourile de mai jos. Au dimensiuni diferite, stiluri diferite. Asta nu stiu cum sa fac in css.

Attached Files



#2
miki07

miki07

    Simplu și banal

  • Grup: Senior Members
  • Posts: 14,548
  • Înscris: 18.09.2008
ID-uri diferite in CSS?

#3
GaBogdan

GaBogdan

    Member

  • Grup: Members
  • Posts: 621
  • Înscris: 02.09.2020
Daca am inteles bine intrebarea.   Prin Id sau clasa diferita
<img id="firstImg" scr="" alt="" />
<img id="secondImg" scr="" alt="" />

Si in css:
#firstImg{
width: 500px;
}

#secondImg{
width: 200px;
}

Edited by GaBogdan, 10 February 2022 - 11:26.


#4
me_suzy

me_suzy

    Member

  • Grup: Members
  • Posts: 592
  • Înscris: 29.04.2007

View PostGaBogdan, on 10 februarie 2022 - 11:24, said:

Daca am inteles bine intrebarea.   Prin Id sau clasa diferita

nu stiu css, acum invat. Dar ID sau CLASS, imi poate arata cineva in cod cum se fac ambele variante ?

#5
GaBogdan

GaBogdan

    Member

  • Grup: Members
  • Posts: 621
  • Înscris: 02.09.2020

View Postme_suzy, on 10 februarie 2022 - 11:25, said:


nu stiu css, acum invat. Dar ID sau CLASS, imi poate arata cineva in cod cum se fac ambele variante ?
Dada, da-mi te rog 5 minute si iti trimit link pentru adaugare css in html, id, clasa

#6
miki07

miki07

    Simplu și banal

  • Grup: Senior Members
  • Posts: 14,548
  • Înscris: 18.09.2008
https://codepen.io/miki07/pen/JjONWaQ

Asa ceva?

#7
Bogdan__26

Bogdan__26

    Junior Member

  • Grup: Junior Members
  • Posts: 39
  • Înscris: 26.01.2016
Uite exemplu acesta: https://jsfiddle.net/Ln3y0bz7/
Dacă vrei dimensiuni diferite imaginile trebuie să fie de dimensiuni diferite iar dacă vrei stiluri diferite le poți pune într-un div și le poți targeta folosind :first-child, :last-child, :nth-child() sau cum a spus colegul mai sus prin clase sau id-uri diferite.

#8
GaBogdan

GaBogdan

    Member

  • Grup: Members
  • Posts: 621
  • Înscris: 02.09.2020
Ai indexul html, langa el mai creezi un fisier numit style.css de exemplu unde o sa tii tot css-ul. E mult mai ok decat css inline.
Pentru a "lega" fisierul style.css cu index.html, in head, scrii <link rel="stylesheet" href="style.css">  ( daca pui style.css in alt folder trebuie sa ai grija la path, exact ca si la imagini. ) https://www.w3school...s/css_howto.asp
Pentru a stiliza o imagine, un div, un p etc etc. Folosesti atributuri precum "id" sau "class"  https://www.w3school...tml_classes.asp
Pentru a folosi class: <img class="myClassDeExemplu" scr="" alt="" />
iar in css clasa se targheteaza asa:
.myClassDeExemplu{
// ce stil vrei tu sa aplici aici
width: 300px;
}

Pentru a folosi id: <img id="myID" scr="" alt="" />
iar in css clasa se targheteaza asa:
#myID{
// ce stil vrei tu sa aplici aici
width: 600px;
}

Am incercat sa fac un scurt si utli rezumat, sper sa ajute.

Edited by GaBogdan, 10 February 2022 - 11:43.


#9
me_suzy

me_suzy

    Member

  • Grup: Members
  • Posts: 592
  • Înscris: 29.04.2007
multumesc GaBogdan si Miki07

da, asa ceva. Testez si vad cum merg amandoua variantele. Thanks !!

.picture, .leftPicture, .rightPicture {
	border: 2px dotted gray;
	width: 200px;
}
.leftPicture {
	float:left;
}
.rightPicture {
	float:right;
}


mai ulte raspunsuri se pot gasi aici: https://stackoverflo...ges-differently

#10
GaBogdan

GaBogdan

    Member

  • Grup: Members
  • Posts: 621
  • Înscris: 02.09.2020
Iti sugerez sa te mai uiti peste https://www.w3school...ls.com/  html si css
Pentru inceput, acopera destul de multe chestii.
Daca te mai pot ajuta cu ceva, nu ezita sa lasi un pm.
Succes!

Anunturi

Chirurgia cranio-cerebrală minim invazivă Chirurgia cranio-cerebrală minim invazivă

Tehnicile minim invazive impun utilizarea unei tehnologii ultramoderne.

Endoscoapele operatorii de diverse tipuri, microscopul operator dedicat, neuronavigația, neuroelectrofiziologia, tehnicile avansate de anestezie, chirurgia cu pacientul treaz reprezintă armamentarium fără de care neurochirurgia prin "gaura cheii" nu ar fi posibilă. Folosind tehnicile de mai sus, tratăm un spectru larg de patologii cranio-cerebrale.

www.neurohope.ro

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Forumul Softpedia foloseste "cookies" pentru a imbunatati experienta utilizatorilor Accept
Pentru detalii si optiuni legate de cookies si datele personale, consultati Politica de utilizare cookies si Politica de confidentialitate