Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [HTML][CSS]img src - rozciąganie obrazka
michalsaa
post 18.05.2016, 14:34:04
Post #1





Grupa: Zarejestrowani
Postów: 10
Pomógł: 1
Dołączył: 7.03.2016

Ostrzeżenie: (0%)
-----


Witam.
Czy jest jakiś sposób aby zmusic obrazek wstawiony w html czyli :

Kod
<img src="obrazek.jpg">

tak aby rozciągał się na szerokość na 100% ? Wiem jak zrobić to w background. Niestety nie mogę tego tak zrobić bo cms (joomla obrazek artykułu) do którego chcę coś takiego zrobić w szablonie, wstawia obrazek jako img. Czy jest na to jakiś sposób ?
Go to the top of the page
+Quote Post
Arcioch
post 18.05.2016, 14:51:34
Post #2





Grupa: Zarejestrowani
Postów: 324
Pomógł: 110
Dołączył: 18.09.2012

Ostrzeżenie: (0%)
-----


W stylach dodaj aby zdjęcie w artykule miało width: 100% oraz display: block.
Czyli:

  1. #id_albo_klasa_do_artykułu img{
  2. display: block;
  3. width: 100%;
  4. }
Go to the top of the page
+Quote Post
michalsaa
post 18.05.2016, 20:15:42
Post #3





Grupa: Zarejestrowani
Postów: 10
Pomógł: 1
Dołączył: 7.03.2016

Ostrzeżenie: (0%)
-----


O to chodziło. Pięknie dziękuję.
Zadam jeszcze jedno pytanie. Czy jest możliwość ustawienia wysokości takiego obrazka w % ? Bo jak daję np 50% to nic się nie zmienia. Dopiero jak dam w px.

Ten post edytował michalsaa 18.05.2016, 20:18:50
Go to the top of the page
+Quote Post
sloenthran
post 19.05.2016, 09:04:26
Post #4





Grupa: Zarejestrowani
Postów: 16
Pomógł: 2
Dołączył: 26.06.2013

Ostrzeżenie: (0%)
-----


Cytat(michalsaa @ 18.05.2016, 21:15:42 ) *
O to chodziło. Pięknie dziękuję.
Zadam jeszcze jedno pytanie. Czy jest możliwość ustawienia wysokości takiego obrazka w % ? Bo jak daję np 50% to nic się nie zmienia. Dopiero jak dam w px.


Dodaj sobie jeszcze do stylu poniższy kod i powinno Ci działać smile.gif

  1. html {
  2. height: 100%;
  3. }
  4.  
  5. body {
  6. height: 100%;
  7. }
Go to the top of the page
+Quote Post
michalsaa
post 19.05.2016, 22:57:18
Post #5





Grupa: Zarejestrowani
Postów: 10
Pomógł: 1
Dołączył: 7.03.2016

Ostrzeżenie: (0%)
-----


Zrobiłem jak piszesz ale dalej bez zmian. Chodzi mi tylko oto aby obrazki były równe na wysokość, więc należało by jakąś stałą określić. Tylko, że przy responsywnym szablonie nie mogę użyć pixeli.

Ten post edytował michalsaa 19.05.2016, 22:57:43
Go to the top of the page
+Quote Post
Arcioch
post 20.05.2016, 08:48:22
Post #6





Grupa: Zarejestrowani
Postów: 324
Pomógł: 110
Dołączył: 18.09.2012

Ostrzeżenie: (0%)
-----


Jedyne co mi przychodzi do głowy to takie coś smile.gif
https://jsfiddle.net/t6j405hh/3/
Trzeba założyć, że max-height to wysokość najmniejszego obrazka.
Go to the top of the page
+Quote Post
michalsaa
post 21.05.2016, 00:43:42
Post #7





Grupa: Zarejestrowani
Postów: 10
Pomógł: 1
Dołączył: 7.03.2016

Ostrzeżenie: (0%)
-----


Wygląda na to, że wszystko działa smile.gif Dodałem tylko width: 100% aby rozciągało się na całą szerokość.
Jeszcze raz wielkie dzięki.
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 25.04.2025 - 08:24