How does CSS refer to external ttf fonts?
In CSS, you can use the font-face attribute to refer to external fonts. The font-face attribute can realize the call of any external special font, for example: . ttf font. In the new font-face rule, you must first define the name of the font (such as myFirstFont), and then point to the font file. To use a font for an HTML element, please refer to the name of the font (myFirstFont) through the font-family attribute. The font-face attribute refers to a ttf font example: Example 1: Example 1: @font-face { font-family: myFirstFont; src: url('aa.ttf'), url('aa.eot'); /* IE9+ */ font-weight: bold; } Browser support for the font-face attribute: Firefox, Chrome, Safari and Opera support .ttf (True Type Fonts ) and .otf (OpenType Fonts) type fonts. Internet Explorer 9+ supports the new font-face rules, but only for fonts of type .eot (Embedded OpenType). The above is how CSS references external ttf fonts? For more details, please pay attention to other related articles on 1024programmer.com!
What is the box model of css?
The innermost box in the figure is the actual content of the element, that is, the element box, and the inner margin padding is next to the outside of the element box. Next is the border, and then the outermost layer is the margin, which constitutes the box model as a whole. Usually the background display area we set is the range of content, padding, and border. The outer margin margin is transparent and will not block other surrounding elements. Then, the total width of the element box = the width of the element (element) + the value of the left and right margins of the padding + the value of the left and right margins of the margin + the left and right width of the border; The total height of the element box = the height of the element (element) + the value of the upper and lower margins of padding + the value of the upper and lower margins of margin + the upper and lower width of border. We can transfer these attributes to the boxes (boxes) in our daily life to understand. The boxes we see in our daily life are also boxes that can…
What is css compound selector?
Css compound selector is composed of two or more basic selectors combined in different ways, the purpose is to select more Accurate and finer-grained labeling of target elements. CSS composite selectors include sub-selectors, adjacent selectors, containment selectors, multi-layer selector nesting, attribute selectors, pseudo-selectors and pseudo-element selectors. The specific usage of the above is as follows: 1. The sub-selector code is as follows: 2. Adjacent selector If you need to select an element immediately after another element, and both have the same parent element, you can use the adjacent sibling selector ( Adjacent sibling selector). For example, if you want to increase the top margin of a paragraph that appears immediately after the h1 element, you can write: h1 + p {margin-top:50px;} This selector reads: “Selects the paragraph that appears immediately after the h1 element that has a common parent with the p element”. 3. Include the selector The code is as follows: #header p{font- size:14px} #main p {font-size:12} Define the font size of the paragraph in the containing box as 14 pixelsDefine the font size of the paragraph in the containing box as 12 pixels. 4. Multi-layer selector nesting The code is as follows: #wrap #header h2 span {font -size:24px}…
What is the class selector in css?
In CSS, class selectors are shown with a dot: .center {text-align: center} In the above example, all HTML elements with class center are centered. In the HTML code below, both h1 and p elements have center class. This means that both will respect the rules in the “.center” selector. This heading will be center-aligned This paragraph will also be center-aligned. Note: The first character of the class name cannot use numbers! It doesn’t work in Mozilla or Firefox. Like id, class can also be used as a derived selector: .fancy td { color: #f60; background: #666; } In the above example, the table cells inside the larger element with the class name fancy will display orange text on a gray background. (The larger element named fancy might be a table or a div) Elements can also be selected based on their class: td. fancy { color: #f60; background: #666; } In the example above, the table cells with the class name fancy will be orange with a gray background. You can assign class fancy to any table element any number of times. Those cells labeled fancy will be orange with a gray background. Cells that are not assigned a class…
What is the grammatical structure of css?
body {background-color:blue;} Description: The body{} above is a type selector. The so-called type selector refers to a selector whose name is based on an existing tag type in a web page, body is a tag type in a web page, so is div, and so is span. So the following selectors are all type selectors, and they will control all body or div or span in the page: body{} div{} span{} The above is what is the grammatical structure of CSS? For more details, please pay attention to other related articles on 1024programmer.com!
There are several values of css text alignment property
The text-align (text alignment) attribute specifies the horizontal alignment of text within an element. value justify The last horizontal alignment property is justify, which brings its own set of problems. A value of justify will justify both ends of the text. In justified text, the left and right ends of the line of text are placed on the inner border of the parent element. Then, adjust the spacing between words and letters so that the lines are exactly equal in length. You may have noticed that justified text is very common in the printing world. In CSS, though, there is a little more thought to be done. It is up to the user agent (not CSS) to determine how justified text stretches to fill the space between the left and right borders of the parent element. For example, some browsers may only add extra space between words, while others may evenly distribute the extra space between letters (though the CSS specification specifically states that if the letter-spacing property is specified as a length value, “User Proxies cannot further increase or decrease the space between characters”). Also some user agents may reduce the space on some lines, squeezing the text closer…
What does cssright mean?
The right property in css specifies the right edge of the element. This property defines the offset between the right margin boundary of a positioned element and the right boundary of its containing block. Note: If the value of the “position” attribute is “static “, then setting the “right” attribute has no effect. For static elements, auto; for length values, the corresponding absolute length; for percentage values, the specified value; otherwise, auto. For relatively defined elements, left always evaluates to equal right. Example: Sets the right edge of an image 5 pixels to the left of the right edge of its containing element: img { position:absolute;right:5px;} The above is what does css right mean? For more details, please pay attention to other related articles on 1024programmer.com !
What is the css class selector?
CSS class selector class selector allows styling to be specified in a way that is independent of document elements. This selector can be used alone or in combination with other elements. Tip: These selectors can only be used if the document is marked up appropriately, so using them usually requires some forethought and planning. The most common way to apply styles regardless of specific design elements is to use class selectors. In CSS, the class selector is displayed with a dot, for example: .center {text-align: center} In the example above, all HTML elements with a center class are centered. In the HTML code below, both h1 and p elements have center class. This means that both will respect the rules in the “.center” selector. This heading will be center-aligned This paragraph will also be center-aligned. Note: The first character of the class name cannot use numbers! It doesn’t work in Mozilla or Firefox. Combined with other selectors Class selectors can be used in conjunction with other selectors, for example: element selectors. For example, you may want only paragraphs to appear as red text: p.center{color:red;} The selector will now match all p elements whose class attribute contains center, but not elements…
How to add comments in css?
/* css comment instance */ /* body definition */ body{ text-align:center; margin:0 auto;} /* header css definition */ #header{ width:960px; height:120px;} If we encounter special instructions in writing CSS, we can use CSS annotations for annotations. Comments are helpful for others to read and understand the developed CSS code, and reasonable use of comments to minimize the use of comments is conducive to compatibility and file size reduction. The above is how to add comments to css? For more details, please pay attention to other related articles on 1024programmer.com!