Раньше писал HTML&CSS в PyCharm, но в нём не удобно писать CSS т.к. он поддерживает только его синтаксис и не помогает в написании самого кода. Поэтому я решил перейти на Sublime Text 3, но столкнулся с данной проблемой: тот же самый код в IDE PyCharm если нажимаешь на кнопку 'открыть в браузере', то всё работает так как нужно:
Но если тот же код запустить в Sublime Text 3, то сайт работает без CSS:
Вот сам код:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="\NIsite\CSS\style.css"/>
<title>Ni site</title>
</head>
<body>
<form action="#" method="get">
<div class="marleft">
<p><b>
Привет
</b></p>
</div>
<div>
<p><b>
Заполни данную форму:
</b></p>
</div>
<div class="inter">
<p><b>Имя</b></p>
</div>
<div>
<input placeholder="Введите имя" type="text" name="username">
</div>
<div class="inter">
<p><b>Пароль</b></p>
</div>
<div>
<input placeholder="Введите пароль" type="password" name="userpass">
</div>
<div class="inter">
<p><b>Телефон</b></p>
</div>
<div>
<input placeholder="Введите номер" type="tel" name="userphone">
</div>
<br>
<br>
<div>
<button class="marleft" type="submit">Отправить</buttonclass>
</div>
</form>
<!-- <div><img src="\NIsite\img\nevermore.png" alt="("></div> -->
<form action="&" method="get">
<div>
</div>
</form>
</body>
</html>
CSS
*{
padding: 0;
margin: 0;
border: 0;
}
body {
font-family:FreeMono, monospace;
}
.inter{
margin-left: 30px;
color: blueviolet;
}
*,*:before,*:after{
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
:focus,:active{outline:none;}
a:focus,a:active{outline:none;}
nav,footer,header,aside{display: block;}
html,body{
height: 100%;
width: : 100%;
font-size: : 100%;
line-height: : 1;
font-size: : 16px;
-ms-text-size-adjust: 100%;
-moz-text-side-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
input,button,textarea{
font-family: FreeMono, monospace;
}
input::-ms-clear{display: none;}
button{cursor:pointer;}
button::-moz-focus-inner {
padding: 0;border: 0;
}
a, a:visited{text-decoration: none;}
a:hover{text-decoration: none;}
ul li{list-style: none;}
img{vertical-align: top;}
h1,h2,h3,h4,h5,h6{font-size: inherit;font-weight: 400;}
.marleft{
margin-left: 30px;
}
Из-за этой проблемы максимально неудобно работать, потому что что-бы запустить файл мне нужно запускать 2 компилятора (Sublime и PyCharm) в первом из них работать а с другого я запускаю сайт и PyCharm просто нагружает комп и переключатся между множеством вкладок через alt+tab , когда их ещё больше - мне не подуше.