Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [HTML][CSS]Róg strony HTML/CSS
krystianr
post
Post #1





Grupa: Zarejestrowani
Postów: 10
Pomógł: 0
Dołączył: 11.10.2009
Skąd: Zdroje [Wieś]

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


Jak zrobić za pomocą HTML/CSS taki róg zamiast takiego
Go to the top of the page
+Quote Post
kapuch
post
Post #2





Grupa: Zarejestrowani
Postów: 389
Pomógł: 69
Dołączył: 26.04.2010
Skąd: Łódź

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


  1. .okno {
  2. -webkit-border-radius: 10px;
  3. -khtml-border-radius: 10px;
  4. -moz-border-radius: 10px;
  5. border-radius: 10px;
  6. }

Ale to nie dziala w IE, sa tez inne (pewniejsze) sposoby, np. http://blog-lisu.eu/2010/01/29/css3-zaokraglanie-rogow/

Ten post edytował kapuch 4.08.2010, 18:08:34


--------------------
Nie chce "Pomógł", aktualna ilość (69) w pełni mnie satysfakcjonuje :)
Go to the top of the page
+Quote Post
krystianr
post
Post #3





Grupa: Zarejestrowani
Postów: 10
Pomógł: 0
Dołączył: 11.10.2009
Skąd: Zdroje [Wieś]

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


Mi to w ogóle niechce chodzić, daje
Kod
<table class="box">cos tam
cos tam
</table>

i w css daje ten kod to mi nie zaokrągla stylu
Go to the top of the page
+Quote Post
kapuch
post
Post #4





Grupa: Zarejestrowani
Postów: 389
Pomógł: 69
Dołączył: 26.04.2010
Skąd: Łódź

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


1. Jakiej przegladarki uzywasz, bo pisalem ze pod IE to nie dziala
2. Uzywasz prawidlowych naglowkow? Np.
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

3. Nadales tej klasie border? ( border: 1px solid #000; )
4. Pomiedzy <table></table> wypadalo by jeszcze wstawic <tr><td>cos tam</td></tr>

Masz tu kompletnego gotowca, bo wyjdzie szybciej:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4. <title>Zaokraglone rogi</title>
  5. <style type="text/css">
  6. .okno {
  7. border: 1px solid black;
  8. -webkit-border-radius: 10px;
  9. -khtml-border-radius: 10px;
  10. -moz-border-radius: 10px;
  11. border-radius: 10px;
  12. }
  13. </head>
  14.  
  15. <table class="okno">
  16. <tr><td>aaa</td><td>bbb</td></tr>
  17. <tr><td>aaa</td><td>bbb</td></tr>
  18. <tr><td>aaa</td><td>bbb</td></tr>
  19. <tr><td>aaa</td><td>bbb</td></tr>
  20. </body>
  21. </html>

Dziala pod:
- Firefox'em
- Chrome
- Opera

Nie dziala pod IE 8 i starszych.
PS. Pod tymi przegladarkami sprawdzalem, wiec tutaj jestem na 100% pewien, a co do reszty to nie wiem.

Ten post edytował kapuch 4.08.2010, 18:44:58


--------------------
Nie chce "Pomógł", aktualna ilość (69) w pełni mnie satysfakcjonuje :)
Go to the top of the page
+Quote Post
krystianr
post
Post #5





Grupa: Zarejestrowani
Postów: 10
Pomógł: 0
Dołączył: 11.10.2009
Skąd: Zdroje [Wieś]

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


Używam opery

