Home > Developer > Web Develop
From the first semester contact, until this year, and Html+css is known for many years, the old pot friends , recently some know the pot friend, the classmate said is want to learn the front end, oneself also began slowly stop footsteps, no longer desperately to learn a lot of framework things, return to the foundation, slowly put the foundation to fight
A lot of knowledge fragments have been too late to tidy up, this blog did not say a lot, which tags how to use Ah, CSS style properties, property values are not mentioned
The first time to write a blog, writing is very fragmented, not very strong organizational
Html+css
Html+css development, dating back to the ancient times browser war, until now the prevalence of HTML5, html+css where they come from, how to, who launched, what appeared, can be used to do, how to use, five w+ an H learning mode;
Html+css+javascript is, we are generally called structure, style, behavior, when we make page layout, usually think of structure and style separation, so that we have the structure of the entire page, as well as the layout will have a clear concept, not in the maintenance and modification of the time, I don't know where to begin.
The Code comment Browser does not parse, usually skips, comments are not just for yourself, sometimes the next kid's shoes take over the project, and when we look back at the code we wrote,
<! DOCTYPE HTML >
When we create a new HTML page, DOCTYPE has declared that this is an HTML document, tells the browser what our document is, and, at the same time, the two words of the document, which leads to many concepts of the entire page, such as what is out of the flow of the document, and what happens when you leave the document flow
HTML--------Structure
This is a most basic page structure, HTML page parsing, is from top to bottom to parse, a node to render, draw, show
and the main content of the page, usually placed in the body tag, HTML element tags, are semantically, the body translation come on we know it in the HTML role
<!DOCTYPE HTML><HTML><Head> <title></title></Head><Body></Body></HTML>
HTML tag elements, used to display the entire page of content, including text, pictures, videos and so on, the personal feel that HTML is more like a container, can carry a lot of things, each tag, is to carry each part of the content, want to give users or site visitors to show and express the details, For example, the title is to tell the user the caption of the page
< title > page title </title>
Tag elements of the classification, there are closed tags and empty labels, and they have a lot of differences, closed tags if not closed, the browser will be normal parsing, but there will be problems, what problem you can go to write a small demo to see
Closed label
< Div > I was a div</div>
Empty label
<src= "" /></>
In CSS, tag elements in HTML are broadly divided into three different types: block elements, inline elements, and inline block elements.
The most common block elements are:
<div>, <p>,
The commonly used inline elements are:
<a>, <span>, <br>, <i>, <em>, <strong>, <label>, <q>, <var>, < Cite>, <code>
The commonly used inline block elements are:
, <input>
Every tag has a lot of properties, just as each of us has the same attributes, and there are different attributes, each of which does not work the same.
How label element attributes are spelled
< Tag Name property = attribute value > Content </Tag name >
When we write HTML code, there are a number of noteworthy issues:
1. Elements in different browsers, there are always some changes, such as the size of the input button, in Google Chrome and Firefox is not the same
2. There are elements how to use, what line elements, block elements, box model (the old IE has its own box model), the key is also these tags what use, how to use, all to think, why use div without table, how to use the most appropriate elements for page layout, reduce not
The necessary DOM nodes
3. How to annotate HTML code <!--Comment text--
CSS---------Styles
When we make the page structure perfect, we start to add style to the elements of the page, including the color of the page elements, size, the color of the text and so on to adjust the optimization
When it comes to color, the use of CSS colors is worth exploring.
The style of the page can be adjusted by:
1. The link tag introduces an external style:
<rel= "stylesheet" type= "text/css" href= " Theme.css "/>
2. Through the Style tab
< style > { background:#333; }</style>3. The Style property of the label element
<style= "font-size:18px;" > </ Div >
When we need to comment on the style
/*
Comment Content
*/
There are things to consider when adjusting the style of the page:
1. Compatible knot solutions for different browsers, as well as the attributes of each element, which property will be better, the use of attributes to pay attention to what, such as the difference between background and background-color use, which is the appropriate solution
2. Why try not to write the style of the line, why the style is to use link without import,style tag how
3. When learning CSS, it started with IDs, classes, parents, children, and so on, their usage, and the semantics of selectors.
4. How to use pseudo-class, Pseudo-Class execution order, pseudo-class is what, with the meaning of pseudo-class is what, can take to do?
5.CSS optimization rules, how to optimize the best, style sheet file How to co-ordinate
6. The core of each browser is not the same, to do a variety of compatibility, a variety of hack (compatible resolution), and of course, our favorite ie, not too happy, especially the low version of IE, wow ka ka
7. Each line of CSS why to write this, write the meaning of what, what role, if not, what will be, CSS how to optimize the best, the weight problem almost forget, there are many ~
Write a bit messy, take time to improve slowly, learn html+css, you can go to the novice tutorial to see, knocking on the inside of the small demo, organized into folders, more practice more summary there will always be a harvest and experience
Http://www.runoob.com/html/html-tutorial.html
Simple summary of the next html+css, unknowingly already November, draw time to finish html+css---"JS-----" HTML5+CSS3-----"front-end engineering, modularity, and various framework----" Personal summary
Basically this year, the basic is going to pass, the time is fast, from July graduation to now nearly 4 months
The article does not write well, light spray, what good advice for everyone to mention, after all, small white one, the introduction is not, a lot of advice ~
Front End Personal Summary (1) html+css article
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
