1. MySQL statement specifications:

1. Keywords and function names should be in all capital letters;

2. Database names, table names, and field names must all be lowercase;

3. SQL statements must end with a semicolon.

2. Common MySQL commands:

1. Display the current database version

SELECT VERSION();

2. Display the current time:

SELECT NOW();

3. Display the current user:

SELECT USER();

4. Create a database:

The syntax is:

CREATE {DATABASE | SCHEMA} [IF NOT EXISTS] db_name [DEFAULT] CHARACTER SET [=] charset_name;

I recently learned databases by myself and encountered some errors when using MySQL under the Win7 system. I made a record for future reference.

The community version of MySQL 5.5.56 was downloaded from the MySQL official website and installed normally. When I enter mysql -u root -p on the command line, an error message appears and I cannot connect to the database.

C:\Windows\system32> mysql -u root -p Enter password: ERROR 1045 (28000): Access denied for user ‘root’@’localhost’ (using password: YES)

1. The Safari browser of Apple mobile phone is not compatible with the new Date() date conversion format.

When developing web projects, countdown is a very common requirement. My need is to make a countdown to the time when concert tickets are on sale.

The idea is as follows:

Get the on-sale time and current time on the server, subtract the current time from the on-sale time to get a time in milliseconds, and then convert it into xx days xx hours xx minutes xx seconds.

I wrote an article before, introducing the method of achieving corner cutting effect based on CSS gradient. Today I will introduce another method, which is to use border-image+SVG to achieve the corner cutting effect.

How border-image works

To set a border for an element, we will use the border attribute. border is the abbreviation of border-width, border-style and border-color.

We set a border with a width of 20px, a solid line, and a color of #58a for the div.

In the flat design style, bevel corners are very popular, that is, cutting one or more corners of an element into a 45-degree notch. Most web developers tend to use background images to achieve the corner cutout effect. However, using background images will add additional HTTP requests, increase web page loading time, and make it difficult to modify and maintain. In fact, CSS is powerful enough to provide a pure CSS solution, and we can achieve the corner cutting effect using only CSS code.

In web design, we often see pictures cut into diamond shapes.

The traditional implementation method is to crop the image in advance in the image processing software. Of course, this method has poor maintainability.

Now, as the support for new features of CSS is getting better and better, CSS is becoming more and more powerful, and we can already use CSS code to implement diamond-shaped images.

1. Parallelogram

Ordinary web elements are rectangular. But sometimes, we need to create shapes that convey a sense of movement, like a parallelogram.

Speaking of skew, we will think of using the skew() method of the transform attribute to obliquely stretch ordinary rectangular elements.

width:100px; height:60px; transform: skew(-30deg);

As shown above, we get a parallelogram, but the content is also deformed diagonally. We want only the container to be tilted, but not the content. what to do?

1. border-radius

border-radius can add rounded borders to elements, such as buttons.

2. Compatibility: IE9+ and above are well compatible with border-radius

3. border-radius draws a circle

If we set a border-radius value large enough for a square element (as long as it is greater than or equal to half the side length of the square), the element can be turned into a circle. But considering that the height and width of the element may not be fixed, we can set a percentage, which is parsed based on the size of the element. When we set border-radius: 50% to a square element, we will get an adaptive circle.

Use CSS to achieve animation effects of page or image flipping

There are often animation interactive effects in web development. In the past, we could only use JavaScript to achieve it. As browsers support the new features of CSS3 better and better, many special effects can be achieved through CSS code.

When we browse the website, we can often see the animation effect of the picture flipping, such as shown in Demo 1.

1.CSS

CSS Cascading Style Sheets (Cascading Style Sheets) is a computer language used to express document styles such as HTML (an application of Standard Generalized Markup Language) or XML (a subset of Standard Generalized Markup Language).

Because CSS does not have its own programming syntax such as variables, constants, conditional statements, functions, etc. as ordinary programming languages, but only simple attribute descriptions line by line, it is quite troublesome to write, and the code is difficult to organize and maintain.