Блог

Главная - Вопросы по программированию - Настройка строки и высоты строки с помощью CSS

Настройка строки и высоты строки с помощью CSS

#html #css

#HTML #css

Вопрос:

Я новичок в CSS. Я разработал страницу.Я хочу сделать дизайн таким образом.

изображение

(Щелкните правой кнопкой мыши открыть в новой вкладке)

Я сделал строку заголовка с помощью CSS.Coding, которую я сделал.

 <div id="fourth_page_table1">
    Address Type amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;  nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;Residing From      amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;City amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;State Code amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;Country Codeamp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp; Phone Number amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;amp;nbsp;Cell Number
</div>

<div id="fourth_page_table1_leftlin1">
|
</div>

css

          #fourth_page_table1
           {
           width:900px;
           left:230px;
           top:240px;
           position:absolute;
           font-size:16px;
           background-color:#33CCFF;
           }
        #fourth_page_table1_leftlin1
          {
           left:230px;
           top:240px;
           position:absolute;
           font-size:70px;
           height:20px;
           width:10px;
           line-height:100%;
         }

После выполнения этого кодирования выходные данные не поступают должным образом.

      Please check my output.      
         [1]: http://i.stack.imgur.com/oDmTF.jpg

Левую строку я хочу установить слева и в тонком формате.
Как сделать длинную линию вертикально, чего я не могу сделать?
Я пробовал использовать высоту строки, но я не получаю правильного результата в соответствии с моим приведенным выше рисунком.
Как решить эту проблему?

Комментарии:

1. где здесь javascript? Не добавляйте ненужные теги.

2. с какой частью у вас возникли проблемы?

3. Пожалуйста, проверьте мой вывод, изобразите левую строку, которую я хочу установить как первую цифру . Как сделать леску тоньше и длиннее ? Что я не понимаю?

4. @Cool: это неправильный способ, откажитесь от него и используйте способ, предложенный в ответе pctr.

Ответ №1:

Для создания таблиц вы должны использовать элемент table .

После того, как у вас будет таблица, вы можете добавить границу с помощью css следующим образом:

 table {
    border: 1px solid #000000;
}

Конечно, вы можете указать свою собственную ширину, стиль линий и цвет границы.

Кроме того, пожалуйста, избегайте добавления отступов через amp;nbsp; символы. Это затрудняет чтение вашей разметки и, как правило, является плохой практикой. Вместо этого используйте css padding и margin правила.

Метки: