Home  >  Article  >  Web Front-end  >  How to change the word position in css

How to change the word position in css

藏色散人
藏色散人Original
2021-03-22 11:37:215230browse

How to change the font position in css: 1. Set the font position through text-align; 2. Use padding and margin to set the font position; 3. Use text-indent to set the font position; 4. Set through position The position of the font.

How to change the word position in css

The operating environment of this article: Windows7 system, css3 version, DELL G3 computer

css can use the text-align attribute to set the font position, text- The align attribute is used to set the alignment of text, such as left-aligned, right-aligned, and center-aligned content. CSS font position can also be achieved by setting padding, margin, text-indent, and position.

css sets the font position

1. text-align sets the font position

text-align syntax:

text-align : left | right | center | justify

text -align parameter value and description:

left: left alignment

right: right alignment

center: center

*justify: align both ends (not aligned Recommended, usually not used by most browsers)

Example:

p{
    text-align: left; /* 位置居左 */
    text-align: center; /* 位置居中 */
    text-align: right; /* 位置居右 */
}

2, padding, margin set font position

padding this attribute sets all internal margins of the element Width, or set the width of the padding on each side. Padding set on inline, non-replaced elements does not affect line height calculations; therefore, if an element has both padding and a background, it may visually extend into other lines and possibly overlap other content. . The element's background extends across the padding. Negative margin values ​​are not allowed.

The margin attribute sets the width of all margins of an element, or sets the width of the margins on each side.

Example:

p{
    padding: 100px 200px; /* 文字距离上下有100px内边距 距离左右有200内边距 */
    margin: 100px 200px; /* 文字距离上下有100px外边距 距离左右有200外边距 */
}

3. text-indent sets the font position

The text-indent attribute specifies the indentation of the first line of text in the text block.

Example:

p{
    text-indent: 50px; /* 首行缩进50px */
}

4. Position sets the position of the font

The position attribute specifies the positioning type of the element. When the set value is absolute, relative, or fixed, you can use the top, right, bottom, and left attributes for positioning.

p{
    position: fixed; /* 相对于浏览器窗口定位 */
    left: 100px;     /* 距离浏览器左边100px */
    top: 200px;      /* 距离浏览器上边200px */
}

【Recommended learning: css video tutorial

The above is the detailed content of How to change the word position in css. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn