Home › Language Notes › CSS

CSS

31 Chapter

Cascading Style Sheets (CSS) is a computer language used to define the styling of documents such as HTML (an application of the Hypertext Markup Language) or XML (a subset of the Hypertext Markup Language). CSS not only allows for the static styling of web pages but can also be used in conjunction with various scripting languages to dynamically format various elements on a webpage.

css background image is fixed and does not scroll (background Language Notes CSS

background-attachment attribute body { background-image:url('smiley.gif'); background-repeat:no-repeat; background-attachment:fixed; } Tag definition and usage instructions background-atta…

2022-11-06 11:20:49 👁 210

CSS border Language Notes CSS

`div{border: 2px solid; border-radius: 25px;}` – Definition and Usage: The `border-radius` property is an shorthand property used to set the values for all four border-radius properties. Note: This property allows you to add rounded corners to an element! Default value: 0; Inheritance: no; Version: CSS3; JavaScript syntax: `ob...`

2022-11-06 11:20:49 👁 175

What does css normalize.css do? Language Notes CSS

Normalize.css ensures a more consistent rendering of all HTML elements across browsers and aligns them with modern web standards. It applies only to styles that require normalization. Although Normalize.css is a very small CSS file, it provides highly consistent styling across browsers for complex HTML elements. Compared to traditional CSS resets, Nor...

2022-11-06 11:20:49 👁 344

Pitfalls of css3 responsive layout Language Notes CSS

When implementing a responsive layout, due to limited familiarity with floating layouts, I opted to use the latest CSS3 Flexbox and Grid layouts instead – which led to some unexpected challenges during the implementation. Previous code: @media (max-width: 570px) {} @media (max-width: 992px) {} Note: When writing CSS, it's best to clearly define the responsive scope; if you only...

2022-11-06 11:20:49 👁 119

Summary of css3 border properties (how to set the border dotted line?) Language Notes CSS

`border` syntax: `border: <line-width> || <line-style> || <color>; <line-width> = <length> | thin | medium | thick; <line-style>...`

2022-11-06 11:20:49 👁 243

A website thumbnail generator written in html+css Language Notes CSS

:: (Unhappy) The thumbnails for template websites are all really nice, so I thought, "Why not give it a try?" – and then I ended up just giving up: @ (Acting wealthy) I only created a version for the PC – you can just take screenshots of it on your computer:: (Cunning) Purpose: Allows you to generate your own website thumbnail previews {hide}{cloud title="Hongmu Website Thumbnail Generation Source Code"; type="lz"; url="htt..."}

2022-11-06 11:20:49 👁 125

After css is floated, the parent box has no height solution Language Notes CSS

As shown below, the child element div2 itself has height and width, but since it has float:left; attribute. Its parent element div1 has no height. <html> <head> </head> <body> <div id="div1"> <…

2022-11-06 11:20:47 👁 171

css positioning Language Notes CSS

2022-11-06 11:20:47 👁 119

css3 2D animation (transform) Language Notes CSS

transform syntax: transform: none | <transform-function>+ transform-function list: matrix() = matrix(<number>[,<number>]{5,5}) matrix3d() =…

2022-11-06 11:20:47 👁 161

css vh and vw adaptive Language Notes CSS

In the mobile terminal, REM is used to change the root HTML, and the mobile terminal adaptation is realized through a piece of JS. This article uses pure CSS viewport units to self-adapt. Although the current compatibility is not fully acceptable, it does not prevent you from recognizing the power of vw and vh. The implementation of responsive layout relies on media queries (Media Queries). Select the width size of mainstream devices as breakpoints to target...

2022-11-06 11:20:47 👁 356

‹ 1 2 3 4 ›