-
Вебмастеру
(
http://forum.oszone.net/forumdisplay.php?f=22)
| alleclf |
27-05-2008 10:53 811713 |
Как перенести данные в CSS
Есть такой код:
HTML код:
<TABLE style="BORDER-RIGHT: #000000 0px solid; BORDER-TOP: medium none; BORDER-LEFT: #000000 0px solid; BORDER-BOTTOM: #000000 0px solid" cellSpacing=0 cellPadding=0 width="99%" align=center bgColor=#8F929C>
Этот код несколько раз (достаточно часто) встречается на страничке, как мне его перенести в CSS?
Спасибо. |
| bruder |
27-05-2008 11:46 811746 |
вы уже написали inline-css, хотя не совсем правильно. Лучше вынести из в тег style в heder
Код:
<html>
<head>
<style type="text/css">
table{
border-right: 1px black solid;
border-left: 1px black solid;
border-bottom: 1px black solid;
background:#cfc;
}
</style>
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0" width="99%" align="center">
<tr>
<td>gdf</td>
<td>dfg</td>
</tr>
</table>
</body>
</html>
или создать отдельный css файл и там прописать стили, а потом в хедере вставить
<link rel="stylesheet" href="my.css"> |
| alleclf |
27-05-2008 11:54 811754 |
А можно все перенести во внешний файл, что бы осталось только то что меняется:
HTML код:
<table border="0" width="99%">
|
| Arrest |
27-05-2008 19:42 812115 |
HTML код:
<table cellpadding="0" cellspacing="0" border="0" width="99%" align="center">
=>
HTML код:
<html>
<head>
<style type="text/css">
table{
border-right: 1px black solid;
border-left: 1px black solid;
border-bottom: 1px black solid;
background:#cfc;
padding: 0px;
margin: 0px;
text-align: center;
border-collapse: collapse; /* возможно */
}
</style>
</head>
<body>
<table border="0" width="99%">
<tr>
<td>gdf</td>
<td>dfg</td>
</tr>
</table>
</body>
</html>
|
| Coutty |
27-05-2008 19:52 812122 |
alleclf, внешний файл (скажем, style.css) представляет собой просто перечисление стилей:
HTML код:
table{
border-right: 1px black solid;
border-left: 1px black solid;
border-bottom: 1px black solid;
background:#cfc;
padding: 0px;
margin: 0px;
text-align: center;
border-collapse: collapse; /* возможно */
}
и подключается так:
HTML код:
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<table border="0" width="99%">
<tr>
<td>gdf</td>
<td>dfg</td>
</tr>
</table>
</body>
</html>
|
| bruder |
27-05-2008 19:52 812123 |
не совсем верно, хотя я тоже думал перенести все в css. Дело в том что text-align: center; центрирует инлайн элементы внутри элемента, а align="center" центрирует саму таблицу внутри элемента. :drug:
|
| Coutty |
27-05-2008 20:34 812150 |
Цитата:
Цитата bruder
Дело в том что text-align: center; центрирует инлайн элементы внутри элемента, а align="center" центрирует саму таблицу внутри элемента. »
|
Можно мне тоже :drug:?
Я для центрирования элементов обычно использую тэг <center>, хотя в пятом HTML от него отказались. Или же <div style="width:100%; text-align:center;">.
Насчёт align="center" уже и не припомню. Вроде бы года три назад, когда про CSS ещё ничего не знал, пользовался этим и вполне успешно. Или нет?)
Со временем простые методы забываются... Это даже видно по распространённости страниц весом под 200 КБ чистого html. |
| bruder |
27-05-2008 20:48 812164 |
:) Это я к тому что по идее нельзя центрировать таблицу в диве с text-align:center; Только "хитроумный" ie пытается всех удивить такой возможностью. FF и Opera правильно отображают такой пример
Код:
<html>
<head>
<style type="text/css">
table{
background:#cfc;
/*margin: auto;*/
}
div{
height: 100px;
text-align: center;
border: 1px solid black;
}
</style>
</head>
<body> <div>
<table cellpadding="0" cellspacing="0" border="0" width="30%">
<tr>
<td>gdf</td>
<td>dfg</td>
</tr>
</table>
</body>
</html>
если например расскоментировать margin:auto то центрирование происходит, это один метод из многих :drug: |
Время: 11:46.
© OSzone.net 2001-
