Как вы планируете размещать страницу в VS2010 без использования таблиц?

Я использую .NET с бета-версии и HTML с тех пор, как в блокнот HotDog pro &, используя, конечно, табличное расположение. Я НАКОНЕЦ готов использовать только div, li, CSS для макета, но мой вопрос в том, каков правильный способ компоновки страниц в VS2010?Как вы планируете размещать страницу в VS2010 без использования таблиц?

Когда я использую раскладку таблицы, ее простое и я могу визуально видеть, что создает im и где находятся элементы, такие как пример ниже - как мне это сделать с помощью div и т. Д. В VS2010?

<table width="300" border="0" cellpadding="5"> 
    <tr> 
    <td><img src="http://assets.devx.com/MS_Azure/azuremcau.jpg" alt="blah" width="70" height="70" /></td> 
    <td><h2>This is some text to the right of the picture...</h2></td> 
    </tr> 
    <tr> 
    <td colspan="2">Here some text underneath</td> 
    </tr> 
</table>

источник

2010-12-31 CrustyApple

Что вы хотите узнать, это CSS-поплавок и модель коробки. Я не специалист по CSS, поэтому не знаю, что вам сказать. – jcolebrand

Im надеясь не отступать ко времени кодирования в «Блокноте» и использовать инструменты (например, VS, Dreamweaver) для компоновки страниц. Быстро без необходимости указывать верхний и левый для каждого элемента (если это возможно) – CrustyApple

Я думаю, Dreamweaver является одним из лучших инструментов WYSIWYG с точки зрения не вставки тонны HTML-файла нежелательной почты. У меня есть несколько «HTML-программистов», которые используют это. – dana

Я бы сказал, что вы должны узнать о Css и использовать divs и т. Д. На страницах макета. По-моему, вы не должны использовать WYSIWYG и писать разметку с нуля, это так же быстро, если вы знаете, как это сделать. Или, если вам нужна хорошая базовая среда CSS для работы с макетом в виде сетки, попробуйте 960 Grid System.

Что касается того, что вы делаете, я бы сказал, что используйте самые простые. откройте сайт в веб-браузере и нажмите «Обновить».

источник

2010-12-31 09:51:13 Beijer

+1 Ничего не сказал! –

Вот пример главной страницы в ASP.NET MVC, который использует Blueprint CSS framework.

Он имеет два столбца рядом друг с другом под нижним колонтитулом.

<%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
      <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> 

    <head runat="server"> 
     <title><asp:ContentPlaceHolder ID="TitleContent" runat="server" /></title> 

     <asp:ContentPlaceHolder ID="MetaDescription" runat="server" > 
     </asp:ContentPlaceHolder> 

     <asp:ContentPlaceHolder ID="MetaKeywords" runat="server"> 
     </asp:ContentPlaceHolder> 

     <meta http-equiv="Content-type" content="text/html;charset=UTF-8" /> 


     <asp:ContentPlaceHolder ID="HeadContent" runat="server"/> 

    </head> 

    <%=Html.Flash() %> 

    <body> 
     <div id="flash" style="display:none"></div> 

     <div class="container"> 

      <div id="main" class="span-24 last"> 

       <div class="span-5"> 

        <div id="logo"> 

        </div> 

        <% Html.RenderAction("MainMenu", "Cms"); %> 

       </div> 


       <div class="span-19 last"> 

        <div id="headerTekst"> 
         <div class="padding-30"> 
          <h1 class="right uppercase">Some text</h1> 
         </div> 
        </div> 

        <div class="padding-10"> 
         <asp:ContentPlaceHolder ID="MainContent" runat="server" /> 
        </div> 
       </div> 

       <div class="clear"></div> 
      </div> 



      <div id="footer" class="span-24 last"> 

      </div> 
    </div> 


    </body> 

    </html>

источник

2010-12-31 10:12:09 Roger

Чтобы написать html-код, вы совершенно не должны использовать Visual Studio. Используйте вместо этого Dreamweaver.

Когда при разработке макета страницы вы получите гораздо лучший инструмент с Dreamweaver от Adobe, используя дизайн, чем с помощью Visual Studio.

только, когда пришло время, чтобы запрограммировать страницу, чтобы сделать его динамичным, когда вы должны открыть IDE и писать код.

источник

2010-12-31 10:27:12

Нет причин не использовать Visual Studio при кодировании HTML/CSS, он отлично справляется. –

Для макета я использую Firefox с плагином FireBug. Это дает вам обратную связь в режиме реального времени. Это не улучшается. Как только я нахожу изменение, я копирую изменение в html или css в проекте.

Программы WYSIWYG в порядке. Это я узнал. Как и все остальное, в конце концов вы захотите узнать, что происходит под капотом.

источник

2010-12-31 10:38:14

Если вам нужно использовать браузеры, поддерживающие HTML 4.01, то перейдите к div, но если ваши макеты станут слишком сложными, вы в конечном итоге попадете в плен к div soup и понимаете свою разметку, и внесение изменений станет громоздким.

Если вы можете использовать современные браузеры, поддерживающие HTML 5 (или добавить различные hacks, чтобы заставить его работать), я бы пошел по этому маршруту, так как ваша разметка будет иметь более смысловое значение и будет легче понять.Вместо того, чтобы сделать сча вроде этого:

<div class="nav"> 
    <ul> 
     <li>Home</li> 
     <li>About</li> 
    </ul> 
</div>

Вы можете использовать HTML5, чтобы:

<nav> 
    <ul> 
     <li>Home</li> 
     <li>About</li> 
    </ul> 
</nav>

Или, если вы расклеивали блоги вместо того, чтобы сделать это:

<div class="post"> 
<h1>Example Blog Post</h1> 
    <div class="entry"> 
     <p>Blog text goes here...</p> 
    </div> 
    <div class="entryFooter"> 
     <p> Posted in example category.</p> 
    </div> 
</div>

Вы бы написать это примерно так:

<article> 
    <header> 
     <h1>Example Blog Post</h1> 
    </header> 
    <p>Blog text goes here...</p> 
    <footer> 
     <p>Posted in example category.</p> 
    </footer> 
</article>

As вы можете видеть, что это намного легче понять и по-прежнему дает структуру, которую вы ищете для таблиц.

Чтобы разместить все, как хотелось бы, я бы использовал CSS3, но опять же, если вам нужно поддерживать старые браузеры, используйте CSS2.

Чтобы сделать это в VS2010, просто откройте страницы .aspx или .ascx и начните писать разметку. Я нахожу такие продукты, как Dreamweaver, для создания разметки мусора при использовании дизайнерского интерфейса, поэтому лучше всего написать его вручную.

Кроме того, если вы перейдете по пути HTML5 и хотите, чтобы intellisense в VS2010, для него это addon.

источник

2010-12-31 18:02:02 amurra

Как вы планируете размещать страницу в VS2010 без использования таблиц?

ответ

Смежные вопросы