How do you combine CSS and HTML in a text editor(I use notepad), to make a good webpage? | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 12

How do you combine CSS and HTML in a text editor(I use notepad), to make a good webpage?

When I try, it just messes it up.

4th Dec 2016, 2:34 PM
Möbius
Möbius - avatar
56 Answers
+ 19
Use Sublime text editor, Notepad++ or Brackets these tools gives you tones of easy way to work around web development also you can use built-in snippets , plugins, multiple cursor feature give you speed while making any css or html file. For structuring files please follow web standards for making web page runs more smoother , i think defining sperate file for css and html would be good because it's going to save lot of your time while making another project with same styling. Reuse your work in such a way it gives productivity.
5th Dec 2016, 5:33 PM
Vipul Walia
Vipul Walia - avatar
+ 12
Dreamweaver is a text editor code dude :) . By the way... I actually use "sublime text 3" and it works really good for me but you have to install a plugin called "Emmet" to work faster with sublime #mylove jaja
5th Dec 2016, 9:30 PM
Iris Ailed Ramos Vivas
Iris Ailed Ramos Vivas - avatar
+ 10
So the good idea is divide HTML and CSS into a different files. Not to use CSS to design "on fly and on the place" in a particular HTML elements, but like "a style". So, at first design a styles in CSS for a supposed cases, and after only in the HTML elements assign the right CSS style with a class or id name.
4th Dec 2016, 7:20 PM
Petr Hatina
Petr Hatina - avatar
+ 5
it is not src but href. <link rel="stylesheet" type="text/css" href="style.css">
4th Dec 2016, 7:22 PM
caps
+ 5
<!DOCTYPE html> <html> <head> <linkrel="stylesheet"type="text/css"href="mystyle.css"> </head> <body> <h1>This is a heading</h1> <p>This is a paragraph.</p> </body>
7th Dec 2016, 2:22 AM
Dhiraj singh✔️
Dhiraj singh✔️ - avatar
+ 4
in html <html> <head> <link rel="stylesheet" href="yourfilecss.css" type="text/css" /> </head> ....
7th Dec 2016, 3:03 AM
Fardony Rozi Saputra
Fardony Rozi Saputra - avatar
+ 4
You can use Notepad++ it's totally free just download it on windows or mac. Notepad++ give you the visual difference between various tag or code even if you do something wrong you get notified by its color. You can download it from here https://notepad-plus-plus.org/repository/7.x/7.2.2/npp.7.2.2.Installer.x64.exe keep learning!
15th Dec 2016, 6:24 PM
Swarnab Das
Swarnab Das - avatar
+ 3
To make a good web page you need two files: One .html file where your objects are stored and a .css where your style is stored. This won't mess up your web page. In the head of your html file you include your external stylesheet with: <link href="yourstyle.css" rel="stylesheet">
4th Dec 2016, 4:23 PM
Patrick G.
Patrick G. - avatar
+ 2
What about classes?
5th Dec 2016, 2:32 AM
Möbius
Möbius - avatar
+ 2
you could use <style> </style> inside head* tag but they are not good practices ... the best way to do that is creating 2 files (one for .html and the other for .css) n_n
5th Dec 2016, 9:13 PM
Iris Ailed Ramos Vivas
Iris Ailed Ramos Vivas - avatar
+ 2
Notepad++ most help you to make a good webpage.
12th Dec 2016, 8:33 AM
1971 • Anas
1971 • Anas - avatar
+ 1
Thank you!
4th Dec 2016, 7:14 PM
Möbius
Möbius - avatar
+ 1
+1 for NPP
5th Dec 2016, 5:57 PM
Cédric Mersch
Cédric Mersch - avatar
+ 1
What's Dreamweaver?
5th Dec 2016, 5:57 PM
Möbius
Möbius - avatar
+ 1
Try other editors i use brackets.io
5th Dec 2016, 6:27 PM
Dhruv Saxena
Dhruv Saxena - avatar
+ 1
bro just link it to your HTML head add <link rel="stylesheet" type="text/css" href="style.css"> in the head of your html page then you are ready to go....
6th Dec 2016, 3:43 PM
Haider Ali
Haider Ali - avatar
+ 1
aim make aide web.apk with android
6th Dec 2016, 9:10 PM
Engkungs
Engkungs - avatar
+ 1
aim make aide web.apk with android
6th Dec 2016, 9:10 PM
Engkungs
Engkungs - avatar
+ 1
in html head section <head> <link rel="stylesheet" type="text/css" href="style.css"> </head> .....html body
7th Dec 2016, 2:08 AM
Dhiraj singh✔️
Dhiraj singh✔️ - avatar
+ 1
I agree with @Petr Hatina and @Vipul Walia. You should use Notepad++ or Sublime, I worked with both for several time, and they was very good. The advantage to use Sublime its because you can use on Linux also. Regarding the split html and css code in different files, its totally necessary to turn the code scalable and reusable. Follow a example made by me with the HTML and CSS in diff files. http://www.sololearn.com/app/sololearn/playground/WHd4T9iCZKRI/
7th Dec 2016, 3:37 AM
Renan Peliçari
Renan Peliçari - avatar