moja strona wygląda tak :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  4. <title>bla bla bla</title>
  5. <link href="http://krystianr.xaa.pl/images/favicon.ico" rel="shortcut icon" type="image/x-icon" />
  6. <link rel="stylesheet" href="krystianr.css" type="text/css">
  7. </head>
  8. <body>
  9. <table width="80%" cellspacing="0" cellpadding="7" border="0" align="center">
  10. <tr>
  11. <td class="bodyline">
  12. <table width="100%" cellspacing="0" cellpadding="8" border="0" align="center">
  13. <tr>
  14. <td>
  15. <img src="images/logo.gif" alt="">
  16. </td>
  17. <td align="center" width="100%" valign="middle">
  18. <span class="maintitle">
  19. phpBB
  20. </span><br>
  21. <span class="gen">
  22. bla bla bla<br><br>
  23. </span>
  24. <table cellspacing="0" cellpadding="2" border="0">
  25. <tr>
  26. <td align="center" valign="top">
  27. <span class="mainmenu">
  28. <a href="o_mnie.php" class="mainmenu"><img src="images/o_mnie.gif" alt="" border="0" height="13" hspace="3" width="12">O mnie</a> 
  29. <a href="oferta.php" class="mainmenu"><img src="images/oferta.gif" alt="" border="0" height="13" hspace="3" width="12">Oferta</a> 
  30. <a href="cennik.php" class="mainmenu"><img src="images/cennik.gif" alt="" border="0" height="13" hspace="3" width="12">Cennik</a> 
  31. <a href="wykonane.php" class="mainmenu"><img src="images/wykonane.gif" alt="" border="0" height="13" hspace="3" width="12">Wykonane Zlecenia</a> <br>
  32. <a href="linki.php" class="mainmenu"><img src="images/linki.gif" alt="" border="0" height="13" hspace="3" width="12">Linki</a> 
  33. <a href="kontakt.php" class="mainmenu"><img src="images/kontakt.gif" alt="" border="0" height="13" hspace="3" width="12">Kontakt</a> 
  34. <a href="poradniki.php" class="mainmenu"><img src="images/poradniki.gif" alt="" border="0" height="13" hspace="3" width="12">Poradniki</a> 
  35. <a href="do_pobrania.php" class="mainmenu"><img src="images/do_pobrania.gif" alt="" border="0" height="13" hspace="3" width="12">Download</a> 
  36. <a href="moje_mody.php" class="mainmenu"><img src="images/opinie.gif" alt="" border="0" height="13" hspace="3" width="12">Moje Modyfikacje</a> 
  37. </span>
  38. </td>
  39. </tr>
  40. </table>
  41. </td>
  42. </tr>
  43. <tr>
  44. <td height="25" align="center" valign="top">
  45. <span class="mainmenu"></span>
  46. </td>
  47. </tr>
  48. </table>
  49. <span class="nav" style="color: rgb(255, 102, 0);">
  50. <a href="index.php" class="nav">phpBB support by krystianr ->  Strona Główna</a>
  51. </span>
  52. <div id="hm" style="display: ''; position: relative;">
  53. <span style="line-height:5px;">
  54. <br>
  55. </span>
  56. <table width="100%" class="forumline" cellspacing="1" cellpadding="3" border="0" class="forumline" align="center">
  57. <tr>
  58. <th class="thCornerL" height="25" class="forumline" style="cursor: pointer" >Strona Główna</th>
  59. </tr>
  60. <tr>
  61. <td class="row1">
  62. <div class="add" align="center">
  63. <b><font size="3" color="green">Z braku czasu nie będę wykonywał żadnych zleceń </font></b><br>
  64. <b>Lista zleceń jakie mogę wykonać</b> : <a href="oferta.php">KLIK</a><br>
  65.  
  66. </div>
  67. </td>
  68. </tr>
  69. </table>
  70. </div>
  71. <div align="center" class="copyright"><br>
  72. Copyright &copy by <b><a href="http://krystianr.xaa.pl">krystianr</a></b> 2010<br>
  73. Styl <b>subSilver</b> modyfikacja by <b><a href="http://krystianr.xaa.pl">krystianr</a></b><br><br>
  74. <a href="http://krystianr.xaa.pl/forum"><font color="green">Forum</font></a><br>
  75. <b>Kopiowanie wszelkich treści zawartych na portfolio bez zgody autora zabronione!</b><br>
  76. <font color="red" size="0">Ostatnia aktualizacja <b>2010-08-04</b></font><br>
  77. <a href="http://www.licznikiodwiedzin.pl" title="Odwiedzin liczniki"><img src="http://www.licznikiodwiedzin.pl/licznik.php?user=krystianr93" alt="Liczniki na stonę" border="0"></a>
  78. <div align="right">
  79. <a href="http://jigsaw.w3.org/css-validator/"><img style="border:0;width:88px;height:31px" src="http://jigsaw.w3.org/css-validator/images/vcss" alt="Poprawny CSS!"></a>
  80. <a href="http://validator.w3.org/check?uri=referer"><img style="border:0;width:88px;height:31px" src="http://www.w3.org/Icons/valid-html401" alt="Poprawny HTML 4.01"></a>
  81. </div>
  82. </center>
  83. </div>
  84. </td>
  85. </tr>
  86. </table>
  87. </body>
  88. </html>


Ten post edytował krystianr 4.08.2010, 18:38:52
Go to the top of the page
+Quote Post
everth
post
Post #6





