Xhtml+css Write a regular blog

Source: Internet
Author: User
Tags html tags

Blog's full name should be Web log, Chinese meaning is "blog", then abbreviated for blog, and blog (blogger) is to write blog people. From the understanding, the blog is "a kind of expression of personal thoughts, network links, content, in chronological order, and constantly update the way of publishing." Simply put, a blog is a class of people who are used to writing diaries online. How to apply HTML and CSS to write a beautiful regular blog:

Use a label correctly

Hyperlinks are the most HTML tags used in blogs, which link to other articles or site links, and suggest that you add the following attributes when you use a label:

HREF: Set the URL address or anchor point of the link
Target: Set the mouse to click on the link after the target window or frame page, commonly used is target= "_blank", said opened a new window to open the link to the current page to open the link does not add this attribute
Title: Sets the message displayed when the mouse is moved to the link
Rel: This is a new attribute that has only recently begun to pop. Rel= "nofollow" means that the search engine from this site link to the past, resulting in the link URL of the PageRank value changes, often used to prevent spam link;rel= "tag" This is for the Technorati set it to this link text as the tag tag for the page.

The links in the article should not be too much, too many links will allow readers to read when there is a sense of oppression and tension, if the link color and text color contrast too large, it will make people look dazzling feeling. The best link effect is a touch of color contrast or underlined, and fill in the title attribute, indicating what the link is or why it should be linked. Sometimes you can also attach a link to this article and annotate it in the list at the end of the article.

Develop a good habit of writing sections

Writing a blog can not be like the Cologne novel as a paragraph, so according to the school teacher's writing style blog is no dispute. It is suggested to use P tag to segment the article, the code is:<p> article text </p>.
It is worth mentioning that many bloggers do not have the habit of first line indentation, and some at most also in the editor to knock a few spaces, here gives the CSS text-indent attribute to achieve the first line of indentation code: <p style= "TEXT-INDENT:2EM;" > Article body </p>, indented units generally 2em, two characters, do not use percentages or other unit lengths such as PX,PT, with EM can be in the page font and layout of the situation to maintain the indentation of two characters.

For some bloggers who like to hang pictures in their posts, it is recommended that the Align property of the IMG tag be set to left or right so that the hanging of the picture and the wrap of the body can be easily achieved. You can also use the Float property of Div tag to carry around the hanging to achieve text wrapping, the better is to achieve such as Google AdSense ads around the hanging, code: <div style= "Height:100%;width:150px;float: Right; " > Here you can put a picture link, or like a foreign blog that put Google AdSense code </div>.

Use list to set row height with Line-height

Use the <ul><ol><li> tab of the Stylesheet list to make a list of some subheadings entries, code:<ul><li> problem one </li><li> question two </ Li></ul>.

Body font size can be set by personal favorite, the general use is the default blog system (13pt, XXFarEastFont-Arial and Courier New), if the text needs a large font sometimes your text appears too large and piled up, can be in the paragraph <p> add style: line-height:120 %; This means that the line height is 1.2 times times the size of the font.

The typesetting skill of super long body

Although we are in the blog to know that the article is best short and dapper, but also avoid some special nature of the article need long space, this time the proposed use of

Some other HTML that is commonly used in journals

Reference to other articles of the fragment recommended <blockquote> tag, this label can automatically achieve the page left and right at both ends of the indentation, the general default indentation 40 pixels, such as: <blockquote style= "background-color:# f7f7f7;border:1px dotted #dedbde;p adding:10px; " > This is an example of a reference style </blockquote>

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.