Loading...
casper2020 avatar casper2020 1 Точки

универсален селектор *{margin: auto; padding: auto;}

Здравейте на всички. Интересувам се от уебдизайн, защото това за мен е много добра алтернатива.  Видях курса по уеб дизайн и ме заинтригува  и все още проявявам голям интерес.

Та да си дойда на думата: снощи имах възможността да изгледам две лекции за уебдизайн и втората беше много интересна за CSS основи. в нея се споменаваше за това как да се използва * и в каквави случаи само.

Често при правенето на по семпли страници използвам следното ето и самия css:

 

*{
margin: auto;
padding: auto;
}

body{
background-color: #333;

}

#main{
max-width: 960px;
min-width: 940px;
margin: 0 auto;
padding: auto;
}

#navbar{
width: 940px;
height: 40px;
background-image: url(images/navbar.png);
clear: both;
margin-top: 10px;
}

#menu {
float: left;
margin-left: -6px;
padding: 6px;
position: relative;
margin-top: -45px;
}

#contain{
margin-top: 10px;
clear: both;
width: 940px;
height: 850px;
background-image: url(images/contain.png);
position: relative;
}

#container{
width: 750px;
height: 650px;
background-color: #eee;
float: right;
margin-top: -750px;
margin-right: 15px;
z-index: 1;
position: relative;
}

#container p{
padding: 25px;
font: 14pt Arial oblique normal;
color: #333;
text-align: justify;
}

#footer{
margin-top: 10px;
clear: both;
width: 940px;
height: 40px;
background-image: url(images/footer.png);
position: relative;

}
a:link, a:visited{
color: purple;
text-decoration: none;
}

a:active, a:hover{
color: orange;
text-decoration: none;
}

за нарязването на шаблона или  правенето на парчета от шаблона съм ползвал GIMP/Inkscape и за "кодирането" в HTML/CSS съм използвал Bluefish Editor. Ползвам Linux Ubuntu Studio

Надявам се, че това не е никакъв проблем, но искам да знам дали това, което съм написал е правилно, чел съм книги за HTML/CSS на издателство SitePoint:

jump start css, jump start html както и други подобни книги. 

надявам се, че тук мога да намеря помощ от добронамерени специалисти. по принцип желая да си намеря и работа, но явно имам още много хляб да "ям". но с търпение и пстоянство всичко се постига.

бих желал да видите една моя лична страница, и да ми кажете/ да ме посъветвате как да я направя да "грабне" окото на клиента. тя е много семпла, а аз искам да наблегна върху семплия дизайн, който ще бъде удобен за потребителя. Благодаря Ви предварително.

P.S.:Ето личната ми семпла страница: http://jasper2020.ucoz.com/index.html, за навигация на бутоните съм ползвал adobe dreamweaver под windows xp, на виртуална машина virtualbox.

 

 

1
Web Fundamentals - HTML5
HPetrov avatar HPetrov 822 Точки

Като цяло всичко ми изглежда окей с изключение на няколко забележки. Първо ще ти препоръчам да не ползваш * за ресетване -> по-бавно работи ако просто селектираш всички елементи, които ползваш. Също така не мисля, че margin/padding: auto е добро решение. Когато се ресетват пропертитата просто им се дава по една 0 и после сам си подреждаш всичко както искаш. Към ресеторите може да добавяш и list-style-type: none ако ползваш списъци.

Второ. По-добре ползвай класове вместо id-та. В смисъл на това, че id се ползва предимно за JavaScript. Аз лично ползвам за момента само 1 id и то само на главния ми wrapper контейнер.

Последната ми забележка е към #container. Виждам, че му даваш -750px margin-top. Не знам къде по принцип в DOM дървото ти се намира този контейнер, но щом за да го позиционираш където искаш му задаваш толкова много, че и отрицателен margin значи явно не му е там мястото. Пробвай да го сложиш по-нагоре в кода си. По-принцип избягвай отрицателните margin-и и padding-и защото чупят концепцията за box модела (-5/-10px не е болка за умиране).

Страницата, към която си дал линк не я показжа -> 404 ;) Забелязах, че споменаваш Dreamweaver. Ами... ако го ползваш да ти пише кода, по добре си го напиши сам. Ако го ползваш за тестване на дизайни, няма проблем.

И последно... напъвай се здраво, има много материали за Web development из нета. Чети, гледай видеа, прави упражнения и в последствие ще усетиш как малко по малко ти се получават по-добре и по-добре нещата. И накрая не забравяй да вхърлиш едно око поне и на JavaScript, този жълт непослушник. Без него освен един готино изглеждащ статичен сайт няма как да направиш нещо повече.

Успех! ;)

4
Можем ли да използваме бисквитки?
Ние използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Можете да се съгласите с всички или част от тях.
Назад
Функционални
Използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Използваме „сесийни“ бисквитки, за да Ви идентифицираме временно. Те се пазят само по време на активната употреба на услугите ни. След излизане от приложението, затваряне на браузъра или мобилното устройство, данните се трият. Използваме бисквитки, за да предоставим опцията „Запомни Ме“, която Ви позволява да използвате нашите услуги без да предоставяте потребителско име и парола. Допълнително е възможно да използваме бисквитки за да съхраняваме различни малки настройки, като избор на езика, позиции на менюта и персонализирано съдържание. Използваме бисквитки и за измерване на маркетинговите ни усилия.
Рекламни
Използваме бисквитки, за да измерваме маркетинг ефективността ни, броене на посещения, както и за проследяването дали дадено електронно писмо е било отворено.