Grupa: Zarejestrowani
Postów: 782
Pomógł: 153
Dołączył: 21.07.2010

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


Pod normalne przeglądarki używasz regułek CSSa które podał ci @kapuch, pod IE możesz użyć tego (wymaga jQuery i JS).


--------------------
Już mi się ani wiedzieć, ani tym bardziej myśleć nie chce.
[Think different]!
Go to the top of the page
+Quote Post
kapuch
post
Post #7





Grupa: Zarejestrowani
Postów: 389
Pomógł: 69
Dołączył: 26.04.2010
Skąd: Łódź

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


Ciezko cokolwiek powiedziec o tym kodzie, bo nie pokazales css'a, wiec nie wiem co dana klasa soba reprezentuje :]


--------------------
Nie chce "Pomógł", aktualna ilość (69) w pełni mnie satysfakcjonuje :)
Go to the top of the page
+Quote Post
krystianr
post
Post #8





Grupa: Zarejestrowani
Postów: 10
Pomógł: 0
Dołączył: 11.10.2009
Skąd: Zdroje [Wieś]

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


Cytat(kapuch @ 4.08.2010, 19:46:30 ) *
Ciezko cokolwiek powiedziec o tym kodzie, bo nie pokazales css'a, wiec nie wiem co dana klasa soba reprezentuje :]


oto css : http://krystianr.xaa.pl/krystianr.css
Go to the top of the page
+Quote Post
kapuch
post
Post #9





Grupa: Zarejestrowani
Postów: 389
Pomógł: 69
Dołączył: 26.04.2010
Skąd: Łódź

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


Cytat(krystianr @ 5.08.2010, 10:20:52 ) *

No ok, ale gdzie w tym css masz:
Kod
border: 1px solid #000;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;  
-moz-border-radius: 10px;
border-radius: 10px;

questionmark.gif
Bo nie widze, wiec jak ma ci to dzialac?


--------------------
Nie chce "Pomógł", aktualna ilość (69) w pełni mnie satysfakcjonuje :)
Go to the top of the page
+Quote Post
krystianr
post
Post #10





Grupa: Zarejestrowani
Postów: 10
Pomógł: 0
Dołączył: 11.10.2009
Skąd: Zdroje [Wieś]

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


nie mam tego bo robiłem to na localhost
Go to the top of the page
+Quote Post
kapuch
post
Post #11





Grupa: Zarejestrowani
Postów: 389
Pomógł: 69
Dołączył: 26.04.2010
Skąd: Łódź

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


No to ciezko powiedziec cokolwiek, skoro nie wiem gdzie ty to wstawiasz.
Dzialac musi, tzn. ze wstawiasz to zle, badz nie do tej klasy co trzeba i dlatego chcialem zobaczyc kod.


--------------------
Nie chce "Pomógł", aktualna ilość (69) w pełni mnie satysfakcjonuje :)
Go to the top of the page
+Quote Post
krystianr
post
Post #12





Grupa: Zarejestrowani
Postów: 10
Pomógł: 0
Dołączył: 11.10.2009
Skąd: Zdroje [Wieś]

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


tutaj jest demo : http://stronadtestow.ugu.pl/templates/index.php
css : http://stronadtestow.ugu.pl/templates/krystianr.css
Go to the top of the page
+Quote Post
kapuch
post
Post #13





Grupa: Zarejestrowani
Postów: 389
Pomógł: 69
Dołączył: 26.04.2010
Skąd: Łódź

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


No i nie widzisz ze zaokraglilo rogi?
Zaokraglilo, tyle ze wewnatrz jest jeszcze jedna tabela z bez zaokraglania.
Popracuj nad tym, dostales gotowca, teraz to tylko kwestia prob.

PS. Podpowiem tylko, ze zmien nazwe klasy z okno na np. zaokraglanie i dodaj ja do kazdego elementu ktory chcesz zaokraglic.
Nawet jesli ten element ma juz przypisana klase to mozna dodac mu druga poprzez class="pierwszaKlasa drugaKlasa"
Czyli np. class="corner zaokragloneRogi" i wtedy taki element posiada dwie klasy.
Teraz wszystko w Twoich rekach, dostales gotowa klase, nic tylko podstawic ja w odpowiednie miejsce, przeciez nikt nie bedzie Ci przerabial calego szablonu.

Ten post edytował kapuch 5.08.2010, 12:18:59


--------------------
Nie chce "Pomógł", aktualna ilość (69) w pełni mnie satysfakcjonuje :)
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 Aktualny czas: 21.08.2025 - 23:32